Update addressbook

- Implement additional fields for add contact view

examples/addressbook/qml/AddContactView.qml

@@ -7,23 +7,103 @@ StackItem {
     id: root
     Flickable {
         anchors.fill: parent
+        contentHeight: innerColumn.height + 70 + 10
+        contentWidth: parent.width
         Column {
-            width: root.width
+            id: innerColumn
+            anchors.right: parent.right
+            anchors.left: parent.left
             TextInputRow {
                 id: firstNameField
-                width: root.width
                 label: qsTr("First name")
             }
             TextInputRow {
                 id: middleNameField
-                width: root.width
                 label: qsTr("Middle name")
             }
             TextInputRow {
                 id: lastNameField
-                width: root.width
                 label: qsTr("Last name")
             }
+            PhoneInput {
+                id: homePhone
+                label: qsTr("Home phone")
+                PhoneNumber {
+                    id: _homePhoneData
+                    countryCode: homePhone.countryCode
+                    number: parseInt(homePhone.number, 10)
+                }
+            }
+
+            DropDownColumn {
+                anchors.right: parent.right
+                anchors.left: parent.left
+                width: root.width
+                header: qsTr("Job")
+                value: _jobTitle.text
+
+                TextInputRow {
+                    id: _jobTitle
+                    label: qsTr("Title")
+                }
+                Item {
+                    height: 70
+                    anchors.right: parent.right
+                    anchors.left: parent.left
+                    PrimaryText {
+                        anchors.bottom: parent.bottom
+                        text: qsTr("Address")
+                    }
+                }
+                TextInputRow {
+                    id: _jstreetAddress1
+                    label: qsTr("Street address 1")
+                }
+                TextInputRow {
+                    id: _jstreetAddress2
+                    label: qsTr("Street address 2")
+                }
+                TextInputRow {
+                    id: _jzipCode
+                    label: qsTr("Zip code")
+                }
+                TextInputRow {
+                    id: _jstate
+                    label: qsTr("State")
+                }
+                TextInputRow {
+                    id: _jCountry
+                    label: qsTr("Country")
+                }
+            }
+
+            DropDownColumn {
+                anchors.right: parent.right
+                anchors.left: parent.left
+                width: root.width
+                header: qsTr("Home address")
+
+                TextInputRow {
+                    id: _streetAddress1
+                    label: qsTr("Street address 1")
+                }
+                TextInputRow {
+                    id: _streetAddress2
+                    label: qsTr("Street address 2")
+                }
+                TextInputRow {
+                    id: _zipCode
+                    label: qsTr("Zip code")
+                }
+                TextInputRow {
+                    id: _state
+                    label: qsTr("State")
+                }
+                TextInputRow {
+                    id: _country
+                    label: qsTr("Country")
+                }
+            }
         }
     }
 
@@ -31,6 +111,41 @@ StackItem {
         firstName: firstNameField.text
         middleName: middleNameField.text
         lastName: lastNameField.text
+        job.title: _jobTitle.text
+//        job.officeAddress.country: _jcountry.text
+        job.officeAddress.streetAddress1: _jstreetAddress1.text
+        job.officeAddress.streetAddress2: _jstreetAddress2.text
+        job.officeAddress.zipCode: parseInt(_jzipCode.text, 10)
+        job.officeAddress.state: _jstate.text
+
+//        address.country: _country.text
+        address.streetAddress1: _streetAddress1.text
+        address.streetAddress2: _streetAddress2.text
+        address.zipCode: parseInt(_zipCode.text, 10)
+        address.state: _state.text
+    }
+
+    onNewContactChanged: {
+        firstNameField.text = newContact.firstName
+        middleNameField.text = newContact.middleName
+        lastNameField.text = newContact.lastName
+        _jobTitle.text = newContact.job.title
+//        newContact.job.officeAddress.country: _jcountry.text
+        _jstreetAddress1.text = newContact.job.officeAddress.streetAddress1
+        _jstreetAddress2.text = newContact.job.officeAddress.streetAddress2
+        _jzipCode.text = newContact.job.officeAddress.zipCode.toString()
+        _jstate.text = newContact.job.officeAddress.state
+
+//        newContact.address.country: _country.text
+        _streetAddress1.text = newContact.address.streetAddress1
+        _streetAddress2.text = newContact.address.streetAddress2
+        _zipCode.text = newContact.address.zipCode.toString()
+        _state.text = newContact.address.state
+        var phoneNumber = newContact.phonesData.length > 0 ?
+                    newContact.phonesData[0] : null
+        if (phoneNumber) {
+            homePhone.number = phoneNumber.number.toString()
+        }
     }
 
     FloatingRoundButton {
@@ -41,6 +156,12 @@ StackItem {
         anchors.margins: 10
         icon: "qrc:/images/check.png"
         onClicked: {
+            var phones = new Array;
+            if (homePhone.number.length !== 0) {
+                phones.push(_homePhoneData);
+            }
+            newContact.phonesData = phones;
+
             abEngine.addContact(newContact)
             stack.pop()
         }

examples/addressbook/qml/ContactList.qml

@@ -32,6 +32,7 @@ StackItem {
     hasBack: false
     property alias model: contactList.model
     signal requestAddContact()
+    signal showContact(var contact)
     ListView {
         id: contactList
         anchors.fill: parent
@@ -86,6 +87,10 @@ StackItem {
                 height: 1
                 visible: (contactList.count - 1) === model.index
             }
+            MouseArea {
+                anchors.fill: parent
+                onClicked: showContact(contactDelegate.contact)
+            }
         }
     }
 

examples/addressbook/qml/CountryCodesModel.qml

@@ -1,5 +1,964 @@
-import QtQuick 2.0
-
-Item {
+import QtQuick 2.8
 
+ListModel {
+    ListElement {
+        name: "Israel +972"
+        code: 972
+    }
+    ListElement {
+        name: "Afghanistan +93"
+        code: 93
+    }
+    ListElement {
+        name: "Albania +355"
+        code: 355
+    }
+    ListElement {
+        name: "Algeria +213"
+        code: 213
+    }
+    ListElement {
+        name: "AmericanSamoa +1 684"
+        code: 1684
+    }
+    ListElement {
+        name: "Andorra +376"
+        code: 376
+    }
+    ListElement {
+        name: "Angola +244"
+        code: 244
+    }
+    ListElement {
+        name: "Anguilla +1 264"
+        code: 1264
+    }
+    ListElement {
+        name: "Antigua and Barbuda +1268"
+        code: 1268
+    }
+    ListElement {
+        name: "Argentina +54"
+        code: 54
+    }
+    ListElement {
+        name: "Armenia +374"
+        code: 374
+    }
+    ListElement {
+        name: "Aruba +297"
+        code: 297
+    }
+    ListElement {
+        name: "Australia +61"
+        code: 61
+    }
+    ListElement {
+        name: "Austria +43"
+        code: 43
+    }
+    ListElement {
+        name: "Azerbaijan +994"
+        code: 994
+    }
+    ListElement {
+        name: "Bahamas +1 242"
+        code: 1242
+    }
+    ListElement {
+        name: "Bahrain +973"
+        code: 973
+    }
+    ListElement {
+        name: "Bangladesh +880"
+        code: 880
+    }
+    ListElement {
+        name: "Barbados +1 246"
+        code: 1246
+    }
+    ListElement {
+        name: "Belarus +375"
+        code: 375
+    }
+    ListElement {
+        name: "Belgium +32"
+        code: 32
+    }
+    ListElement {
+        name: "Belize +501"
+        code: 501
+    }
+    ListElement {
+        name: "Benin +229"
+        code: 229
+    }
+    ListElement {
+        name: "Bermuda +1 441"
+        code: 1441
+    }
+    ListElement {
+        name: "Bhutan +975"
+        code: 975
+    }
+    ListElement {
+        name: "Bosnia and Herzegovina +387"
+        code: 387
+    }
+    ListElement {
+        name: "Botswana +267"
+        code: 267
+    }
+    ListElement {
+        name: "Brazil +55"
+        code: 55
+    }
+    ListElement {
+        name: "British Indian Ocean Territory +246"
+        code: 246
+    }
+    ListElement {
+        name: "Bulgaria +359"
+        code: 359
+    }
+    ListElement {
+        name: "Burkina Faso +226"
+        code: 226
+    }
+    ListElement {
+        name: "Burundi +257"
+        code: 257
+    }
+    ListElement {
+        name: "Cambodia +855"
+        code: 855
+    }
+    ListElement {
+        name: "Cameroon +237"
+        code: 237
+    }
+    ListElement {
+        name: "Canada +1"
+        code:1
+    }
+    ListElement {
+        name: "Cape Verde +238"
+        code: 238
+    }
+    ListElement {
+        name: "Cayman Islands + 345"
+        code: 345
+    }
+    ListElement {
+        name: "Central African Republic +236"
+        code: 236
+    }
+    ListElement {
+        name: "Chad +235"
+        code: 235
+    }
+    ListElement {
+        name: "Chile +56"
+        code: 56
+    }
+    ListElement {
+        name: "China +86"
+        code: 86
+    }
+    ListElement {
+        name: "Christmas Island +61"
+        code: 61
+    }
+    ListElement {
+        name: "Colombia +57"
+        code: 57
+    }
+    ListElement {
+        name: "Comoros +269"
+        code: 269
+    }
+    ListElement {
+        name: "Congo +242"
+        code: 242
+    }
+    ListElement {
+        name: "Cook Islands +682"
+        code: 682
+    }
+    ListElement {
+        name: "Costa Rica +506"
+        code: 506
+    }
+    ListElement {
+        name: "Croatia +385"
+        code: 385
+    }
+    ListElement {
+        name: "Cuba +53"
+        code: 53
+    }
+    ListElement {
+        name: "Cyprus +537"
+        code: 537
+    }
+    ListElement {
+        name: "Czech Republic +420"
+        code: 420
+    }
+    ListElement {
+        name: "Denmark +45"
+        code: 45
+    }
+    ListElement {
+        name: "Djibouti +253"
+        code: 253
+    }
+    ListElement {
+        name: "Dominica +1 767"
+        code: 1767
+    }
+    ListElement {
+        name: "Dominican Republic +1 849"
+        code: 1849
+    }
+    ListElement {
+        name: "Ecuador +593"
+        code: 593
+    }
+    ListElement {
+        name: "Egypt +20"
+        code: 20
+    }
+    ListElement {
+        name: "El Salvador +503"
+        code: 503
+    }
+    ListElement {
+        name: "Equatorial Guinea +240"
+        code: 240
+    }
+    ListElement {
+        name: "Eritrea +291"
+        code: 291
+    }
+    ListElement {
+        name: "Estonia +372"
+        code: 372
+    }
+    ListElement {
+        name: "Ethiopia +251"
+        code: 251
+    }
+    ListElement {
+        name: "Faroe Islands +298"
+        code: 298
+    }
+    ListElement {
+        name: "Fiji +679"
+        code: 679
+    }
+    ListElement {
+        name: "Finland +358"
+        code: 358
+    }
+    ListElement {
+        name: "France +33"
+        code: 33
+    }
+    ListElement {
+        name: "French Guiana +594"
+        code: 594
+    }
+    ListElement {
+        name: "French Polynesia +689"
+        code: 689
+    }
+    ListElement {
+        name: "Gabon +241"
+        code: 241
+    }
+    ListElement {
+        name: "Gambia +220"
+        code: 220
+    }
+    ListElement {
+        name: "Georgia +995"
+        code: 995
+    }
+    ListElement {
+        name: "Germany +49"
+        code: 49
+    }
+    ListElement {
+        name: "Ghana +233"
+        code: 233
+    }
+    ListElement {
+        name: "Gibraltar +350"
+        code: 350
+    }
+    ListElement {
+        name: "Greece +30"
+        code: 30
+    }
+    ListElement {
+        name: "Greenland +299"
+        code: 299
+    }
+    ListElement {
+        name: "Grenada +1 473"
+        code: 1473
+    }
+    ListElement {
+        name: "Guadeloupe +590"
+        code: 590
+    }
+    ListElement {
+        name: "Guam +1 671"
+        code: 1671
+    }
+    ListElement {
+        name: "Guatemala +502"
+        code: 502
+    }
+    ListElement {
+        name: "Guinea +224"
+        code: 224
+    }
+    ListElement {
+        name: "Guinea-Bissau +245"
+        code: 245
+    }
+    ListElement {
+        name: "Guyana +595"
+        code: 595
+    }
+    ListElement {
+        name: "Haiti +509"
+        code: 509
+    }
+    ListElement {
+        name: "Honduras +504"
+        code: 504
+    }
+    ListElement {
+        name: "Hungary +36"
+        code: 36
+    }
+    ListElement {
+        name: "Iceland +354"
+        code: 354
+    }
+    ListElement {
+        name: "India +91"
+        code: 91
+    }
+    ListElement {
+        name: "Indonesia +62"
+        code: 62
+    }
+    ListElement {
+        name: "Iraq +964"
+        code: 964
+    }
+    ListElement {
+        name: "Ireland +353"
+        code: 353
+    }
+    ListElement {
+        name: "Israel +972"
+        code: 972
+    }
+    ListElement {
+        name: "Italy +39"
+        code: 39
+    }
+    ListElement {
+        name: "Jamaica +1 876"
+        code: 1876
+    }
+    ListElement {
+        name: "Japan +81"
+        code: 81
+    }
+    ListElement {
+        name: "Jordan +962"
+        code: 962
+    }
+    ListElement {
+        name: "Kazakhstan +7 7"
+        code: 77
+    }
+    ListElement {
+        name: "Kenya +254"
+        code: 254
+    }
+    ListElement {
+        name: "Kiribati +686"
+        code: 686
+    }
+    ListElement {
+        name: "Kuwait +965"
+        code: 965
+    }
+    ListElement {
+        name: "Kyrgyzstan +996"
+        code: 996
+    }
+    ListElement {
+        name: "Latvia +371"
+        code: 371
+    }
+    ListElement {
+        name: "Lebanon +961"
+        code: 961
+    }
+    ListElement {
+        name: "Lesotho +266"
+        code: 266
+    }
+    ListElement {
+        name: "Liberia +231"
+        code: 231
+    }
+    ListElement {
+        name: "Liechtenstein +423"
+        code: 423
+    }
+    ListElement {
+        name: "Lithuania +370"
+        code: 370
+    }
+    ListElement {
+        name: "Luxembourg +352"
+        code: 352
+    }
+    ListElement {
+        name: "Madagascar +261"
+        code: 261
+    }
+    ListElement {
+        name: "Malawi +265"
+        code: 265
+    }
+    ListElement {
+        name: "Malaysia +60"
+        code: 60
+    }
+    ListElement {
+        name: "Maldives +960"
+        code: 960
+    }
+    ListElement {
+        name: "Mali +223"
+        code: 223
+    }
+    ListElement {
+        name: "Malta +356"
+        code: 356
+    }
+    ListElement {
+        name: "Marshall Islands +692"
+        code: 692
+    }
+    ListElement {
+        name: "Martinique +596"
+        code: 596
+    }
+    ListElement {
+        name: "Mauritania +222"
+        code: 222
+    }
+    ListElement {
+        name: "Mauritius +230"
+        code: 230
+    }
+    ListElement {
+        name: "Mayotte +262"
+        code: 262
+    }
+    ListElement {
+        name: "Mexico +52"
+        code: 52
+    }
+    ListElement {
+        name: "Monaco +377"
+        code: 377
+    }
+    ListElement {
+        name: "Mongolia +976"
+        code: 976
+    }
+    ListElement {
+        name: "Montenegro +382"
+        code: 382
+    }
+    ListElement {
+        name: "Montserrat +1664"
+        code: 1664
+    }
+    ListElement {
+        name: "Morocco +212"
+        code: 212
+    }
+    ListElement {
+        name: "Myanmar +95"
+        code: 95
+    }
+    ListElement {
+        name: "Namibia +264"
+        code: 264
+    }
+    ListElement {
+        name: "Nauru +674"
+        code: 674
+    }
+    ListElement {
+        name: "Nepal +977"
+        code: 977
+    }
+    ListElement {
+        name: "Netherlands +31"
+        code: 31
+    }
+    ListElement {
+        name: "Netherlands Antilles +599"
+        code: 599
+    }
+    ListElement {
+        name: "New Caledonia +687"
+        code: 687
+    }
+    ListElement {
+        name: "New Zealand +64"
+        code: 64
+    }
+    ListElement {
+        name: "Nicaragua +505"
+        code: 505
+    }
+    ListElement {
+        name: "Niger +227"
+        code: 227
+    }
+    ListElement {
+        name: "Nigeria +234"
+        code: 234
+    }
+    ListElement {
+        name: "Niue +683"
+        code: 683
+    }
+    ListElement {
+        name: "Norfolk Island +672"
+        code: 672
+    }
+    ListElement {
+        name: "Northern Mariana Islands +1 670"
+        code: 1670
+    }
+    ListElement {
+        name: "Norway +47"
+        code: 47
+    }
+    ListElement {
+        name: "Oman +968"
+        code: 968
+    }
+    ListElement {
+        name: "Pakistan +92"
+        code: 92
+    }
+    ListElement {
+        name: "Palau +680"
+        code: 680
+    }
+    ListElement {
+        name: "Panama +507"
+        code: 507
+    }
+    ListElement {
+        name: "Papua New Guinea +675"
+        code: 675
+    }
+    ListElement {
+        name: "Paraguay +595"
+        code: 595
+    }
+    ListElement {
+        name: "Peru +51"
+        code: 51
+    }
+    ListElement {
+        name: "Philippines +63"
+        code: 63
+    }
+    ListElement {
+        name: "Poland +48"
+        code: 48
+    }
+    ListElement {
+        name: "Portugal +351"
+        code: 351
+    }
+    ListElement {
+        name: "Puerto Rico +1 939"
+        code: 1939
+    }
+    ListElement {
+        name: "Qatar +974"
+        code: 974
+    }
+    ListElement {
+        name: "Romania +40"
+        code: 40
+    }
+    ListElement {
+        name: "Rwanda +250"
+        code: 250
+    }
+    ListElement {
+        name: "Samoa +685"
+        code: 685
+    }
+    ListElement {
+        name: "San Marino +378"
+        code: 378
+    }
+    ListElement {
+        name: "Saudi Arabia +966"
+        code: 966
+    }
+    ListElement {
+        name: "Senegal +221"
+        code: 221
+    }
+    ListElement {
+        name: "Serbia +381"
+        code: 381
+    }
+    ListElement {
+        name: "Seychelles +248"
+        code: 248
+    }
+    ListElement {
+        name: "Sierra Leone +232"
+        code: 232
+    }
+    ListElement {
+        name: "Singapore +65"
+        code: 65
+    }
+    ListElement {
+        name: "Slovakia +421"
+        code: 421
+    }
+    ListElement {
+        name: "Slovenia +386"
+        code: 386
+    }
+    ListElement {
+        name: "Solomon Islands +677"
+        code: 677
+    }
+    ListElement {
+        name: "South Africa +27"
+        code: 27
+    }
+    ListElement {
+        name: "South Georgia and the South Sandwich Islands +500"
+        code: 500
+    }
+    ListElement {
+        name: "Spain +34"
+        code: 34
+    }
+    ListElement {
+        name: "Sri Lanka +94"
+        code: 94
+    }
+    ListElement {
+        name: "Sudan +249"
+        code: 249
+    }
+    ListElement {
+        name: "Suriname +597"
+        code: 597
+    }
+    ListElement {
+        name: "Swaziland +268"
+        code: 268
+    }
+    ListElement {
+        name: "Sweden +46"
+        code: 46
+    }
+    ListElement {
+        name: "Switzerland +41"
+        code: 41
+    }
+    ListElement {
+        name: "Tajikistan +992"
+        code: 992
+    }
+    ListElement {
+        name: "Thailand +66"
+        code: 66
+    }
+    ListElement {
+        name: "Togo +228"
+        code: 228
+    }
+    ListElement {
+        name: "Tokelau +690"
+        code: 690
+    }
+    ListElement {
+        name: "Tonga +676"
+        code: 676
+    }
+    ListElement {
+        name: "Trinidad and Tobago +1 868"
+        code: 1868
+    }
+    ListElement {
+        name: "Tunisia +216"
+        code: 216
+    }
+    ListElement {
+        name: "Turkey +90"
+        code: 90
+    }
+    ListElement {
+        name: "Turkmenistan +993"
+        code: 993
+    }
+    ListElement {
+        name: "Turks and Caicos Islands +1 649"
+        code: 1649
+    }
+    ListElement {
+        name: "Tuvalu +688"
+        code: 688
+    }
+    ListElement {
+        name: "Uganda +256"
+        code: 256
+    }
+    ListElement {
+        name: "Ukraine +380"
+        code: 380
+    }
+    ListElement {
+        name: "United Arab Emirates +971"
+        code: 971
+    }
+    ListElement {
+        name: "United Kingdom +44"
+        code: 44
+    }
+    ListElement {
+        name: "United States +1"
+        code:1
+    }
+    ListElement {
+        name: "Uruguay +598"
+        code: 598
+    }
+    ListElement {
+        name: "Uzbekistan +998"
+        code: 998
+    }
+    ListElement {
+        name: "Vanuatu +678"
+        code: 678
+    }
+    ListElement {
+        name: "Wallis and Futuna +681"
+        code: 681
+    }
+    ListElement {
+        name: "Yemen +967"
+        code: 967
+    }
+    ListElement {
+        name: "Zambia +260"
+        code: 260
+    }
+    ListElement {
+        name: "Zimbabwe +263"
+        code: 263
+    }
+    ListElement {
+        name: "Bolivia, Plurinational State of +591"
+        code: 591
+    }
+    ListElement {
+        name: "Brunei Darussalam +673"
+        code: 673
+    }
+    ListElement {
+        name: "Cocos (Keeling) Islands +61"
+        code:61
+    }
+    ListElement {
+        name: "Congo, The Democratic Republic of the +243"
+        code:243
+    }
+    ListElement {
+        name: "Cote d'Ivoire +225"
+        code:225
+    }
+    ListElement {
+        name: "Falkland Islands (Malvinas) +500"
+        code:500
+    }
+    ListElement {
+        name: "Guernsey +44"
+        code: 44
+    }
+    ListElement {
+        name: "Holy See (Vatican City State) +379"
+        code:379
+    }
+    ListElement {
+        name: "Hong Kong +852"
+        code: 852
+    }
+    ListElement {
+        name: "Iran, Islamic Republic of +98"
+        code:98
+    }
+    ListElement {
+        name: "Isle of Man +44"
+        code: 44
+    }
+    ListElement {
+        name: "Jersey +44"
+        code: 44
+    }
+    ListElement {
+        name: "Korea, Democratic People's Republic of +850"
+        code:850
+    }
+    ListElement {
+        name: "Korea, Republic of +82"
+        code:82
+    }
+    ListElement {
+        name: "Lao People's Democratic Republic +856"
+        code:856
+    }
+    ListElement {
+        name: "Libyan Arab Jamahiriya +218"
+        code: 218
+    }
+    ListElement {
+        name: "Macao +853"
+        code: 853
+    }
+    ListElement {
+        name: "Macedonia, The Former Yugoslav Republic of +389"
+        code:389
+    }
+    ListElement {
+        name: "Micronesia, Federated States of +691"
+        code:691
+    }
+    ListElement {
+        name: "Moldova, Republic of +373"
+        code:373
+    }
+    ListElement {
+        name: "Mozambique +258"
+        code: 258
+    }
+    ListElement {
+        name: "Palestinian Territory, Occupied +970"
+        code:970
+    }
+    ListElement {
+        name: "Pitcairn +872"
+        code: 872
+    }
+    ListElement {
+        name: "Reunion +262"
+        code:262
+    }
+    ListElement {
+        name: "Russia +7"
+        code:7
+    }
+    ListElement {
+        name: "Saint Barthelemy +590"
+        code:590
+    }
+    ListElement {
+        name: "Saint Helena, Ascension and Tristan Da Cunha +290"
+        code:290
+    }
+    ListElement {
+        name: "Saint Kitts and Nevis +1 869"
+        code: 1869
+    }
+    ListElement {
+        name: "Saint Lucia +1 758"
+        code: 1758
+    }
+    ListElement {
+        name: "Saint Martin +590"
+        code: 590
+    }
+    ListElement {
+        name: "Saint Pierre and Miquelon +508"
+        code: 508
+    }
+    ListElement {
+        name: "Saint Vincent and the Grenadines +1 784"
+        code: 1784
+    }
+    ListElement {
+        name: "Sao Tome and Principe +239"
+        code: 239
+    }
+    ListElement {
+        name: "Somalia +252"
+        code: 252
+    }
+    ListElement {
+        name: "Svalbard and Jan Mayen +47"
+        code: 47
+    }
+    ListElement {
+        name: "Syrian Arab Republic +963"
+        code: 963
+    }
+    ListElement {
+        name: "Taiwan, Province of China +886"
+        code:886
+    }
+    ListElement {
+        name: "Tanzania, United Republic of +255"
+        code:255
+    }
+    ListElement {
+        name: "Timor-Leste +670"
+        code:670
+    }
+    ListElement {
+        name: "Venezuela, Bolivarian Republic of +58"
+        code:58
+    }
+    ListElement {
+        name: "Viet Nam +84"
+        code: 84
+    }
+    ListElement {
+        name: "Virgin Islands, British +1 284"
+        code: 1284
+    }
+    ListElement {
+        name: "Virgin Islands, U.S. +1 340"
+        code:1340
+    }
 }

examples/addressbook/qml/DropDownColumn.qml

@@ -1,5 +1,82 @@
-import QtQuick 2.0
+import QtQuick 2.9
+import QtQuick.Layouts 1.2
 
-Item {
+Column {
+    id: root
+    property alias header: _headerText.text
+    property alias value: _valueText.text
+    default property alias content: _content.data
+    anchors.left: parent.left
+    anchors.right: parent.right
+    state: "closed"
+    states: [
+        State {
+            name: "opened"
+            PropertyChanges {
+                target: _content
+                visible: true
+            }
+            PropertyChanges {
+                target: _ddArrow
+                rotation: 0
+            }
+        },
+        State {
+            name: "closed"
+            PropertyChanges {
+                target: _content
+                visible: false
+            }
+            PropertyChanges {
+                target: _ddArrow
+                rotation: 180
+            }
+        }
+    ]
 
+    MouseArea {
+        id: _header
+        height: 70
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.leftMargin: 10
+        anchors.rightMargin: 10
+        onClicked: {
+            root.state = root.state == "closed" ? "opened" : "closed"
+        }
+        RowLayout {
+            anchors.fill: parent
+            PrimaryText {
+                id: _headerText
+                Layout.alignment: Qt.AlignLeft | Qt.AlignBottom
+            }
+
+            PrimaryText {
+                id: _valueText
+                Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+                Layout.rightMargin: 20
+            }
+
+            Image {
+                id: _ddArrow
+                source: "qrc:/images/arrow.png"
+                Layout.alignment: Qt.AlignRight | Qt.AlignBottom
+                Behavior on rotation {
+                    NumberAnimation { duration: 200 }
+                }
+            }
+        }
+        Rectangle {
+            visible: false
+            anchors.fill: parent
+            color: "#66ff0000"
+        }
+    }
+
+    Column {
+        id: _content
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.leftMargin: 30
+    }
 }

examples/addressbook/qml/FloatingRoundButton.qml

@@ -19,6 +19,7 @@ Rectangle {
         anchors.centerIn: parent
         id: iconItem
     }
+
     MouseArea {
         id: control
         anchors.fill: parent

examples/addressbook/qml/InputRow.qml

@@ -1,5 +1,26 @@
-import QtQuick 2.0
+import QtQuick 2.9
+import QtQuick.Layouts 1.2
 
-Item {
+RowLayout {
+    property alias label: labelItem.text
+    default property alias content: _content.data
+    anchors.left: parent.left
+    anchors.right: parent.right
+    height: 70
+    spacing: 10
+    PrimaryText {
+        id: labelItem
+        Layout.alignment: Qt.AlignBottom
+        Layout.minimumWidth: 100
+        Layout.maximumWidth: 100
+        Layout.margins: 10
+    }
 
+    Item {
+        id: _content
+        Layout.fillHeight: true
+        Layout.fillWidth: true
+        Layout.margins: 10
+        Layout.alignment: Qt.AlignBottom
+    }
 }

examples/addressbook/qml/PhoneInput.qml

@@ -1,5 +1,62 @@
-import QtQuick 2.0
+import QtQuick 2.9
+import QtQuick.Layouts 1.2
+import QtQuick.Controls 2.3
 
-Item {
+InputRow {
+    property alias number: _inputItem.text
+    property int countryCode: parseInt(_ccModel.get(_countryCode.currentIndex).code, 10)
+    RowLayout {
+        anchors.fill: parent
+        ComboBox {
+            id: _countryCode
+            Layout.alignment: Qt.AlignLeft | Qt.AlignBottom
+            textRole: "name"
+            model: CountryCodesModel {
+                id: _ccModel
+            }
+            font.pointSize: 12
+            font.weight: Font.Bold
+            contentItem: Item {
+                clip: true
+                implicitHeight: comboBoxItem.implicitHeight + 20
+                implicitWidth: 130
+                SecondaryText {
+                    id: comboBoxItem
+                    anchors.bottom: parent.bottom
+                    anchors.bottomMargin: 10
+                    anchors.left: parent.left
+                    anchors.leftMargin: 10
+                    anchors.right: parent.right
+                    elide: Text.ElideMiddle
+                    text: _countryCode.currentText
+                }
+            }
+            background: Rectangle {
+                anchors.fill: parent
+                color: _countryCode.pressed ? "#55ffffff" : "#00ffffff"
+            }
 
+            delegate: ItemDelegate {
+                font.pointSize: 12
+                text: model.name
+            }
+        }
+
+        TextInput {
+            id: _inputItem
+            Layout.fillWidth: true
+            Layout.alignment: Qt.AlignBottom
+            font.pointSize: 12
+            color: "#ffffff"
+            validator: RegExpValidator {
+                regExp:/\d*/
+            }
+            Rectangle {
+                anchors.top: _inputItem.bottom
+                width: _inputItem.width
+                color: "#cfdfe7"
+                height: 1
+            }
+        }
+    }
 }

examples/addressbook/qml/TextInputRow.qml

@@ -1,28 +1,19 @@
 import QtQuick 2.9
 import QtQuick.Layouts 1.2
 
-RowLayout {
-    property alias label: labelItem.text
-    property alias text: inputItem.text
-    height: 70
-    spacing: 10
-    PrimaryText {
-        id: labelItem
-        Layout.alignment: Qt.AlignBottom
-        Layout.minimumWidth: 100
-        Layout.maximumWidth: 100
-        Layout.margins: 10
-    }
+InputRow {
+    property alias text: _inputItem.text
+    property alias input: _inputItem
     TextInput {
-        id: inputItem
-        Layout.fillWidth: true
-        Layout.margins: 10
-        Layout.alignment: Qt.AlignBottom
+        id: _inputItem
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
         font.pointSize: 12
         color: "#ffffff"
         Rectangle {
-            anchors.top: inputItem.bottom
-            width: inputItem.width
+            anchors.top: _inputItem.bottom
+            width: _inputItem.width
             color: "#cfdfe7"
             height: 1
         }

examples/addressbook/qml/main.qml

@@ -57,6 +57,8 @@ ApplicationWindow {
             onRequestAddContact: {
                 mainStack.push(addContactView, {"stack": mainStack})
             }
+            onShowContact: {
+            }
         }
     }
     Component {

examples/addressbook/resources.qrc

@@ -12,5 +12,10 @@
         <file>qml/TextInputRow.qml</file>
         <file>images/check.png</file>
         <file>images/minus.png</file>
+        <file>qml/DropDownColumn.qml</file>
+        <file>images/arrow.png</file>
+        <file>qml/CountryCodesModel.qml</file>
+        <file>qml/InputRow.qml</file>
+        <file>qml/PhoneInput.qml</file>
     </qresource>
 </RCC>