UIButtonタイトルの表示位置や余白の調整方法



UIKitのUIButtonのタイトルはデフォルトでは中央寄せです。
そのタイトルを左寄せや右寄せにする方法や余白の付け方について解説します。

  1. UIButtonのタイトルを右寄せや左寄せにする
  2. タイトル等の余白の設定方法


UIButtonのタイトルを右寄せや左寄せにする



タイトルの左寄せや右寄せはプロパティが用意されていますので、
専用の値をセットするだけで簡単に指定する事が出来ます。

contentHorizontalAlignmentプロパティに対してUIControlContentHorizontalAlignmentLeftを指定すれば左寄せ、
UIControlContentHorizontalAlignmentRightを指定すれば右寄せとなります。


// UIButtonを作成
UIButton* button = [[[UIButton alloc] init] sutorelease];

// タイトルを設定
[button setTitle:@"abcd" forState:UIControlStateNormal];

// タイトルの左寄せ
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;

// タイトルの右寄せ
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentRight;

// 追加する
[self.view addSubview:button];



タイトル等の余白の設定方法



左右にタイトルを寄せると、ピッチリ寄せてしまうので見難くなってしまいます。
そこで、パディング(余白)をつけましょう。

タイトルの余白の付け方はtitleEdgeInsetsプロパティに対して余白値の設定を与えてやります。

UIButtonのタイトルにpaddingをつけるには、

// タイトルに余白をつける
button.titleEdgeInsets = UIEdgeInsetsMake(CGFloat top, CGFloat left, CGFloat bottom, CGFloat right);


UIEdgeInsetsMakeの指定値は全てfloatで指定し、
パディングの指定順序は上、左、右、下の順序で指定します。

また、パディングは画像にも指定する事が出来ます。
その場合、プロパティがimageEdgeInsetsに変わるだけで、指定の方法は同じです。


// 画像に余白をつける
button.imageEdgeInsets = UIEdgeInsetsMake(CGFloat top, CGFloat left, CGFloat bottom, CGFloat right);


他にも、コンテンツに対しての余白設定プロパティも用意されています。

// コンテンツに余白をつける
button.contentEdgeInsets = UIEdgeInsetsMake(CGFloat top, CGFloat left, CGFloat bottom, CGFloat right);





細かいデザインを構築する際には多用するプロパティ、メソッドですので、
しっかりと身に付けておきましょう。



コメントをお待ちしています

人気の投稿

Category

Algorithm (2) Android (8) ASP/aspx (1) Blogger (2) C/C++ (1) Chrome (5) CSS (9) Firefox (4) Fortran (1) Google (9) GoogleMap (2) HTML (12) IE (3) Information (4) iOS (2) iPhone/iPad/iPod (2) Java (6) JavaScript (16) jQuery (9) JSP (1) LifeRecipe (5) Linux (2) Macintosh (2) MapKit (4) Marketing (7) MySQL (3) NAMAZU (2) Objective-C (7) Other (7) Perl (1) PHP (9) Python (1) RSS/Atom (2) Ruby (1) Safari (2) SEO (11) Smarty (2) SQL (2) Tex (1) Three.js (1) Twitter (1) TwitterLog (313) UIKit (5) Unix (1) VBA/VBS (1) Windows (5) WordPress (3) Writing (5) XAMPP (1) XML (1) Yahoo (2) ZendFramework2 (14)

Archives