文本不适合特定字体的UIButton titleLabel高度

时间:2015-01-07 18:46:55

标签: ios objective-c fonts uibutton

我使用的特定字体遇到了一些麻烦。它是为学校制作的,因此A和Å的高度不同。我认为这会给我的UIButton带来麻烦。我试图解决它,但似乎无法做到正确。这是我上次尝试过的:

[self setValue:[UIFont fontWithName:@"fontname" size:220] forKeyPath:@"button1.font"];
[self setValue:[UIFont fontWithName:@"fontname" size:220] forKeyPath:@"button2.font"];
[self setValue:[UIFont fontWithName:@"fontname" size:220] forKeyPath:@"button3.font"];
[button1 setTitle:@"A" forState:UIControlStateNormal];
[button2 setTitle:@"Å" forState:UIControlStateNormal];
[button3 setTitle:@"Å" forState:UIControlStateNormal];
[button2 setBackgroundColor:[UIColor blackColor]];
[button2 setFrame:CGRectMake(button2.frame.origin.x, button2.frame.origin.y, button2.frame.size.width, button2.frame.size.height+100)];
[button2.titleLabel setFrame:CGRectMake(button2.frame.origin.x, button2.frame.origin.y, button2.frame.size.width, button2.frame.size.height)];
button2.contentVerticalAlignment = UIControlContentVerticalAlignmentBottom;

结果如下:

The Å is not displayed properly.

如您所见,Å显示不正确。我该如何解决这个问题?

谢谢!

祝你好运, 乔金姆

7 个答案:

答案 0 :(得分:16)

我使用以下方法解决问题。

假设你的xib或storyboard中有一个UIButton, 那么

  1. 选择UIButton
  2. 转到属性检查器
  3. 查找控制类别
  4. 查找对齐
  5. 选择垂直属性的最右侧按钮!
  6. enter image description here

答案 1 :(得分:3)

修改

这种特殊字体与实际绘制方式有些奇怪。特别是,它从中心/基线偏移了一点点“上升”。

原始

我必须使用UILabel做类似的事情,这就是我为了适应UIButton子类所做的工作:

//  PaddedButton.h
#import <UIKit/UIKit.h>
@interface PaddedButton : UIButton
@property (assign, nonatomic) UIEdgeInsets padding;
@end

//  PaddedButton.m
#import "PaddedButton.h"
@implementation PaddedButton
- (CGSize)intrinsicContentSize {
    CGSize size = [super intrinsicContentSize];
    return CGSizeMake(size.width + self.padding.left + self.padding.right, size.height + self.padding.top + self.padding.bottom);
}
@end

然后,在我的UIViewController子类中,我以这种方式实例化了一个按钮:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.buttonFontSize                     = 200;
    self.buttonFont                         = [UIFont systemFontOfSize:self.buttonFontSize];
    self.button                             = [[PaddedButton alloc] init];
    self.button.backgroundColor             = [[UIColor blackColor] colorWithAlphaComponent:0.4f];
    self.button.contentVerticalAlignment    = UIControlContentVerticalAlignmentBottom;
    self.button.padding                     = UIEdgeInsetsMake(10, 10, 10, 10);
    [self.button setAttributedTitle:[[NSAttributedString alloc] initWithString:@"Å" attributes:@{NSFontAttributeName: self.buttonFont}] forState:UIControlStateNormal];
    [self.button setTranslatesAutoresizingMaskIntoConstraints:NO];
    [self.view addSubview:self.button];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button]-|"
                                                                     options:0
                                                                     metrics:nil
                                                                        views:@{@"button": self.button}]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(40)-[button]"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:@{@"button": self.button}]];
}

新代码部分

经过一段时间的努力,我突然想到有更简单的方法可以做到这一点。此外,当尝试使用具有集合titleattributedTitle的按钮时,事情变得非常糟糕,按钮绘制其标题,然后我的代码在正确的位置重新绘制标题。

最后,我提出了这个解决方案,这似乎运作良好:

按钮类

//  PaddedButton.h
#import <UIKit/UIKit.h>
@interface PaddedButton : UIButton
@property (strong, nonatomic) NSString      *title;
@property (assign, nonatomic) UIEdgeInsets   padding;
@property (strong, nonatomic) UIFont        *font;
@end

