ボタンの背景に画像を設定する

Tatsuro Ueda edited this page Mar 7, 2014 · 3 revisions

ボタンの背景画像を設定する

  • ボタンの背景画像を設定するには、UIButtonのsetBackgroundImage:forState:メソッドを使う
  • このメソッドもforState引数に指定する定数によって、通常時、ハイライト時、無効時の背景画像をそれぞれ設定することができる
  • setBackgroundImage:forState:メソッドとsetImage:forState:メソッドを同時に使うことができる

ボタンのマージンを調整する

  • ボタンに表示するコンテンツとボタンの枠の間のマージンを設定するにはcontentEdgeInsetsプロパティを使う
    UIButton *button = [UIButton buttonWithType:UIButtonTypeRoundedRect];
    button.frame = CGRectMake(50, 50, 150, 40);
    button.titleLabel.font = [UIFont boldSystemFontOfSize:24];
    [button setTitle:@"UIButton" forState:UIControlStateNormal];
    UIImage *image = [UIImage imageNamed:@"image.png"];
    [button setImage:image forState:UIControlStateNormal];
    UIEdgeInsets insets;
    insets.top = insets.bottom = insets.left = insets.right = 20;
    button.contentEdgeInsets = insets;
  • こうしてマージンを指定したボタンは、ボタンの外側とコンテンツ(画像とタイトル)の間に設定した空間ができる。
  • マージンは画像とタイトルそれぞれに個別に設定することができる
    • 画像のマージン:imageEdgeInsetsプロパティ
    • タイトルのマージン:titleEdgeInsetsプロパティ

ボタン画像を伸縮させる

    UIImage *buttonImage = [UIImage imageNamed:@"resizableButton.png"];
    UIEdgeInsets insets = UIEdgeInsetsMake(17, 5, 17, 5);
    UIImage *resizableButton = [buttonImage resizableImageWithCapInsets:insets];

タイトルの改行/トランケート方法を設定する

  • ボタンの改行/トランケートの方法を指定するには、UIButtonのtitleLabelプロパティのlineBreakModeプロパティを設定する
  • button.titleLabel.lineBreakModeには、デフォルトでNSLineBreakByTruncatingMiddleが設定されている
  • このため、2行目を表示するスペースがあっても、1行に入りきらないタイトルを指定した場合、タイトルの中間部分が省略される
  • 改行して2行目以降まで表示させたい場合には、button.titleLabel.lineBreakMode = NSLineBreakByWordWrappingNSLineBreakByCharWrappingを指定する