5.3_动态添加和移除arrangedSubviews

在 UIStackView 中，动态添加和移除 arrangedSubviews 是构建灵活用户界面的关键。你可以根据应用的状态或用户的交互，实时调整 UIStackView 的内容。这使得你的界面能够响应变化，提供更佳的用户体验。🎉

添加 arrangedSubviews

向 UIStackView 中添加视图非常简单。你可以使用 addArrangedSubview(_:) 方法。这个方法会将视图添加到 arrangedSubviews 数组中，并自动更新 UIStackView 的布局。

let newView = UIView()
stackView.addArrangedSubview(newView)

• 确保在添加视图之前，已经对视图进行了必要的配置，例如设置背景颜色、添加约束等。
• addArrangedSubview(_:) 方法会自动处理视图的布局，你无需手动更新约束。

移除 arrangedSubviews

移除 arrangedSubviews 同样简单。你可以使用 removeArrangedSubview(_:) 方法。但是，仅仅从 arrangedSubviews 数组中移除视图并不会将其从视图层级中移除。你需要手动将视图从父视图中移除。

stackView.removeArrangedSubview(viewToRemove)
viewToRemove.removeFromSuperview()

• 务必同时调用 removeFromSuperview() 方法，否则视图仍然会显示在屏幕上，但不再由 UIStackView 管理。
• 移除视图后，UIStackView 会自动调整剩余视图的布局。

动画效果

在添加和移除 arrangedSubviews 时，你可以使用动画效果来增强用户体验。例如，你可以使用 UIView.animate(withDuration:animations:) 方法来平滑地显示或隐藏视图。

UIView.animate(withDuration: 0.3) {
    viewToAdd.isHidden = false // 显示视图
    stackView.layoutIfNeeded() // 触发布局更新
}

UIView.animate(withDuration: 0.3, animations: {
    viewToRemove.isHidden = true // 隐藏视图
    stackView.layoutIfNeeded() // 触发布局更新
}) { _ in
    stackView.removeArrangedSubview(viewToRemove)
    viewToRemove.removeFromSuperview()
}

• layoutIfNeeded() 方法会立即更新 UIStackView 的布局，确保动画效果平滑。
• 在移除视图的动画完成后，再调用 removeArrangedSubview(_:) 和 removeFromSuperview() 方法。

示例：动态添加和移除按钮

假设你有一个 UIStackView，其中包含一些按钮。你可以根据用户的操作，动态地添加或移除按钮。

1. 创建一个 UIStackView，并设置其 axis、distribution 和 alignment 属性。
2. 创建一些按钮，并将它们添加到 UIStackView 中。
3. 创建一个按钮，用于添加新的按钮到 UIStackView 中。
4. 创建一个按钮，用于移除 UIStackView 中的最后一个按钮。

let addButton = UIButton(type: .system)
addButton.setTitle("添加按钮", for: .normal)
addButton.addTarget(self, action: #selector(addButtonTapped), for: .touchUpInside)

let removeButton = UIButton(type: .system)
removeButton.setTitle("移除按钮", for: .normal)
removeButton.addTarget(self, action: #selector(removeButtonTapped), for: .touchUpInside)

@objc func addButtonTapped() {
    let newButton = UIButton(type: .system)
    newButton.setTitle("新按钮", for: .normal)
    stackView.addArrangedSubview(newButton)
}

@objc func removeButtonTapped() {
    guard let lastButton = stackView.arrangedSubviews.last else { return }
    stackView.removeArrangedSubview(lastButton)
    lastButton.removeFromSuperview()
}

注意事项

• 确保在添加或移除 arrangedSubviews 之前，UIStackView 已经正确地添加到视图层级中。
• 避免在动画过程中修改 arrangedSubviews 数组，这可能会导致布局错误。
• 使用 isHidden 属性来控制视图的显示和隐藏，可以避免频繁地添加和移除视图。

通过动态添加和移除 arrangedSubviews，你可以创建出更加灵活和动态的用户界面。记住，实践是最好的老师！动手尝试一下，你会发现 UIStackView 的强大之处。💪