//  PaddedButton.m
#import "PaddedButton.h"
@implementation PaddedButton
- (CGSize)intrinsicContentSize {
    NSAttributedString *title   = [[NSAttributedString alloc] initWithString:self.title attributes:@{NSFontAttributeName: self.font}];
    CGRect textRect             = [title boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin context:nil];
    CGSize textSize             = textRect.size;
    return CGSizeMake(textSize.width + self.padding.left + self.padding.right, textSize.height + self.padding.top + self.padding.bottom);
}
- (void)drawRect:(CGRect)rect {
    NSAttributedString *title   = [[NSAttributedString alloc] initWithString:self.title attributes:@{NSFontAttributeName: self.font}];
    CGRect textRect             = [title boundingRectWithSize:CGSizeMake(MAXFLOAT, MAXFLOAT) options:NSStringDrawingUsesLineFragmentOrigin context:nil];
    textRect                    = CGRectIntegral(textRect);
    CGFloat xOffset             = (rect.size.width  - textRect.size.width)  / 2.0f;
    CGFloat yOffset             = (rect.size.height - textRect.size.height) / 2.0f;
    CGRect titleRect            = CGRectMake(xOffset, yOffset, textRect.size.width, textRect.size.height);
    // Show the bounding rect where the button WANTS to put the title
    CGContextRef ctx            = UIGraphicsGetCurrentContext();
    CGContextStrokeRect(ctx, titleRect);
    // From my testing, this offset will center the "Å" (accented) character.
    // The "A" (no accent) will be offset a little bit below center, due to the lack of accent.
    // You might want to play around with exactly what particular value is best.
    titleRect                   = CGRectOffset(titleRect, 0.0f, titleRect.size.height * 36.0f / 276.0f);
    NSLog(@"titleRect: %@", NSStringFromCGRect(titleRect));
    [title drawInRect:titleRect];
}
@end

View Controller中的按钮设置

#pragma mark -
#pragma mark - UI Setup
- (void)setupUserInterface {
    [self createConstants];
    [self createControls];
    [self setupControls];
    [self layoutControls];
    self.view.backgroundColor   = [UIColor whiteColor];
}
- (void)createConstants {
    self.buttonFontSize         = 200;
    self.buttonFont             = [UIFont fontWithName:@"Skolrak" size:self.buttonFontSize];
}
- (void)createControls {
    self.button                 = [[PaddedButton alloc] init];
}
- (void)setupControls {
    self.button.backgroundColor             = [[UIColor blackColor] colorWithAlphaComponent:0.4f];
    self.button.contentVerticalAlignment    = UIControlContentVerticalAlignmentBottom;
    self.button.font                        = self.buttonFont;
    self.button.title                       = @"Å";
    self.button.title                       = @"A";
    self.button.padding                     = UIEdgeInsetsMake(10, 10, 10, 10);
    [self.button setTranslatesAutoresizingMaskIntoConstraints:NO];
}
- (void)layoutControls {
    [self.view addSubview:self.button];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"H:|-[button]-|"
                                                                     options:0
                                                                     metrics:nil
                                                                        views:@{@"button": self.button}]];
    [self.view addConstraints:[NSLayoutConstraint constraintsWithVisualFormat:@"V:|-(20)-[button]"
                                                                      options:0
                                                                      metrics:nil
                                                                        views:@{@"button": self.button}]];
}

以下是我的结果(仅显示框以查看按钮想要放置标题的位置): Accented Letter Non-accented Letter

这适合你吗?

答案 2 :(得分:1)

我自己发布了这个问题的另一个答案。 在我遇到字体的其他问题后,我决定在字体编辑器中编辑字体,我使用了字形。 当我在对其他角色进行一些编辑后导出字体时,Å开始在我的应用程序中工作。 因此,在代码中进行自定义优化之前,请尝试使用字体编辑器重新生成字体。

答案 3 :(得分:0)

我对阿拉伯字体有同样的问题。为此,我只在viewdidlayoutsubviews中设置了titlelabel的框架。 试试这个..希望它有所帮助..让我知道它是否也适合你:)

-(void)viewDidLayoutSubviews {
       [super viewDidLayoutSubviews];
       [button2.titleLabel setFrame:CGRectMake(button2.frame.origin.x, button2.frame.origin.y, button2.frame.size.width, button2.frame.size.height)];
}

答案 4 :(得分:0)

只需增加按钮高度几点。它对我有用

答案 5 :(得分:0)

如果您还有一张图片,并且不希望它缩放,这对我有用

btn.contentVerticalAlignment = .fill
btn.contentMode = .center
btn.imageView?.contentMode = .scaleAspectFit

答案 6 :(得分:0)

我遇到的情况与@YuAnShaolinMaculelêLai提到的一样

Swift 3.2代码是: button.contentVerticalAlignment = .fill