点击地图按钮实现全屏切换及原布局恢复方案咨询

我来帮你搞定这个地图全屏切换的需求，核心思路就是保存地图原本的约束，在切换时替换约束并控制其他控件的显示状态，步骤很清晰：

1. 准备工作：保存原约束与状态标记 #

首先在你的ViewController里定义几个属性，用来记录地图原本的顶部、底部约束，以及当前是否处于全屏状态：

import UIKit
import MapKit // 假设你用的是MapKit，可根据你的地图框架调整

class YourViewController: UIViewController {
    // 关联你的界面控件
    @IBOutlet weak var searchBar: UISearchBar!
    @IBOutlet weak var mapView: MKMapView!
    @IBOutlet weak var tableView: UITableView!
    
    // 保存地图原有的顶部（与SearchBar相连）和底部（与TableView比例约束）
    @IBOutlet weak var mapTopConstraint: NSLayoutConstraint!
    @IBOutlet weak var mapBottomConstraint: NSLayoutConstraint!
    
    // 标记当前是否处于全屏状态
    private var isMapFullScreen = false
    
    // ... 其他原有代码
}

注意：这里的mapTopConstraint和mapBottomConstraint需要你在Storyboard/XIB里，把原本设置的那两个约束直接拖成IBOutlet关联到ViewController里，别选错约束哦！

2. 实现按钮点击的切换逻辑 #

给你的地图全屏按钮添加点击事件，在方法里完成全屏/恢复的核心逻辑：

@IBAction func toggleMapFullScreen(_ sender: UIButton) {
    // 切换全屏状态标记
    isMapFullScreen.toggle()
    
    if isMapFullScreen {
        // 进入全屏：隐藏SearchBar和TableView
        searchBar.isHidden = true
        tableView.isHidden = true
        
        // 禁用原有的约束
        mapTopConstraint.isActive = false
        mapBottomConstraint.isActive = false
        
        // 添加全屏约束：地图顶到安全区顶部，底到安全区底部，左右保持原有的0约束即可
        let fullScreenTop = mapView.topAnchor.constraint(equalTo: view.safeAreaLayoutGuide.topAnchor)
        let fullScreenBottom = mapView.bottomAnchor.constraint(equalTo: view.safeAreaLayoutGuide.bottomAnchor)
        
        NSLayoutConstraint.activate([fullScreenTop, fullScreenBottom])
    } else {
        // 恢复原布局：显示SearchBar和TableView
        searchBar.isHidden = false
        tableView.isHidden = false
        
        // 移除全屏时添加的约束
        mapView.constraints.forEach { constraint in
            if (constraint.firstAttribute == .top && constraint.secondItem == view.safeAreaLayoutGuide) ||
               (constraint.firstAttribute == .bottom && constraint.secondItem == view.safeAreaLayoutGuide) {
                constraint.isActive = false
            }
        }
        
        // 恢复原本的约束
        NSLayoutConstraint.activate([mapTopConstraint, mapBottomConstraint])
    }
    
    // 加个动画让切换更流畅自然
    UIView.animate(withDuration: 0.3) {
        self.view.layoutIfNeeded()
    }
}

3. 优化细节：按钮图标切换 #

为了让用户更直观地理解按钮功能，你可以在切换状态时同时改变按钮的图标：

// 把这段代码加到toggleMapFullScreen方法里，比如在isMapFullScreen.toggle()之后
let targetImage = isMapFullScreen ? UIImage(systemName: "arrow.down.right.and.arrow.up.left") : UIImage(systemName: "arrow.up.left.and.arrow.down.right")
sender.setImage(targetImage, for: .normal)

注意事项 #

• 如果你的项目是纯代码布局，那在初始化地图约束的时候，直接把top和bottom约束赋值给mapTopConstraint和mapBottomConstraint就行，不用拖IBOutlet。
• 用safeAreaLayoutGuide是为了适配刘海屏、底部安全区，避免地图被系统控件遮挡。
• 如果你的地图框架不是MapKit（比如高德、百度），只需要把MKMapView换成对应的地图控件类就行，约束逻辑完全通用。

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