summaryrefslogtreecommitdiffstats
path: root/examples/declarative/tutorials/contacts/Final/ContactView2.qml
blob: da1e5db35ba06c375d45a93aa2b5af29276a8cbb (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<Item id="contacts">
    <resources>
        <SqlConnection id="contactDatabase" name="qmlConnection" driver="QSQLITE" databaseName="../shared/contacts.sqlite"/>
        <SqlQuery id="contactList" connection="{contactDatabase}">
            <query>SELECT recid AS contactid, label, email, phone FROM contacts ORDER BY label, recid</query>
        </SqlQuery>
        <Component id="contactDelegate">
            <Item id="wrapper"
                x="0"
                width="{ListView.view.width}" height="34">
                <Text id="label"
                    x="40" y="12"
                    width="{parent.width-30}" 
                    text="{model.label}"
                    color="white"
                    font.bold="true">
                </Text>
                <MouseRegion
                    anchors.fill="{label}"
                    onClicked="wrapper.state='opened'"/>
                <Contact id="details"
                    anchors.fill="{parent}"
                    contactid="{model.contactid}"
                    label="{model.label}"
                    email="{model.email}"
                    phone="{model.phone}"
                    opacity="0"/>
                <states>
                    <State name='opened'>
                        <SetProperty target="{wrapper}" property="height" value="{contactListView.height}"/>
                        <SetProperty target="{contactListView}" property="yPosition" value="{wrapper.y}"/>
                        <SetProperty target="{contactListView}" property="locked" value="1"/>
                        <SetProperty target="{label}" property="opacity" value="0"/>
                        <SetProperty target="{details}" property="opacity" value="1"/>
                    </State>
                </states>
                <transitions>
                    <Transition>
                        <NumericAnimation duration="500" properties="yPosition,height,opacity"/>
                    </Transition>
                </transitions>
                <Connection sender="{cancelEditButton}" signal="clicked()">
                    if (wrapper.state == 'opened') {
                        wrapper.state = '';
                    }
                </Connection>
            </Item>
        </Component>
    </resources>
    <Button id="cancelEditButton"
        anchors.top="{parent.top}" anchors.topMargin="5"
        anchors.right="{parent.right}" anchors.rightMargin="5"
        icon="../shared/pics/cancel.png"/>
    <ListView id="contactListView"
        anchors.left="{parent.left}"
        anchors.right="{parent.right}"
        anchors.top="{cancelEditButton.bottom}"
        anchors.bottom="{parent.bottom}"
        clip="true"
        model="{contactList}"
        delegate="{contactDelegate}"/>
</Item>