web-dev-qa-db-ja.com

UIButtonsの背景色を変更することはできますか？

これには困惑しています。

Cocoa for iPhoneでUIButtonの背景色を変更することはまったく可能ですか？背景色を設定しようとしましたが、角のみが変更されます。 setBackgroundColor:がそのようなものに利用できる唯一の方法のようです。

[random setBackgroundColor:[UIColor blueColor]];
[random.titleLabel setBackgroundColor:[UIColor blueColor]];
objective-ciphonecocoa-touchuibutton
105
dubbeat

これは、レプリカを作成することでプログラムで実行できます。

loginButton = [UIButton buttonWithType:UIButtonTypeCustom];
[loginButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
loginButton.backgroundColor = [UIColor whiteColor];
loginButton.layer.borderColor = [UIColor blackColor].CGColor;
loginButton.layer.borderWidth = 0.5f;
loginButton.layer.cornerRadius = 10.0f;

編集：もちろん、あなたは#import <QuartzCore/QuartzCore.h>する必要があります

編集：すべての新しい読者には、「別の可能性」として追加されたいくつかのオプションも考慮する必要があります。あなたの検討のため。

これは古い答えなので、トラブルシューティングのためにコメントを読むことを強くお勧めします

159
Stian Storrvik

別のアプローチがありますが、

[btFind setTitle:NSLocalizedString(@"Find", @"") forState:UIControlStateNormal];    
[btFind setBackgroundImage:[CommonUIUtility imageFromColor:[UIColor cyanColor]] 
        forState:UIControlStateNormal];
btFind.layer.cornerRadius = 8.0;
btFind.layer.masksToBounds = YES;
btFind.layer.borderColor = [UIColor lightGrayColor].CGColor;
btFind.layer.borderWidth = 1;

CommonUIUtilityから、

+ (UIImage *) imageFromColor:(UIColor *)color {
    CGRect rect = CGRectMake(0, 0, 1, 1);
    UIGraphicsBeginImageContext(rect.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [color CGColor]);
    //  [[UIColor colorWithRed:222./255 green:227./255 blue: 229./255 alpha:1] CGColor]) ;
    CGContextFillRect(context, rect);
    UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return img;
}

#import <QuartzCore/QuartzCore.h>を忘れないでください

59
karim

UIButtonTypeRoundedRectを持つUIButtonについて話していると思いますか？その背景色を変更することはできません。背景色を変更しようとすると、ボタンが描画される四角形の色を変更することになります（通常はクリアです）。そのため、2つの方法があります。 UIButtonをサブクラス化してその-drawRect:メソッドを上書きするか、さまざまなボタン状態の画像を作成します（これはまったく問題ありません）。

Interface Builderで背景画像を設定する場合、IBはボタンが持つことができるすべての状態の画像の設定をサポートしていないことに気付くはずです。そのため、次のようなコードで画像を設定することをお勧めします。

UIButton *myButton = [UIButton buttonWithType:UIButtonTypeCustom];
[myButton setBackgroundImage:[UIImage imageNamed:@"normal.png"] forState:UIControlStateNormal];
[myButton setBackgroundImage:[UIImage imageNamed:@"disabled.png"] forState:UIControlStateDisabled];
[myButton setBackgroundImage:[UIImage imageNamed:@"selected.png"] forState:UIControlStateSelected];
[myButton setBackgroundImage:[UIImage imageNamed:@"higligted.png"] forState:UIControlStateHighlighted];
[myButton setBackgroundImage:[UIImage imageNamed:@"highlighted+selected.png"] forState:(UIControlStateHighlighted | UIControlStateSelected)];

最後の行は、選択および強調表示された状態（IBでは設定できない状態）に画像を設定する方法を示しています。ボタンが選択された状態を必要としない場合、選択された画像（行4と6）は必要ありません。

32
stigi

別の可能性：

  1. Interface BuilderでUIButtonを作成します。
  2. タイプに「カスタム」を指定します
  3. 現在、IBでは背景色を変更することができます

ただし、ボタンは正方形であり、それは私たちが望むものではありません。このボタンへの参照を使用してIBOutletを作成し、viewDidLoadメソッドに次を追加します。

[buttonOutlet.layer setCornerRadius:7.0f];
[buttonOutlet.layer setClipToBounds:YES];

QuartzCore.hをインポートすることを忘れないでください

28
wubbe

UIButtonをサブクラス化し、setHighlightedおよびsetSelectedメソッドをオーバーライドします

-(void) setHighlighted:(BOOL)highlighted {

  if(highlighted) {
    self.backgroundColor = [self.mainColor darkerShade];
  } else {
    self.backgroundColor = self.mainColor;
  }
  [super setHighlighted:highlighted];
}

-(void) setSelected:(BOOL)selected {

  if(selected) {
    self.backgroundColor = [self.mainColor darkerShade];
  } else {
    self.backgroundColor = self.mainColor;
  }
  [super setSelected:selected];
}

私のdarkerShadeメソッドは、このようなUIColorカテゴリにあります

-(UIColor*) darkerShade {

  float red, green, blue, alpha;
  [self getRed:&red green:&green blue:&blue alpha:&alpha];

  double multiplier = 0.8f;
  return [UIColor colorWithRed:red * multiplier green:green * multiplier blue:blue*multiplier alpha:alpha];
}
17
Mugunth

colored UIButton

画像を使用したくない場合で、Rounded Rectスタイルとまったく同じように見せたい場合は、これを試してください。同一のフレームと自動サイズ変更マスクを使用してUIViewをUIButton上に配置し、アルファを0.3に設定し、背景を色に設定するだけです。次に、下のスニペットを使用して、色付きのオーバーレイビューから丸いエッジを切り取ります。また、UIViewのIBで[User Interaction Enabled]チェックボックスをオフにして、タッチイベントを下のUIButtonにカスケードできるようにします。

副作用の1つは、テキストも色付けされることです。

#import <QuartzCore/QuartzCore.h>

colorizeOverlayView.layer.cornerRadius = 10.0f;
colorizeOverlayView.layer.masksToBounds = YES;
7
Jacob Jennings

別の可能性（最高で最も美しい私見）：

Interface Builderで、必要な背景色の2つのセグメントでUISegmentedControlを作成します。タイプを「bar」に設定します。次に、セグメントを1つだけに変更します。 Interface Builderは1つのセグメントを受け入れないため、プログラムでそれを行う必要があります。

したがって、このボタンのIBOutletを作成し、これをビューのviewDidLoadに追加します。

[segmentedButton removeSegmentAtIndex:1 animated:NO];

これで、指定した背景色の美しい光沢のある色付きボタンができました。アクションには、「値が変更された」イベントを使用します。

（これは http://chris-software.com/index.php/2009/05/13/creating-a-Nice-glass-buttons/ で見つけました）。クリスありがとう！

7
wubbe

さて、私はあなたがUIButtonの背景色を変更することはできないと99％肯定しています。代わりに、背景画像を自分で変更する必要がありますが、これは苦痛だと思います。私はこれをしなければならなかったことに驚いています。

私が間違っている場合、または背景画像を設定せずにもっと良い方法がある場合はお知らせください

[random setBackgroundImage:[UIImage imageNamed:@"toggleoff.png"] forState:UIControlStateNormal];
    [random setTitleColor:[UIColor darkTextColor] forState:UIControlStateNormal];


[random setBackgroundImage:[UIImage imageNamed:@"toggleon.png"] forState:UIControlStateNormal];
    [random setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
5
dubbeat

@EthanBの提案と@karimがバックフィルされた長方形を作成するごとに、UIButtonのカテゴリを作成してこれを実現しました。

カテゴリコードを入力するだけです： https://github.com/zmonteca/UIButton-PLColor

使用法：

[button setBackgroundColor:uiTextColor forState:UIControlStateDisabled];

使用するオプションのforStates：

UIControlStateNormal
UIControlStateHighlighted
UIControlStateDisabled
UIControlStateSelected
2
zmonteca

ボタンにCALayerを追加することもできます-カラーオーバーレイなど、これらを使用して多くのことを実行できます。この例では、プレーンカラーレイヤーを使用し、簡単に色を変更することもできます。追加したレイヤーは下のレイヤーを覆い隠しますが

+(void)makeButtonColored:(UIButton*)button color1:(UIColor*) color
{

    CALayer *layer = button.layer;
    layer.cornerRadius = 8.0f;
    layer.masksToBounds = YES;
    layer.borderWidth = 4.0f;
    layer.opacity = .3;//
    layer.borderColor = [UIColor colorWithWhite:0.4f alpha:0.2f].CGColor;

    CAGradientLayer *colorLayer = [CAGradientLayer layer];
    colorLayer.cornerRadius = 8.0f;
    colorLayer.frame = button.layer.bounds;
    //set gradient colors
    colorLayer.colors = [NSArray arrayWithObjects:
                         (id) color.CGColor,
                         (id) color.CGColor,
                         nil];

    //set gradient locations
    colorLayer.locations = [NSArray arrayWithObjects:
                            [NSNumber numberWithFloat:0.0f],
                            [NSNumber numberWithFloat:1.0f],
                            nil];


    [button.layer addSublayer:colorLayer];

}
2
gheese

UIButtonのUIControlEventTouchedに2番目のターゲットを追加し、UIButton背景色を変更します。次に、UIControlEventTouchUpInsideターゲットに戻します。

1
Shaun

私はこれがずっと前に尋ねられたことを知っています、そして今、新しいUIButtonTypeSystemがあります。しかし、新しい質問はこの質問の複製としてマークされているため、ここではiOS 7システムボタンのコンテキストでの新しい回答を示します。.tintColorプロパティを使用してください。

let button = UIButton(type: .System)
button.setTitle("My Button", forState: .Normal)
button.tintColor = .redColor()
1
DonnaLea

これはUIButtonのサブクラスほどエレガントではありませんが、ちょっとしたい場合は、カスタムボタンを作成し、ボタンに必要な色で1x1ピクセルの画像を作成し、背景を設定しますハイライトされた状態のその画像へのボタンの-私のニーズに合っています。

1
SMSidat

プロフェッショナルで見栄えの良いボタンについては、これを確認できます カスタムボタンコンポーネント 。ビューやテーブルビューで直接使用したり、ニーズに合わせてソースコードを変更したりできます。お役に立てれば。

1
Ahmet Ardal

スウィフト3：

        static func imageFromColor(color: UIColor, width: CGFloat, height: CGFloat) -> UIImage {
            let rect = CGRect(x: 0, y: 0, width: width, height: height)
            UIGraphicsBeginImageContext(rect.size)
            let context = UIGraphicsGetCurrentContext()!
            context.setFillColor(color.cgColor)
            context.fill(rect)
            let img = UIGraphicsGetImageFromCurrentImageContext()!
            UIGraphicsEndImageContext()
            return img
        }

        let button = UIButton(type: .system)
        let image = imageFromColor(color: .red, width: 
        button.frame.size.width, height: button.frame.size.height)
        button.setBackgroundImage(image, for: .normal)
0
pawurb

[myButton setBackgroundColor:[UIColor blueColor]]; [myButton setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

このように変更するか、ストーリーボードに移動して、右側のオプションの背景を変更することができます。

0
Vinicius Carvalho