画像とテキスト設定UIbutton

オリジナル住所:: https://www.jianshu.com/p/65d559614efc

 

需要に応じて、時にはあなたがする必要がbutton使用必要とする、写真やテキストを追加buttonするtitleEdgeInsetsと、imageEdgeInsetsプロパティを。良いとが、同時にこれら二つの制御感触悪いを使用して、多くの時間title以下の絵ではなく中央にありません。長時間悩ん、我々は少し今日の勉強、総括します。

---

UIEdgeInsets

typedef struct UIEdgeInsets {
    CGFloat top, left, bottom, right;  // specify amount to inset (positive) for each of the edges. values can be negative to 'outset'
} UIEdgeInsets;

4つのパラメータの内部にボタンの中心にタイトル/画像、下境界、右境界、デフォルトはゼロで、境界、左境界線からの距離を表します

---

コードの最初、ピクセル画像を使用して55 * 55であります

    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
    btn.backgroundColor = [UIColor orangeColor];
    btn.frame = CGRectMake(100, 100, 80, 80);
    [btn setImage:[UIImage imageNamed:@"致电我们-图标"] forState:0];
    [btn setTitle:@"1234" forState:0];
    [btn setTitleColor:[UIColor whiteColor] forState:0];
    
    [btn setImageEdgeInsets:UIEdgeInsetsMake(5, 25, 45, 25)];
    [btn setTitleEdgeInsets:UIEdgeInsetsMake(50, 0, 5, 0)];
    
    [self.view addSubview:btn];

BTNを定義し、私は私が間違っていた見て実行し、正しいボタンを示すことができたと思いました。テキストは表示されませ。

9E93E830-8405-473C-A364-E7397DA5D971.png

繰り返しテストの後、我々はセットを見つけました

[btn setTitleEdgeInsets:UIEdgeInsetsMake(50, -55, 5, 0)];

テキストを作成するだけでは、中心と表示された;しかし、再び、画像はピクセルとなり、そしてどこへ行くのテキストの残りの部分を走りました。だから、最終的な解決策探る：画像を設定し、その後、画像の下にテキストを設定、およびするが（より画像ピクセルことを提供button本当にピクセルのピクセルが小さく、あなたは静止画を押す必要があります）

[btn setTitleEdgeInsets:UIEdgeInsetsMake(50, -btn.imageView.bounds.size.width, 5, 0)];
[btn setImageEdgeInsets:UIEdgeInsetsMake(5, 25, 45, 25)];

200C4F64-A9CE-402B-90DB-3652DC6D78FD.png

---

同様に、左右の画像とテキスト表示

直接コードに

    UIButton *btn1 = [UIButton buttonWithType:UIButtonTypeCustom];
    btn1.backgroundColor = [UIColor orangeColor];
    btn1.frame = CGRectMake(100, 250, 100, 60);
    [btn1 setImage:[UIImage imageNamed:@"致电我们-图标"] forState:0];
    [btn1 setTitle:@"电话" forState:0];
    [btn1 setTitleColor:[UIColor whiteColor] forState:0];
   
    [btn1 setTitleEdgeInsets:UIEdgeInsetsMake(15, -btn1.imageView.bounds.size.width + 40, 15, 0)];
    [btn1 setImageEdgeInsets:UIEdgeInsetsMake(10, 5, 10, 55)];   //40 * 40
    
    [self.view addSubview:btn1];

ディスプレイ

 

7AB616A1-1BB8-4CB2-BC5A-3FD59A7B16A4.png

---

概要

つまり、セットbutton時にこれらの二つの特性、画素約実際の画像。複数の場合button、それは、画像のピクセルが同じであることを確認するのが最善です。