Question

我正在尝试使搜索栏看起来像这样

带有细灰色边框的白色背景。

在Xcode上，我可以将Search style设置为默认值（给出白色背景），将Bar tint设置为灰色（给出灰色边框）。

但是我得到的结果是这个

如何更改条形的厚度以反映要进行的设计？

（另外，有没有办法只更改搜索栏的字体？我只找到了更改字体大小的方法）

Answer 1

按照以下步骤操作-

1。从对象库中选择UITextField

2。拖到您的情节提要

3。选择边框样式为none。

4。创建一个Swift文件并在扩展名下面添加它-

extension UIView {

   @IBInspectable var cornerRadius: CGFloat {

    get {

        return layer.cornerRadius

    }

    set {

        layer.cornerRadius = newValue

        layer.masksToBounds = newValue > 0

    }

}

   @IBInspectable var borderWidth: CGFloat {

    get {

        return layer.borderWidth

    }

    set {

        layer.borderWidth = newValue

    }

}

   @IBInspectable var borderColor: UIColor? {

    get {

        return UIColor(cgColor: layer.borderColor!)

    }

    set {

        layer.borderColor = newValue?.cgColor

    }

  }

}



extension UIButton {

  func roundedButton(){

    let maskPAth1 = UIBezierPath(roundedRect: self.bounds,

                                 byRoundingCorners: [.topLeft , .topRight],

                                 cornerRadii:CGSize(width:8.0, height:8.0))

    let maskLayer1 = CAShapeLayer()

    maskLayer1.frame = self.bounds

    maskLayer1.path = maskPAth1.cgPath

    self.layer.mask = maskLayer1

  }

}

extension UITextField {

   func setLeftPaddingPoints(_ amount:CGFloat){

    let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: amount, height: self.frame.size.height))

    self.leftView = paddingView

    self.leftViewMode = .always
}

  func setRightPaddingPoints(_ amount:CGFloat) {
    let paddingView = UIView(frame: CGRect(x: 0, y: 0, width: amount, height: self.frame.size.height))
    self.rightView = paddingView
    self.rightViewMode = .always
  }
}

extension UITextField {

    @IBInspectable var maxLength: Int {
    get {
        if let length = objc_getAssociatedObject(self, &kAssociationKeyMaxLength) as? Int {
            return length
        } else {
            return Int.max
        }
    }
    set {
        objc_setAssociatedObject(self, &kAssociationKeyMaxLength, newValue, .OBJC_ASSOCIATION_RETAIN)
        addTarget(self, action: #selector(checkMaxLength), for: .editingChanged)
    }
}

@objc func checkMaxLength(textField: UITextField) {
    guard let prospectiveText = self.text,
        prospectiveText.count > maxLength
        else {
            return
    }

    let selection = selectedTextRange

    let indexEndOfText = prospectiveText.index(prospectiveText.startIndex, offsetBy: maxLength)
    let substring = prospectiveText[..<indexEndOfText]
    text = String(substring)

    selectedTextRange = selection
  }
}

5。现在，您可以从情节提要或代码中访问此扩展，以更改值并查看效果。

6。您可以更改UITextField的拐角半径，边框宽度，边框颜色。

希望这种方法也有帮助。

Answer 2

UISearchBar.Style.minimal 样式不提供默认背景色或图像

并使用UITextFiled代替搜索栏，以便您可以自定义图标位置

YourTextFiled.rightView = UIImageView(image: UIImage(named: "search-icon"))

YourTextFiled.rightViewMode = UITextField.ViewMode.always

如何更改UISearchBar的边框粗细？

2 个答案: