写下第一片日志,哈哈哈哈。还没用过qml,先记一下吧。
1.Qt的模型视图:
在Qt中想利用视图(ListView)显示一些数据,并不是将这些数据直接放到视图中的。
因为视图只管显示,不会存储数据。数据模型用来存储数据,但是它不涉及显示,仅仅是存放数据。
所以还要用一个代理的东西来设置数据模型中的数据怎样在视图中显示。
就是这样:
【degelage代理】
【ListModel数据模型】 --------------------------------> 【ListView显示】
2.编写步骤:
(1)先设置数据模型ListModel
(2)设置代理,在代理中设置怎样显示数据delegate
(3)设置视图,在视图中关联了数据模型和代理 ListView中设置model和delegate
(4)设置高亮:listview中的highlight
备注:代理和高亮条头可以通过Component组件来实现
例子:
我的是QtCreater 5.4.1,新建一个 Qt Quick Application项目:改一下里面的那个main.qml。
- import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Window 2.2
import QtQuick.Dialogs 1.2
ApplicationWindow {
title: qsTr("Hello World")
width: 800
height: 480
visible: true
Rectangle{
id:mainrec
property int widthx: 200
property int heightx: 480
height: heightx
width: widthx
color:"lightgray"
visible: true
Component{
id:listdelegate
Item{
id:delegateitem
width:170
height:40
Column{
Text{
text:" <b> Name: </b>" + name + " <b> Num: </b>" + number
}
}
}
}
ListView{
id:listInfo
anchors.fill: parent
focus:true
model:listdata
delegate: listdelegate
highlight: highlight
}
Component{
id:highlight
Rectangle{
color:"lightsteelblue"
radius: 5
}
}
ListModel{
id:listdata
ListElement{
name:"xcy0"
number:"230"
}
ListElement{
name:"xcy1"
number:"231"
}
ListElement{
name:"xcy2"
number:"232"
}
}
}
}
3.Listview的delegate有两种方式:
(1)直接定义delegate
- ListView{
...
delegate:Item{
...
}
model:ListModel{
id:testModel
ListElement
{
name:"xcy"
}
}
...
}
其他地方使用:
- testModel.clear();
testModel.append({"name":"xcl"});
testModel.append({"name":"xxl"});
(2)将delegate定义成组件,在ListView中加用其id
参考:
http://www.360doc.com/content/15/1010/14/8236462_504649709.shtml