iOS에서 UILabels 텍스트의 기준선을 다른 글꼴 크기로 정렬하는 방법은 무엇입니까?

Question

UILabels에서 텍스트의 기준선을 정렬해야합니다. 현재 내가하고있는 것은 텍스트가 포함 된 UILabels의 기준선을 정렬하는 것이며 두 레이블의 텍스트 글꼴 크기가 다른 경우 UILabels 기준선이 정렬되지만 텍스트의 기준이 잘못 정렬됩니다 (작은 여백으로 정렬되지 않음). 어긋난). 레이블은 사용자 정의 UIView 하위 클래스에 포함되므로 self은 포괄적 인 UIView를 참조합니다.

여기에 관련 코드를 아래에 링크 된 이미지의 aligment에서

[self.mySmallLabel sizeToFit]; 
[self.myBigLabel sizeToFit]; 

self.mySmallLabel.frame = CGRectMake(0,  
            self.bounds.size.height - self.mySmallLabel.bounds.size.height, 
            self.mySmallLabel.bounds.size.width, 
            self.mySmallLabel.bounds.size.height); 

self.myBigLabel.frame = CGRectMake(self.mySmallLabel.frame.origin.x + self.mySmallLabel.bounds.size.width, 
            self.bounds.size.height - self.myBigLabel.bounds.size.height, 
            self.myBigLabel.bounds.size.width, 
            self.myBigLabel.bounds.size.height); 
[self.mySmallLabel sizeToFit]; 
[self.myBigLabel sizeToFit]; 

이 코드의 결과이다.

당신이 볼 수 있듯이

는 UILabel의베이스 라인이 정렬에도 불구하고, 텍스트의 기준선은 소폭 잘못 정렬됩니다. 텍스트의 기준선을 동적으로 정렬하려면 어떻게해야합니까 (글꼴 크기가 런타임에 변경 될 수 있기 때문에)?

Answer 1

나는 다른 장소의 몇 this answer을 사용했지만,베이스 라인은 때때로 레티 나 디스플레이의 픽셀 떨어져 있었다. 코드 조각은 아래 화면의 규모를 차지한다 :

[majorLabel sizeToFit]; 
[minorLabel sizeToFit]; 

CGRect changedFrame = minorLabel.frame; 
changedFrame.origin.x = CGRectGetWidth(majorLabel.frame); 

const CGFloat scale = [UIScreen mainScreen].scale; 
const CGFloat majorLabelBaselineInSuperView = CGRectGetMaxY(majorLabel.frame) + majorLabel.font.descender; 
const CGFloat minorLabelBaselineInOwnView = CGRectGetHeight(minorLabel.frame) + minorLabel.font.descender; 
changedFrame.origin.y = ceil((majorLabelBaselineInSuperView - minorLabelBaselineInOwnView) * scale)/scale; 

minorLabel.frame = changedFrame; 

Answer 2

나는 이것을 직접 (지금 당장)하려고했는데 almost identical question에 내 대답을 발견했습니다. 그것은 간단한 해결책은 아니지만, 우리는 수학을해야합니다.

나는 두 개의 다른 레이블로 작업해야하는데 서브 클래스는 UIView입니다.

- (void)layoutSubviews { 
    [majorLabel sizeToFit]; 
    [minorLabel sizeToFit]; 

    CGRect changedFrame = minorLabel.frame; 
    changedFrame.origin.x = majorLabel.frame.size.width; 
    changedFrame.origin.y = (majorLabel.frame.size.height + majorLabel.font.descender) - (minorLabel.frame.size.height + minorLabel.font.descender); 
    minorLabel.frame = changedFrame; 
} 

Answer 3

당신은 간단한 계산에 UIFont의 윗쪽 값을 사용하여 UILabels의 쌍에 대한 완벽한 픽셀 기준 정렬을 얻을 수 있습니다. font.ascender 값이 소수가 될 수 있기 때문에

[majorLabel sizeToFit]; 
[minorLabel sizeToFit]; 

CGRect changedFrame = minorLabel.frame; 
changedFrame.origin.y = ceilf(majorLabel.frame.origin.y + (majorLabel.font.ascender - minorLabel.font.ascender)); 
minorLabel.frame = changedFrame; 

ceilf()를 사용하는 방법은 다음과 같습니다.

저는 이것을 망막 및 비 망막 장치 모두에서 우수한 결과와 함께 테스트했습니다. x 축에서 두 레이블을 서로에 대해 상대적으로 배치하는 것은 필요에 따라 다를 수 있습니다. UIFont 승자가 (다른 UIFont 정보와 함께) 무엇인지에 대한 간단한 설명이 필요하면이 명확하고 간결한 체크 아웃 article.