转载

如何重用 watchOS 的 Paging Interface Controller

作者：Natasha The Robot，原文链接，原文日期：2016-09-26

译者： saitjr ；校对：小锅；定稿： CMB

目前为止，watchOS 的复用性都不是很好。即使每个界面都差不多，你也不得不在 storyboard 中把所有 Interface Controller 拖出来，就像下面这个 Italian Food 应用一样：

每个 Interface Controller 简单到就只有一个 image 和 label：

如何重用 watchOS 的 Paging Interface Controller

即使它们的界面，甚至逻辑都完全一样，在此之前，我都没找到重用这些 Interface Controller 的方法！

所以我有三个不同的 controller，而它们的代码，除了 image 和 label 的数据模型外，其它的我都复制粘贴的。在我坚持不懈下，终于发现了个黑魔法，虽然有点恶心，不过能解决问题倒是真的。

模型

首先，我创建了一个简单的 FoodItem 模型，它的数据主要是用于填充 Interface Controller ：

struct FoodItem {
    let title: String
    let imageName: String
}
 
extension FoodItem {
    
    static let foodItems = [
        FoodItem(title: "Camogliese al Rum", imageName: "comogli"),
        FoodItem(title: "Pesto alla Genovese", imageName: "pasta"),
        FoodItem(title: "Focaccia di Recco", imageName: "recco"),
    ]
}

Storyboard

下一步则是创建用于重用的 Interface Controller，就叫 FoodItemInterfaceController 吧，然后将它设置为 Storyboard 中每个 Interface Controller 的类：

如何重用 watchOS 的 Paging Interface Controller

然后，将 image 和 label 与 FoodItemInterfaceController 中的 IBOutlet 进行关联：

如何重用 watchOS 的 Paging Interface Controller

最后，在 storyboard 中，给每一个 Interface Controller 一个唯一标识：

如何重用 watchOS 的 Paging Interface Controller

Interface Controller

现在，就到了最恶心的部分了… 在加载第一个 Interface Controller 时，你需要用点小技巧，使其加载其他的 controller。

import WatchKit
 
class FoodItemInterfaceController: WKInterfaceController {
 
    @IBOutlet var image: WKInterfaceImage!
    @IBOutlet var label: WKInterfaceLabel!
    
    // 记录是否是第一次加载
    static var first = true
    
    override func awake(withContext context: Any?) {
        super.awake(withContext: context)
        
        // 如果是第一次加载
        if FoodItemInterfaceController.first {
            // 根据三个数据模型，重载三个 controller
            // Names 数组是 storyboard 中的 identifier
            // Context 即数据模型
            if FoodItemInterfaceController.first {
            WKInterfaceController.reloadRootControllers(
                withNames: ["FoodItem1", "FoodItem2", "FoodItem3"],
                contexts: FoodItem.foodItems)
            FoodItemInterfaceController.first = false
        }
        
        // 数据模型是通过 context 传到这个方法中的
        if let foodItem = context as? FoodItem {
            // 给 image 和 label 赋值
            image.setImage(UIImage(named: foodItem.imageName))
            label.setText(foodItem.title)
        }
    }
}