对于开发用户界面,最重要的就是保持数据与UI分离。数据通常被称为为model,可视化处理称作view。在QML中,model与view都通过delegate连接起来。功能划分如下,model提供数据,对于每个数据项,可能有很多个值。显示在view(视图)中的每项数据,都是通过delegate(代理)来实现可视化的。view(视图)的任务是排列这些delegate(代理),每个delegate(代理)将model item(模型项)的值呈现给用户。
一个模型可以是一个整数,提供给代理使用的索引值(index).如果JavaScript数组被作为一个模型,模型数据变量(modelData)代表了数组的数据的当前索引。对于更加复杂的情况,每个数据项需要提供多个值,可以使用ListModel与ListElement。
对于静态模型,一个Repeater可以被用作视图。它可以非常方便的使用行(Row),列(Column),栅格(Grid),或者流(Flow)来创建用户界面。对于动态或者更大的数据模型,使用ListView或者GridView更加合适。它们会在需要时动态的创建代理,减少在场景下一次显示的元素的数量。
在视图中的代理可以与数据模型中的属性静态绑定或者动态绑定。使用onAdd与onRemove信号,可以动态的播放他们的添加和移除的特效。