QML contact reader application using QtMobility API
(Kkrish -) |
(Kkrish -) |
||
| Line 4: | Line 4: | ||
''Enter article metadata as described below. Note that this template can be placed anywhere in the article. Do not remove parameters that you do not use'' | ''Enter article metadata as described below. Note that this template can be placed anywhere in the article. Do not remove parameters that you do not use'' | ||
{{ArticleMetaData <!-- v1.0 --> | {{ArticleMetaData <!-- v1.0 --> | ||
| − | |sourcecode= [[Media | + | |sourcecode= [[Media:Qmlcontactreader.zip]] |
|installfile= Not available | |installfile= Not available | ||
|devices= emulator | |devices= emulator | ||
Revision as of 10:00, 29 February 2012
QMLContactReader application is a very simple application developed in QML using Qt Mobility API.
Enter article metadata as described below. Note that this template can be placed anywhere in the article. Do not remove parameters that you do not use
Article Metadata
Code Example
Source file: Media:Qmlcontactreader.zip
Installation file: Not available
Tested with
SDK: Qt SDK 1.1.4
Devices(s): emulator
Compatibility
Platform(s): Symbian
Device(s): Symbian device with Qt SDK
Dependencies: None
Platform Security
Signing Required: Developer Cert
Capabilities: ReadUserData WriteUserData
Article
Keywords: ContactModel, contact reader, QML contact reader
Created: kkrish (29 Feb 2012)
Last edited: kkrish
(29 Feb 2012)
Contents |
Introduction
QMLContactReader application is a very simple application with two screens. First screen have contacts in the list from the phone book with first name, last name and number and when you tap on the number you will get the dialog with more details.
Qt Mobility Package
import QtMobility.contacts 1.1
Page {
id: mainPage
Text {
id: titleText
text: "Contacts Book"
anchors.horizontalCenter: parent.horizontalCenter
anchors.top: parent.top
anchors.topMargin: 6
color: platformStyle.colorNormalLight
}
Component {
id: contactListDelegate
Rectangle {
height: 80
width: parent.width
color: "black"
border.color: "gray"
border.width: 2
Text {
id: nameText
text: contact.name.firstName + " " + contact.name.lastName
color: "red"
anchors{left: parent.left; right: parent.right; top: parent.top; }
anchors.leftMargin: 10
font.pixelSize: 30
}
Text {
id: numberText
text: contact.phoneNumber.number
color: "white"
anchors{left: parent.left; right: parent.right; top: nameText.bottom; bottom: parent.bottom}
anchors.leftMargin: 20
font.pixelSize: 30
}
MouseArea{
anchors.fill: parent
onClicked: {
cdDetails.contactFields = contact
cdDetails.open()
}
}
}
}
ContactModel {
id: contactModel
sortOrders:
SortOrder {
detail: ContactDetail.Name
field: Name.LastName
direction: Qt.AscendingOrder
}
}
ListView {
id: contactList
anchors{top: titleText.bottom; bottom: parent.bottom; left: parent.left; right: parent.right}
model: contactModel
delegate: contactListDelegate
clip: true
}
ContactDetails{
id: cdDetails
anchors.fill: parent
}
}Dialog Code
CommonDialog{
id: cdDialog
titleText: "Contact Details"
buttonTexts: ["OK"]
property Contact contactFields
content :Flickable{
height: parent.height
width: parent.width
contentHeight: contentItem.height
contentWidth: contentItem.width
flickableDirection: Flickable.VerticalFlick
Item {
id: contentItem
Text {
id: fNametext
text: qsTr("First Name")
color: "white"
anchors{top: parent.top; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 10}
font.pixelSize: 30
}
Text {
id: fNametextEdit
text: contactFields.name.firstName
color: "lightblue"
anchors{top: fNametext.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
font.pixelSize: 30
}
Text {
id: lNametext
text: qsTr("Last Name")
anchors{top: fNametextEdit.bottom; left: parent.left; right: parent.right; topMargin: 30; leftMargin: 10}
color: "white"
font.pixelSize: 30
}
Text {
id: lNametextEdit
text: contactFields.name.lastName
anchors{top: lNametext.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
color: "lightblue"
font.pixelSize: 30
}
Text {
id: lNumbertext
text: qsTr("Number")
anchors{top: lNametextEdit.bottom; left: parent.left; right: parent.right; topMargin: 30; leftMargin: 10}
color: "white"
font.pixelSize: 30
}
Text {
id: lNumbertextEdit
text: contactFields.phoneNumber.number
anchors{top: lNumbertext.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
color: "lightblue"
font.pixelSize: 30
}
Text {
id: lEmailText
text: qsTr("Email")
anchors{top: lNumbertextEdit.bottom; left: parent.left; right: parent.right; topMargin: 30; leftMargin: 10}
color: "white"
font.pixelSize: 30
}
Text {
id: lEmailtextEdit
text: contactFields.email.emailAddress
anchors{top: lEmailText.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
color: "lightblue"
font.pixelSize: 30
}
Text {
id: lAddressText
text: qsTr("Address")
anchors{top: lEmailtextEdit.bottom; left: parent.left; right: parent.right; topMargin: 30; leftMargin: 10}
color: "white"
font.pixelSize: 30
}
Text {
id: lAddresstextEdit
text: contactFields.address.street + " " + contactFields.address.postcode + " " + contactFields.address.state + " " + contactFields.address.district + + " " + contactFields.address.county
anchors{top: lAddressText.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
color: "lightblue"
font.pixelSize: 30
wrapMode: Text.WordWrap
}
Text {
id: lorganizationText
text: qsTr("Organization")
anchors{top: lAddresstextEdit.bottom; left: parent.left; right: parent.right; topMargin: 30; leftMargin: 10}
color: "white"
font.pixelSize: 30
}
Text {
id: lorganizationtextEdit
text: contactFields.organization.title
anchors{top: lorganizationText.bottom; left: parent.left; right: parent.right; topMargin: 10; leftMargin: 20}
color: "lightblue"
font.pixelSize: 30
}
}
}
}Example Code
http://www.developer.nokia.com/Community/Wiki/File:Qmlcontactreader.zip
Reference links
http://doc.qt.nokia.com/qtmobility/index.html http://doc.qt.nokia.com/qtmobility/qml-contacts.html
