Mengubah Warna Teks Placeholder dengan Swift


226

Saya memiliki desain yang mengimplementasikan biru tua UITextField, karena teks placeholder secara default warna abu-abu tua saya hampir tidak bisa melihat apa kata teks placeholder.

Saya sudah googled masalah tentu saja tetapi saya belum menemukan solusi saat menggunakan bahasa Swift dan tidak Obj-c.

Apakah ada cara untuk mengubah warna teks placeholder dalam UITextFieldmenggunakan Swift?

Jawaban:


501

Anda bisa mengatur teks placeholder menggunakan string yang dikaitkan . Lewati warna yang Anda inginkan dengan attributes:

var myTextField = UITextField(frame: CGRect(x: 0, y: 0, width: 200, height: 30))
myTextField.backgroundColor = .blue
myTextField.attributedPlaceholder = NSAttributedString(string: "placeholder text",
                             attributes: [NSForegroundColorAttributeName: UIColor.yellow])

Untuk Swift 3+ gunakan yang berikut:

myTextField.attributedPlaceholder = NSAttributedString(string: "placeholder text",
                             attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])

Untuk Swift 4.2 gunakan yang berikut:

myTextField.attributedPlaceholder = NSAttributedString(string: "placeholder text",
                             attributes: [NSAttributedString.Key.foregroundColor: UIColor.white])

iOS 11 SDK - kuncinya tidak memiliki foregroundColor: self.emailTextField? .attributedPlaceholder = NSAttributedString (string: "placeholder text", atribut: [NSAttributedStringKey.foregroundColor: UIColor.white])
Matthew Ferguson

@ MatthewFerguson, saya baru mencobanya dan berhasil. Apakah Anda memiliki versi Xcode 9 yang dirilis? Apa jenis emailTextField?
vacawama

2
@vacawama. Terima kasih untuk pertukarannya. Proyek lawas, Diperbarui Xcode saya dari App store - Versi 9.0 (9A235), dan akhirnya muncul dengan solusi self.passwordTextField? .AttributedPlaceholder = NSAttributedString (string: "PASSWORD", atribut: [NSForegroundColorAttributeName: UIColor.white])
Matthew Ferguson

3
untuk penggunaan iOS 11 SDKmyTextField.attributedPlaceholder = NSAttributedString(string: "placeholder text", attributes: [NSForegroundColorAttributeName: UIColor.white])
Gema Megantara

1
Apakah ada cara untuk mengatur warna tanpa mengatur string?
ScottyBlades

285

Anda dapat melakukannya dengan cepat, tanpa menambahkan satu baris kode, menggunakan Interface Builder.

Pilih UITextFielddan buka inspektur identitas di sebelah kanan:

masukkan deskripsi gambar di sini

Klik tombol plus dan tambahkan atribut runtime baru:

placeholderLabel.textColor (Swift 4)

_placeholderLabel.textColor (Swift 3 atau kurang)

Gunakan Warna sebagai jenis dan pilih warna.

Itu dia.

Anda tidak akan melihat hasilnya sampai Anda menjalankan aplikasi Anda lagi.


1
benar, tetapi ini adalah semacam peretasan, karena properti placeholderLabel.textColor bersifat pribadi ...
Frédéric Adda

1
apakah aplikasi akan ditolak karena kami menggunakan properti pribadi kelas?
firecast

2
Sayangnya ini tampaknya tidak berfungsi di iOS 10 setidaknya.
nickdnk

2
@nickdnk Tidak benar. Saat ini saya sudah menguji di iOS 10.2.1 dan berfungsi. :)
Andrej

2
Jalan bagus menuju kehancuran yang tak terduga jika Apple akan mengubah implementasi internal.)
Vlad

127

Buat UITextFieldEkstensi seperti ini:

extension UITextField{
   @IBInspectable var placeHolderColor: UIColor? {
        get {
            return self.placeHolderColor
        }
        set {
            self.attributedPlaceholder = NSAttributedString(string:self.placeholder != nil ? self.placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor: newValue!])
        }
    }
}

Dan di storyboard atau .xib Anda. Kamu akan lihat

masukkan deskripsi gambar di sini


11
⚠️ Peringatan: Ekstensi ini akan merusak program Anda jika Anda memutuskan untuk membaca properti placeHolderColor! Jika Anda mengembalikan nilai properti yang dihitung sendiri dari pengambil properti, pengambil akan dipanggil lagi dari dalam pengambil, menghasilkan rekursi yang tak terbatas. (Lihat: stackoverflow.com/a/42334711/2062785 )
Mischa

