Appcelerator Titanium - 使用模型作为动态主题

Question

这是个好主意吗：

我最近问了一个关于主题的问题（让用户选择一个主题并立即应用它）。为此，我想到了使用模型和绑定——我利用这个机会终于学会了。 我得到了想要的结果 - 创建一个主题并使用具有数据绑定的模型应用它，并在我的测试应用程序中执行了以下操作：

app.tss “标签”： { 背景颜色：“{theme.backgroundColor}” }

（当然在真正的应用程序中会有更多的定义和更多的绑定。

这样做需要我在每个页面中都包含我的模型（index.xml）：

<Alloy>
    <Model src="theme" />

    <Window class="container" layout="vertical">
        <View
            id="test"
            width="150"
            height="150"
            top="10">
        </View>

        <Label id="label" onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>
        <Label onClick="doClick" top="10">Hello, World</Label>

    </Window>
</Alloy>

（在我的真实应用中，我使用的是跨平台导航控件的实现，所以当我在一个地方打开窗口时，我只会传递这个模型）

显然，这样做会为页面上的几乎每个元素创建许多绑定。我不完全知道幕后发生了什么，但我猜它会为每个这样的绑定值创建一个侦听器 - 这会导致许多侦听器、大量开销并为页面生成更多代码。

我猜我几乎是在回答我自己的问题 - 是否建议继续调查这条路径？这有多糟糕？

Answer 1

可以使用类并在更改时重新应用它们。您只需在每个控制器的一个地方监控一个事件

你可以看看我在GitHub上写的关于基于方向的动态样式的例子

你可以这样做：

".DynamicLabel[if=Alloy.Globals.isPortrait]": {}

您应该使用 Backbone 事件，就像我在上面链接的存储库中指定的那样。

Alloy.js：

Alloy.Globals.events = _.clone(Backbone.Events);

Controller.js：

Alloy.Globals.events.on('orientationchange', () => {

但是：这非常复杂，并且引入了您不需要的复杂性。对于复杂的应用程序，我不推荐事件部分。但是..有可能！

对于复杂的应用程序，我建议使用 tss 中的 if 过滤器，然后关闭并重新打开您想要重新设置样式的控制器。