web-dev-qa-db-ja.com

UITextFieldの境界線の色

UITextFieldの境界線に自分の色を設定したいのは本当に素晴らしいことです。しかし、これまでのところ、境界線のスタイルのみを変更する方法を見つけることができました。

Backgroundプロパティを使用して、次のように背景色を設定しました。

self.textField.backgroundColor = textFieldColor;

ただし、UITextFieldの境界線の色も変更する必要があります。私の質問は、境界線の色を変更する方法についてでした。

121
dasha

クラスにQuartzCoreフレームワークをインポートします。

#import <QuartzCore/QuartzCore.h>

境界線の色を変更するには、次のコードスニペットを使用します(redColorに設定しています)。

    textField.layer.cornerRadius=8.0f;
    textField.layer.masksToBounds=YES;
    textField.layer.borderColor=[[UIColor redColor]CGColor];
    textField.layer.borderWidth= 1.0f;

元のレイアウトに戻すには、境界線の色をクリアカラーに設定するだけです。

    serverField.layer.borderColor=[[UIColor clearColor]CGColor];

Swiftコード内

    textField.layer.borderWidth = 1
    textField.layer.borderColor = UIColor.whiteColor().CGColor
267
Gary

これを試して:

UITextField *theTextFiels=[[UITextField alloc]initWithFrame:CGRectMake(40, 40, 150, 30)];
    theTextFiels.borderStyle=UITextBorderStyleNone;
    theTextFiels.layer.cornerRadius=8.0f;
    theTextFiels.layer.masksToBounds=YES;
        theTextFiels.backgroundColor=[UIColor redColor];
    theTextFiels.layer.borderColor=[[UIColor blackColor]CGColor];
    theTextFiels.layer.borderWidth= 1.0f;

    [self.view addSubview:theTextFiels];
    [theTextFiels release];

quartzCoreをインポートします。

#import <QuartzCore/QuartzCore.h>
20
iOSPawan

次のクラスをインポートします。

#import <QuartzCore/QuartzCore.h> 

//テキストフィールドの境界線のグレー色を設定するためのコード

[[textField layer] setBorderColor:[[UIColor colorWithRed:171.0/255.0
                                                   green:171.0/255.0
                                                    blue:171.0/255.0
                                                   alpha:1.0] CGColor]];

171.0を必要に応じてそれぞれの色番号に置き換えます。

17
james lobo

この質問は、Google検索でかなり高く表示され、ほとんどの部分で有効です。 Salman Zaidiの答えがiOS 7に対して部分的に正しかったことがわかりました。

「元に戻す」コードを変更する必要があります。復帰のための次のことが完全に機能することがわかりました。

textField.layer.cornerRadius = 0.0f;
textField.layer.masksToBounds = YES;
textField.layer.borderColor = [[UIColor blackColor] CGColor];
textField.layer.borderWidth = 0.0f;

これはおそらくiOS 7の変更が原因であると理解しています。

12
Jovin_

承認済みの回答からこのアクションを簡素化するために、Category for UIViewを作成することもできます(これは、テキストフィールドだけでなく、UIViewのすべてのサブクラスでも機能するためです:

IView + Additions.h:

#import <Foundation/Foundation.h>

@interface UIView (Additions)
- (void)setBorderForColor:(UIColor *)color 
                    width:(float)width 
                   radius:(float)radius;
@end

IView + Additions.m:

#import "UIView+Additions.h"

@implementation UIView (Additions)

- (void)setBorderForColor:(UIColor *)color 
                    width:(float)width
                   radius:(float)radius
{
    self.layer.cornerRadius = radius;
    self.layer.masksToBounds = YES;
    self.layer.borderColor = [color CGColor];
    self.layer.borderWidth = width;
}

@end

使用法:

#import "UIView+Additions.h"
//...
[textField setBorderForColor:[UIColor redColor]
                       width:1.0f
                      radius:8.0f];
10
skywinder

角が丸いTextFieldを使用する場合、次のコードを使用します。

    self.TextField.layer.cornerRadius=8.0f;
    self.TextField.layer.masksToBounds=YES;
    self.TextField.layer.borderColor=[[UIColor redColor]CGColor];
    self.TextField.layer.borderWidth= 1.0f;

境界線を削除するには:

self.TextField.layer.masksToBounds=NO;
self.TextField.layer.borderColor=[[UIColor clearColor]CGColor];
7

borderColorどのビュー(またはUIViewサブクラス)でも、少しコーディングしたストーリーボードを使用して設定できます。このアプローチは、複数のUIオブジェクトに境界色を設定する場合に非常に便利です。

以下は、それを達成するための手順です。

  1. CALayerクラスにカテゴリを作成します。タイプIColorのプロパティを適切な名前で宣言します。borderUIColorと名前を付けます。
  2. このプロパティのセッターとゲッターを記述します。
  3. 「Setter」メソッドで、レイヤーの「borderColor」プロパティを新しい色のCGColor値に設定します。
  4. 'Getter'メソッドで、レイヤーのborderColorでUIColorを返します。

追伸:カテゴリにはプロパティを保存できません。 「borderUIColor」は計算対象のプロパティとして使用され、焦点を合わせることを達成するための参照としてのみ使用されます。

以下のコードサンプルをご覧ください。

Objective C:

インターフェイスファイル:

#import <QuartzCore/QuartzCore.h>
#import <UIKit/UIKit.h>

@interface CALayer (BorderProperties)

// This assigns a CGColor to borderColor.
@property (nonatomic, assign) UIColor* borderUIColor;

@end

実装ファイル:

#import "CALayer+BorderProperties.h"

@implementation CALayer (BorderProperties)

- (void)setBorderUIColor:(UIColor *)color {
    self.borderColor = color.CGColor;
}

- (UIColor *)borderUIColor {
    return [UIColor colorWithCGColor:self.borderColor];
}

@end

Swift 2.0:

extension CALayer {
var borderUIColor: UIColor {
    set {
        self.borderColor = newValue.CGColor
    }

    get {
        return UIColor(CGColor: self.borderColor!)
    }
}
}

最後に、ストーリーボード/ XIBに移動し、残りの手順に従います。

  1. 境界線の色を設定するビューオブジェクトをクリックします。
  2. 「ユーティリティ」(画面の右側)パネルの「IDインスペクター」(左から3番目)をクリックします。
  3. 「ユーザー定義のランタイム属性」の下で、「+」ボタンをクリックしてキーパスを追加します。
  4. キーパスのタイプを「カラー」に設定します。
  5. キーパスの値を「layer.borderUIColor」として入力します。 [これはborderColorではなくborderUIColor]ではなく、カテゴリで宣言した変数名であることを忘れないでください。
  6. 最後に、好きな色を選んでください。

境界線の色を表示するには、layer.borderWidthプロパティ値を少なくとも1に設定する必要があります。

ビルドして実行します。ハッピーコーディング。 :)

4
Rameswar Prasad

Swift 5.0の更新

textField.layer.masksToBounds = true
textField.layer.borderColor = UIColor.blue.cgColor
textField.layer.borderWidth = 1.0
1
Hugo Jordao