如何设置UITextField仅背景应用alpha透明度而不影响内部文本?
实现原理说明
UITextField的alpha属性会作用于整个视图的所有元素,包括内部文本、占位符、子视图,所以直接设置全局alpha必然会导致文本同步变透明,不符合需求。
解决方案
方案1:直接设置带透明度的背景色(最简实现)
不需要设置整个输入框的全局alpha,直接给backgroundColor参数添加透明度即可,修改后的代码如下:
self.emailInputField.text = "Enter your Email/Username" self.passwordEmailInputField.text = "Enter your Password" // 背景色直接指定透明度,不需要设置整个textField的alpha self.passwordEmailInputField.backgroundColor = UIColor.white.withAlphaComponent(0.1) self.emailInputField.backgroundColor = UIColor.white.withAlphaComponent(0.1) // 移除原代码中设置全局alpha的两行:self.passwordEmailInputField.alpha = 0.1、self.emailInputField.alpha = 0.1 self.emailInputField.textColor = .gray self.passwordEmailInputField.textColor = .gray self.view.addSubview(self.emailInputField) self.view.addSubview(self.passwordEmailInputField)
注:原代码中存在重复设置
passwordEmailInputField.textColor的笔误,已修正为分别设置两个输入框的文字颜色。
方案2:自定义背景视图(适配复杂背景效果)
如果需要给输入框添加渐变、圆角阴影等复杂背景效果,可以单独添加背景子视图,仅修改该子视图的透明度,不会影响文本展示:
- 创建一个自定义
UIView作为背景层 - 将该背景视图插入到输入框的最下层,仅设置它的透明度
- 背景视图可以自由添加各种效果,不会影响输入框的文本、输入交互
代码示例:
// 以email输入框为例,密码框同理 let backgroundView = UIView(frame: emailInputField.bounds) backgroundView.backgroundColor = .white backgroundView.alpha = 0.1 backgroundView.layer.cornerRadius = 6 backgroundView.autoresizingMask = [.flexibleWidth, .flexibleHeight] // 自动适配输入框大小变化 emailInputField.insertSubview(backgroundView, at: 0)
内容的提问来源于stack exchange,提问作者Mr Astronaut
相关产品推荐
相关产品推荐