1
Untuk memperbaiki ini dan mendapatkan perilaku yang diharapkan (yaitu warna placeholder yang benar) dapatkan attributedStringhuruf pertama (jika tidak kosong) dan kembalikan warna teksnya nil.
Mischa

mengapa 2 warna ditampilkan di kotak. Saya pikir ini untuk mode gelap tapi bukan itu masalahnya.
asreerama

27

Di Swift 3.0, Gunakan

let color = UIColor.lightText
textField.attributedPlaceholder = NSAttributedString(string: textField.placeholder, attributes: [NSForegroundColorAttributeName : color])

Di Siwft 5.0 + Gunakan

let color = UIColor.lightText
let placeholder = textField.placeholder ?? "" //There should be a placeholder set in storyboard or elsewhere string or pass empty
textField.attributedPlaceholder = NSAttributedString(string: placeholder, attributes: [NSAttributedString.Key.foregroundColor : color])

24

Kode ini berfungsi di Swift3:

yourTextFieldName .setValue(UIColor.init(colorLiteralRed: 80/255, green: 80/255, blue: 80/255, alpha: 1.0), forKeyPath: "_placeholderLabel.textColor")

beri tahu saya jika Anda memiliki masalah.


untuk beberapa alasan ini macet ketika saya mencoba melakukannya ke lebih dari 1 textField. Yang pertama berfungsi dengan baik kemudian crash pada semua textFields berikutnya. Tidak yakin mengapa tetapi saya berharap saya bisa menggunakan metode ini karena ini yang termudah dan paling mudah dibaca
Tommy K

Tidak perlu menggunakan setValueuntuk mengakses properti pribadi. Gunakan API publik yang tepat.
rmaddy

Ini adalah jawaban terbaik ... Terima kasih banyak.
reza_khalafi

Xcode 10 / Swift 5 sintaks literal:#colorLiteral(red: 1.0, green: 1.0, blue: 1.0, alpha: 1.0)
Lal Krishna

15

Untuk mengatur warna placeholder sekali untuk semua UITextFielddi aplikasi Anda yang dapat Anda lakukan:

UILabel.appearanceWhenContainedInInstancesOfClasses([UITextField.self]).textColor = UIColor.redColor()

Ini akan mengatur warna yang diinginkan untuk semua TextField placeholder di seluruh aplikasi. Tetapi ini hanya tersedia sejak iOS 9.

Tidak ada metode kemunculanWhenContainedIn .... () sebelum iOS 9 di swift tetapi Anda dapat menggunakan salah satu solusi yang disediakan di sini penampilanWhenContainedIn in Swift


ini tidak hanya akan mengubah warna placeholder, tetapi juga warna teks.
Timur Suleimanov

7

Dalam kasus saya, saya menggunakan Swift 4

Saya membuat ekstensi untuk UITextField

extension UITextField {
    func placeholderColor(color: UIColor) {
        let attributeString = [
            NSAttributedStringKey.foregroundColor: color.withAlphaComponent(0.6),
            NSAttributedStringKey.font: self.font!
            ] as [NSAttributedStringKey : Any]
        self.attributedPlaceholder = NSAttributedString(string: self.placeholder!, attributes: attributeString)
    }
}

yourField.placeholderColor (warna: UIColor.white)


6

Xcode 9.2 Swift 4

extension UITextField{
    @IBInspectable var placeHolderColor: UIColor? {
        get {
            return self.placeHolderColor
        }
        set {
            self.attributedPlaceholder = NSAttributedString(string:self.placeholder != nil ? self.placeholder! : "", attributes:[NSAttributedStringKey.foregroundColor: newValue!])
        }
    }
}

2
Ini tidak akan berhasil. Sang pengambil akan menyebabkan rekursi tak terbatas.
rmaddy

2
Ini berfungsi dengan baik di swift 4. Saya membuat breakpoint dalam kode dan memeriksanya .. rekursi tak terbatas tidak terjadi.
R. Mohan

1
JANGAN GUNAKAN INI. ini akan menghasilkan rekursi yang tak terbatas. coba: cetak (textField.placeHolderColor)
David Rees

5

Swift 4:

txtControl.attributedPlaceholder = NSAttributedString(string: "Placeholder String...",attributes: [NSAttributedStringKey.foregroundColor: UIColor.gray])

Tujuan-C:

UIColor *color = [UIColor grayColor];
txtControl.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"Placeholder String..." attributes:@{NSForegroundColorAttributeName: color}];

4

Berikut ini adalah implementasi cepat saya untuk swift 4:

