12.3_创建ViewController作为View层

在MVVM架构中，ViewController扮演着View层的角色。你的ViewController主要负责展示数据和响应用户的交互。它不应该包含任何业务逻辑，而是将这些逻辑委托给ViewModel处理。让我们一起看看如何创建ViewController吧！🎉

ViewController 的基本结构

首先，你需要创建一个继承自UIViewController的类。这个类将负责管理你的视图和处理用户事件。确保你的ViewController尽可能地简洁，只关注UI相关的任务。

import UIKit

class MyViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // 在这里进行视图的初始化和布局
        setupUI()
    }

    func setupUI() {
        // 添加子视图，设置约束等
    }
}

使用纯代码构建UI

使用纯代码构建UI可以让你更好地控制视图的布局和样式。你可以使用UIView、UILabel、UIButton等UIKit组件来创建你的界面。记住，使用Auto Layout来确保你的UI在不同的设备上都能正确显示。

let myLabel: UILabel = {
    let label = UILabel()
    label.text = "Hello, MVVM!"
    label.textAlignment = .center
    label.translatesAutoresizingMaskIntoConstraints = false // 禁用自动约束
    return label
}()

添加视图并设置约束

在setupUI()方法中，你需要将你的视图添加到ViewController的view中，并设置约束。使用NSLayoutConstraint或者更现代的SnapKit等库可以简化约束的设置。

view.addSubview(myLabel)

NSLayoutConstraint.activate([
    myLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
    myLabel.centerYAnchor.constraint(equalTo: view.centerYAnchor)
])

处理用户交互

ViewController需要响应用户的交互，例如按钮点击。你可以通过addTarget方法将UI事件连接到ViewController中的方法。然后，将这些事件转发给ViewModel进行处理。

let myButton: UIButton = {
    let button = UIButton()
    button.setTitle("点击我", for: .normal)
    button.backgroundColor = .blue
    button.setTitleColor(.white, for: .normal)
    button.translatesAutoresizingMaskIntoConstraints = false
    return button
}()

override func viewDidLoad() {
    super.viewDidLoad()
    view.backgroundColor = .white
    setupUI()
    myButton.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
}

@objc func buttonTapped() {
    // 将事件转发给ViewModel
    print("Button tapped!")
}

避免在ViewController中处理业务逻辑

最重要的一点是，避免在ViewController中处理任何业务逻辑。ViewController应该只负责展示数据和响应用户交互。所有的数据处理和业务逻辑都应该放在ViewModel中。这样可以使你的代码更易于测试和维护。记住，ViewController是View层，ViewModel才是大脑！🧠

示例：简单的ViewController

下面是一个简单的ViewController示例，它显示一个标签和一个按钮。按钮点击后，会将事件转发到ViewModel。

import UIKit

class MyViewController: UIViewController {

    let myLabel: UILabel = {
        let label = UILabel()
        label.text = "Hello, MVVM!"
        label.textAlignment = .center
        label.translatesAutoresizingMaskIntoConstraints = false
        return label
    }()

    let myButton: UIButton = {
        let button = UIButton()
        button.setTitle("点击我", for: .normal)
        button.backgroundColor = .blue
        button.setTitleColor(.white, for: .normal)
        button.translatesAutoresizingMaskIntoConstraints = false
        return button
    }()

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        setupUI()
        myButton.addTarget(self, action: #selector(buttonTapped), for: .touchUpInside)
    }

    func setupUI() {
        view.addSubview(myLabel)
        view.addSubview(myButton)

        NSLayoutConstraint.activate([
            myLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            myLabel.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: -50),

            myButton.centerXAnchor.constraint(equalTo: view.centerXAnchor),
            myButton.centerYAnchor.constraint(equalTo: view.centerYAnchor, constant: 50),
            myButton.widthAnchor.constraint(equalToConstant: 100),
            myButton.heightAnchor.constraint(equalToConstant: 40)
        ])
    }

    @objc func buttonTapped() {
        // 将事件转发给ViewModel
        print("Button tapped!")
    }
}

通过以上步骤，你就可以创建一个干净、简洁的ViewController，为你的MVVM架构打下坚实的基础。记住，保持ViewController的简洁和专注，将业务逻辑交给ViewModel处理，这样你的代码会更加清晰和易于维护。👍