iOS横向ScrollView中实现点击按钮添加边框并移除其他按钮边框

嘿，这事儿不难，我帮你捋清楚步骤，直接改代码就行：

第一步：准备追踪选中按钮的变量 #

先在你的ViewController里定义一个变量，用来记录当前选中的按钮，后续移除旧边框会更方便：

var selectedButton: UIButton?
var currentTag: Int = 0 // 这里根据你的初始选中值调整，比如默认选中tag=0的按钮

第二步：完善按钮初始化与事件绑定 #

在setUpScrollView方法里，给所有按钮统一绑定同一个点击事件，同时给默认选中的按钮初始化边框：

func setUpScrollView() {
    let buttonPadding: CGFloat = 10
    var xOffset: CGFloat = 10
    // 记得开启横向滚动，隐藏多余指示器
    scrollView.showsHorizontalScrollIndicator = false
    
    for i in 0 ... 10 {
        let button = UIButton(type: .system)
        button.tag = i
        button.backgroundColor = .red
        button.setTitle("\(i)", for: .normal)
        // 设置按钮尺寸，根据你的UI需求调整宽高
        button.frame = CGRect(x: xOffset, y: 10, width: 60, height: 40)
        
        // 统一绑定点击事件
        button.addTarget(self, action: #selector(btnTapped(_:)), for: .touchUpInside)
        
        // 给默认选中的按钮加边框
        if button.tag == currentTag {
            button.layer.borderWidth = 2
            button.layer.borderColor = UIColor.blue.cgColor // 换成你想要的边框颜色
            selectedButton = button
        } else {
            // 其他按钮初始隐藏边框
            button.layer.borderWidth = 0
        }
        
        scrollView.addSubview(button)
        xOffset += button.frame.width + buttonPadding
    }
    
    // 设置scrollView的滚动范围，确保能显示所有按钮
    scrollView.contentSize = CGSize(width: xOffset, height: scrollView.frame.height)
}

第三步：实现点击切换边框的逻辑 #

写一个统一的点击处理方法，负责移除旧按钮的边框，给当前点击的按钮添加上边框：

@objc func btnTapped(_ sender: UIButton) {
    // 1. 移除之前选中按钮的边框
    selectedButton?.layer.borderWidth = 0
    
    // 2. 给当前点击的按钮添加边框
    sender.layer.borderWidth = 2
    sender.layer.borderColor = UIColor.blue.cgColor
    
    // 3. 更新选中按钮的引用和currentTag值
    selectedButton = sender
    currentTag = sender.tag
}

小提醒 #

• 边框的颜色、宽度都可以根据你的APP主题随意调整，比如把蓝色换成橙色或者主题色
• 如果需要额外的选中效果（比如改变背景色），可以在btnTapped方法里一起处理
• 确保你的scrollView已经正确添加到视图上，并且设置了合适的frame哦

内容的提问来源于stack exchange，提问作者Pratz_iOS