extension UITextField {
    func placeholderColor(_ color: UIColor){
        var placeholderText = ""
        if self.placeholder != nil{
            placeholderText = self.placeholder!
        }
        self.attributedPlaceholder = NSAttributedString(string: placeholderText, attributes: [NSAttributedStringKey.foregroundColor : color])
    }
}

gunakan seperti:

streetTextField?.placeholderColor(AppColor.blueColor)

semoga membantu seseorang!


Swift 4.2: self.attributedPlaceholder = NSAttributedString (string: placeholderText, atribut: [NSAttributedString.Key.foregroundColor: color])
Sean Stayns

4

Swift 3 (mungkin 2), Anda bisa mengganti didSet pada placeholder di UITextFieldsubclass untuk menerapkan atribut di atasnya, dengan cara ini:

override var placeholder: String? {

    didSet {
        guard let tmpText = placeholder else {
            self.attributedPlaceholder = NSAttributedString(string: "")
            return
        }

        let textRange = NSMakeRange(0, tmpText.characters.count)
        let attributedText = NSMutableAttributedString(string: tmpText)
        attributedText.addAttribute(NSForegroundColorAttributeName , value:UIColor(white:147.0/255.0, alpha:1.0), range: textRange)

        self.attributedPlaceholder = attributedText
    }
}

4

Untuk Swift

Buat Ekstensi UITextField

extension UITextField{

    func setPlaceHolderColor(){
        self.attributedPlaceholder = NSAttributedString(string: self.placeholder!, attributes: [NSForegroundColorAttributeName : UIColor.white])
    }
}

Jika Anda diatur dari storyboard.

extension UITextField{
    @IBInspectable var placeHolderColor: UIColor? {
        get {
            return self.placeHolderColor
        }
        set {
            self.attributedPlaceholder = NSAttributedString(string:self.placeholder != nil ? self.placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor : newValue!])
        }
    }
}

3

Untuk Swift 3 dan 3.1 ini berfungsi dengan baik:

passField.attributedPlaceholder = NSAttributedString(string: "password", attributes: [NSForegroundColorAttributeName: UIColor.white])

3

Untuk Swift 4.0, X-code 9.1 versi atau iOS 11 Anda dapat menggunakan sintaks berikut untuk memiliki warna placeholder yang berbeda

textField.attributedPlaceholder = NSAttributedString(string: "Placeholder Text", attributes: [NSAttributedStringKey.foregroundColor : UIColor.white])

3

Saya terkejut melihat berapa banyak solusi buruk yang ada di sini.

Ini adalah versi yang akan selalu berfungsi.

Cepat 4.2

extension UITextField{
    @IBInspectable var placeholderColor: UIColor {
        get {
            return self.attributedPlaceholder?.attribute(.foregroundColor, at: 0, effectiveRange: nil) as? UIColor ?? .lightText
        }
        set {
            self.attributedPlaceholder = NSAttributedString(string: self.placeholder ?? "", attributes: [.foregroundColor: newValue])
        }
    }
}

TIP : Jika Anda mengubah teks placeholder setelah mengatur warna- warna akan mengatur ulang.


3

Cukup tulis kode di bawah ini ke dalam metode AppFelishate didFinishLaunchingWithOptions menggunakan ini jika Anda ingin mengubah seluruh aplikasi yang ditulis dalam Swift 4.2

UILabel.appearance(whenContainedInInstancesOf: [UITextField.self]).textColor = UIColor.white


1

Untuk swift 4.2 dan di atasnya, Anda dapat melakukannya seperti di bawah ini:

textField.attributedPlaceholder = NSAttributedString(string: "Placeholder Text", attributes: [NSAttributedString.Key.foregroundColor: UIColor.white])

1

Dalam kasus saya, saya telah melakukan yang berikut:

extension UITextField {
    @IBInspectable var placeHolderColor: UIColor? {
        get {
            if let color = self.attributedPlaceholder?.attribute(.foregroundColor, at: 0, effectiveRange: nil) as? UIColor {
                return color
            }
            return nil
        }
        set (setOptionalColor) {
            if let setColor = setOptionalColor {
                let string = self.placeholder ?? ""
                self.attributedPlaceholder = NSAttributedString(string: string , attributes:[NSAttributedString.Key.foregroundColor: setColor])
            }
        }
    }
}

1

Di sini saya menulis semua UIDesignable dari UITextField. Dengan bantuan kode ini, Anda dapat langsung mengaksesnya dari Inspektur file UI di storyboard

