不使用Storyboard,如何通过代码实现视图内嵌套控件?
纯代码实现iOS控件嵌套(无需Storyboard)
当然可以!完全不用依赖Storyboard,纯代码不仅能实现控件嵌套,反而能给你更灵活的控制权——把两个UITextField放进一个UIView里是非常基础且容易实现的操作,下面给你一步步演示:
核心思路
所有UIKit控件都是UIView的子类,只要通过addSubview(_:)方法,就能把任意子控件添加到父视图中,再通过AutoLayout设置好它们的位置和大小,就能完美呈现。
完整代码示例
以在UIViewController中实现为例,你可以在viewDidLoad方法里添加以下代码:
override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white // 1. 创建容器UIView let containerView = UIView() containerView.backgroundColor = .lightGray containerView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(containerView) // 2. 创建第一个UITextField let firstNameField = UITextField() firstNameField.placeholder = "请输入名字" firstNameField.borderStyle = .roundedRect firstNameField.translatesAutoresizingMaskIntoConstraints = false containerView.addSubview(firstNameField) // 3. 创建第二个UITextField let lastNameField = UITextField() lastNameField.placeholder = "请输入姓氏" lastNameField.borderStyle = .roundedRect lastNameField.translatesAutoresizingMaskIntoConstraints = false containerView.addSubview(lastNameField) // 4. 设置AutoLayout约束(确保控件正确显示) NSLayoutConstraint.activate([ // 容器View的约束:居中,宽度占父视图80%,高度自适应 containerView.centerXAnchor.constraint(equalTo: view.centerXAnchor), containerView.centerYAnchor.constraint(equalTo: view.centerYAnchor), containerView.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.8), // 第一个输入框的约束:顶部、左右边距,高度固定 firstNameField.topAnchor.constraint(equalTo: containerView.topAnchor, constant: 16), firstNameField.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: 16), firstNameField.trailingAnchor.constraint(equalTo: containerView.trailingAnchor, constant: -16), firstNameField.heightAnchor.constraint(equalToConstant: 44), // 第二个输入框的约束:在第一个输入框下方,左右边距,高度固定,底部留边距 lastNameField.topAnchor.constraint(equalTo: firstNameField.bottomAnchor, constant: 12), lastNameField.leadingAnchor.constraint(equalTo: containerView.leadingAnchor, constant: 16), lastNameField.trailingAnchor.constraint(equalTo: containerView.trailingAnchor, constant: -16), lastNameField.heightAnchor.constraint(equalToConstant: 44), lastNameField.bottomAnchor.constraint(equalTo: containerView.bottomAnchor, constant: -16) ]) }
关键要点解释
translatesAutoresizingMaskIntoConstraints = false:必须设置这个属性,关闭系统自动生成的约束,这样我们自定义的AutoLayout才会生效。addSubview(_:):这是实现嵌套的核心方法,调用父视图的这个方法就能把子控件添加进去,子控件会成为父视图的层级一部分。- AutoLayout约束:纯代码开发必须手动设置约束,不然控件会默认在(0,0)位置且尺寸为0,导致看不到。上面的约束让容器View居中,两个输入框垂直排列在容器内,适配不同屏幕尺寸。
你完全可以根据自己的需求调整样式、约束和控件属性,纯代码开发的灵活性就是这么强~
内容的提问来源于stack exchange,提问作者ButtahNBred
相关产品推荐
相关产品推荐

