如何使我的文本字段成为行而不是框？

Posted 2023-03-14

【中文标题】如何使我的文本字段成为行而不是框？

【英文标题】：How do I make my textfields as lines instead of boxes?

【发布时间】：2017-01-03 11:29:51

【问题描述】：

这是文本字段的理想设计：

这是我设计的：

我是否必须导入一些库或安装一些 pod？有没有一种程序化的方式来做到这一点？

【问题讨论】：

不，你可以绘制底部边框而不是整个边框

您可以将文本字段的边框设置为无，并在每个文本字段下方添加小视图

我该怎么做？

Google 类似"ios custom uitextfield" 并使用弹出的第一个github link。

查看***.com/questions/29428402/…

【参考方案1】：

下面是代码。

@IBOutlet weak var fullName: UITextField!

override func viewDidLoad() 
    super.viewDidLoad()

    let bottomBorder = CALayer()
    bottomBorder.frame = CGRect(x: 0, y: fullName.frame.size.height-1, width: fullName.frame.size.width, height: 1.0)
    bottomBorder.backgroundColor = UIColor.white.cgColor
    fullName.layer.addSublayer(bottomBorder)

输出：

【参考方案2】：

很快，我用以下代码实现了它：

class viewController: UIViewController 

    @IBOutlet weak var textfield: UITextField!

    let layer : CALayer = CALayer()

    override func viewDidLoad()
    
         textfield.borderStyle = .none // can do this in xib or storyboard too
         textfield.layer.masksToBounds = true
         layer?.borderColor = UIColor.lightGray.cgColor
         layer?.borderWidth = 1.0
         textfield.layer.addSublayer(layer)
    

   override func viewDidLayoutSubviews() 
   

        layer?.frame = CGRect(x: 0,
                               y: textfield.frame.size.height - 1,
                               width:  textfield.frame.size.width,
                               height: 1.0)



    

【讨论】：

注意：这是将层定义为CALayer! 类型的良好做法之一，因为viewDidLoad 肯定会在viewDidLayoutSubviews 之前被调用

【参考方案3】：

您可以使用 CosmicMind 的 Material 框架并使用 textfield 对象。您可以通过 cocoapods 安装框架，并且可以按照他们在 repo 上的示例进行操作。