@IBDesignable
class CustomTextField: UITextField {

@IBInspectable var leftImage: UIImage? {
    didSet {
        updateView()
    }
}

@IBInspectable var leftPadding: CGFloat = 0 {
    didSet {
        updateView()
    }
}

@IBInspectable var rightImage: UIImage? {
    didSet {
        updateView()
    }
}

@IBInspectable var rightPadding: CGFloat = 0 {
    didSet {
        updateView()
    }
}

private var _isRightViewVisible: Bool = true
var isRightViewVisible: Bool {
    get {
        return _isRightViewVisible
    }
    set {
        _isRightViewVisible = newValue
        updateView()
    }
}

func updateView() {
    setLeftImage()
    setRightImage()

    // Placeholder text color
    attributedPlaceholder = NSAttributedString(string: placeholder != nil ?  placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor: tintColor])
}

func setLeftImage() {
    leftViewMode = UITextField.ViewMode.always
    var view: UIView

    if let image = leftImage {
        let imageView = UIImageView(frame: CGRect(x: leftPadding, y: 0, width: 20, height: 20))
        imageView.image = image
        // Note: In order for your image to use the tint color, you have to select the image in the Assets.xcassets and change the "Render As" property to "Template Image".
        imageView.tintColor = tintColor

        var width = imageView.frame.width + leftPadding

        if borderStyle == UITextField.BorderStyle.none || borderStyle == UITextField.BorderStyle.line {
            width += 5
        }

        view = UIView(frame: CGRect(x: 0, y: 0, width: width, height: 20))
        view.addSubview(imageView)
    } else {
        view = UIView(frame: CGRect(x: 0, y: 0, width: leftPadding, height: 20))
    }

    leftView = view
}

func setRightImage() {
    rightViewMode = UITextField.ViewMode.always

    var view: UIView

    if let image = rightImage, isRightViewVisible {
        let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 20, height: 20))
        imageView.image = image
        // Note: In order for your image to use the tint color, you have to select the image in the Assets.xcassets and change the "Render As" property to "Template Image".
        imageView.tintColor = tintColor

        var width = imageView.frame.width + rightPadding

        if borderStyle == UITextField.BorderStyle.none || borderStyle == UITextField.BorderStyle.line {
            width += 5
        }

        view = UIView(frame: CGRect(x: 0, y: 0, width: width, height: 20))
        view.addSubview(imageView)

    } else {
        view = UIView(frame: CGRect(x: 0, y: 0, width: rightPadding, height: 20))
    }

    rightView = view
}


@IBInspectable public var borderColor: UIColor = UIColor.clear {
    didSet {
        layer.borderColor = borderColor.cgColor
    }
}

@IBInspectable public var borderWidth: CGFloat = 0 {
    didSet {
        layer.borderWidth = borderWidth
    }
}

@IBInspectable public var cornerRadius: CGFloat = 0 {
    didSet {
        layer.cornerRadius = cornerRadius
    }
}
@IBInspectable public var bottomBorder: CGFloat = 0 {
    didSet {
       borderStyle = .none
        layer.backgroundColor = UIColor.white.cgColor

        layer.masksToBounds = false
     //   layer.shadowColor = UIColor.gray.cgColor
        layer.shadowOffset = CGSize(width: 0.0, height: 1.0)
        layer.shadowOpacity = 1.0
        layer.shadowRadius = 0.0
    }
}
@IBInspectable public var bottomBorderColor : UIColor = UIColor.clear {
    didSet {

        layer.shadowColor = bottomBorderColor.cgColor
        layer.shadowOffset = CGSize(width: 0.0, height: 1.0)
        layer.shadowOpacity = 1.0
        layer.shadowRadius = 0.0
    }
}
/// Sets the placeholder color
@IBInspectable var placeHolderColor: UIColor? {
    get {
        return self.placeHolderColor
    }
    set {
        self.attributedPlaceholder = NSAttributedString(string:self.placeholder != nil ? self.placeholder! : "", attributes:[NSAttributedString.Key.foregroundColor: newValue!])
    }
}

}

0

Untuk Swift

func setPlaceholderColor(textField: UITextField, placeholderText: String) {
    textField.attributedPlaceholder = NSAttributedString(string: placeholderText, attributes: [NSForegroundColorAttributeName: UIColor.pelorBlack])
}

Anda bisa menggunakan ini;

self.setPlaceholderColor(textField: self.emailTextField, placeholderText: "E-Mail/Username")

0

Ini lebih tentang mempersonalisasi textField Anda, tetapi saya akan membagikan kode ini dari halaman lain dan membuatnya sedikit lebih baik:

import UIKit
extension UITextField {
func setBottomLine(borderColor: UIColor, fontColor: UIColor, placeHolderColor:UIColor, placeHolder: String) {
    self.borderStyle = UITextBorderStyle.none
    self.backgroundColor = UIColor.clear
    let borderLine = UIView()
    let height = 1.0
    borderLine.frame = CGRect(x: 0, y: Double(self.frame.height) - height, width: Double(self.frame.width), height: height)
    self.textColor = fontColor
    borderLine.backgroundColor = borderColor
    self.addSubview(borderLine)
    self.attributedPlaceholder = NSAttributedString(
        string: placeHolder,
        attributes: [NSAttributedStringKey.foregroundColor: placeHolderColor]
    )
  }
}

Dan Anda dapat menggunakannya seperti ini:

self.textField.setBottomLine(borderColor: lineColor, fontColor: fontColor, placeHolderColor: placeHolderColor, placeHolder: placeHolder)

Mengetahui bahwa Anda memiliki UITextFieldkoneksi ke ViewController.

Sumber: http://codepany.com/blog/swift-3-custom-uitextfield-with-single-line-input/


0

masukkan deskripsi gambar di sini

Untuk Tujuan C :

UIColor *color = [UIColor colorWithRed:0.44 green:0.44 blue:0.44 alpha:1.0];
 emailTextField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:@"Friend's Email" attributes:@{NSForegroundColorAttributeName: color}];

Untuk Swift :

emailTextField.attributedPlaceholder = NSAttributedString(string: "Friend's Email",
                             attributes: [NSAttributedString.Key.foregroundColor: UIColor.white])

0

Kode C objektif untuk mengubah warna teks placeholder.

Pertama-tama impor kelas objc / runtime ini -

#import <objc/runtime.h>

lalu ganti nama bidang teks Anda -

Ivar ivar =  class_getInstanceVariable([UITextField class], "_placeholderLabel");
UILabel *placeholderLabel = object_getIvar(YourTxtField, ivar);
placeholderLabel.textColor = [UIColor whiteColor];


0

untuk iOS13

+(void)ChangeplaceholderColor :(UITextField *)TxtFld andColor:(UIColor*)color { 
    NSMutableAttributedString *placeholderAttributedString = [[NSMutableAttributedString alloc] initWithAttributedString:TxtFld.attributedPlaceholder];
       [placeholderAttributedString addAttribute:NSForegroundColorAttributeName value:color range:NSMakeRange(0, [placeholderAttributedString length])];
       TxtFld.attributedPlaceholder = placeholderAttributedString;

}

0

Gunakan seperti ini di Swift,

 let placeHolderText = textField.placeholder ?? ""
 let str = NSAttributedString(string:placeHolderText!, attributes: [NSAttributedString.Key.foregroundColor :UIColor.lightGray])
 textField.attributedPlaceholder = str

Dalam Tujuan C

NSString *placeHolder = [textField.placeholder length]>0 ? textField.placeholder: @"";
NSAttributedString *str = [[NSAttributedString alloc] initWithString:placeHolder attributes:@{ NSForegroundColorAttributeName : [UIColor lightGrayColor] }];
textField.attributedPlaceholder = str;

0
    extension UITextField{
            @IBInspectable var placeHolderColor: UIColor? {
                get {
                    return self.placeHolderColor
                }
                set {
                    self.attributedPlaceholder = NSAttributedString(string:self.placeholder != nil ?
        self.placeholder! : "",
        attributes:[NSAttributedString.Key.foregroundColor : newValue!])
                }
            } 
}

-1

Gunakan ini untuk menambahkan placeholder yang dikaitkan:

let attributes : [String : Any]  = [ NSForegroundColorAttributeName: UIColor.lightGray,
                                     NSFontAttributeName : UIFont(name: "Helvetica Neue Light Italic", size: 12.0)!
                                   ]
x_textfield.attributedPlaceholder = NSAttributedString(string: "Placeholder Text", attributes:attributes)

-1

Untuk Swift 4

txtField1.attributedPlaceholder = NSAttributedString(string: "-", attributes: [NSAttributedStringKey.foregroundColor: UIColor.white])

1
Ini adalah duplikat dari beberapa jawaban sebelumnya. Tidak perlu mengirim jawaban rangkap.
rmaddy

-2
yourTextfield.attributedPlaceholder = NSAttributedString(string: "your placeholder text",attributes: [NSForegroundColorAttributeName: UIColor.white])
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.