×
Namespaces

Variants
Actions
(Difference between revisions)

QML contact reader application using QtMobility API

From Nokia Developer Wiki
Jump to: navigation, search
kkrish (Talk | contribs)
(Kkrish -)
hamishwillee (Talk | contribs)
m (Text replace - "Category:Symbian" to "")
 
(One intermediate revision by one user not shown)
Line 1: Line 1:
[[Category:Qt Mobility]][[Category:Symbian C++]][[Category:Symbian]][[Category:Code Snippet]][[Category:Code Examples]]
+
[[Category:Qt Mobility]][[Category:Symbian C++]][[Category:Code Snippet]][[Category:Code Examples]]
 
QMLContactReader application is a very simple application developed in QML using Qt Mobility API.
 
QMLContactReader application is a very simple application developed in QML using Qt Mobility API.
  
Line 28: Line 28:
 
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.
 
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.
  
Video from emulator:{{#ev:youtube|e7kFSInOhaM}}
+
Video from emulator:
 +
<mediaplayer>http://www.youtube.com/watch?v=e7kFSInOhaM</mediaplayer>
  
 
==Qt Mobility Package==
 
==Qt Mobility Package==

Latest revision as of 09:34, 30 May 2013

QMLContactReader application is a very simple application developed in QML using Qt Mobility API.

Article Metadata
Code Example
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: hamishwillee (30 May 2013)

Contents

[edit] 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.

Video from emulator: The media player is loading...

[edit] 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
}
}

[edit] 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
}
}
}
}

[edit] Example Code

http://www.developer.nokia.com/Community/Wiki/File:Qmlcontactreader.zip

[edit] Reference links

http://doc.qt.nokia.com/qtmobility/index.html http://doc.qt.nokia.com/qtmobility/qml-contacts.html

This page was last modified on 30 May 2013, at 09:34.
66 page views in the last 30 days.