Membuat TextInput pada Qt

Setelah sebelumnya kita membuat tampilan Grid pada Qt (http://www.proweb.co.id/articles/mobile_development/grid_qt.html), pada artikel ini kita akan membuat TextInput.

Langkah-langkah membuat TextInput pada Qt adalah seperti berikut ini:

1. Silahkan membuat Qt Quick Application seperti dijelaskan pada http://www.proweb.co.id/articles/mobile_development/qt_quick_appl.html .
    
2. Silahkan edit main.qml seperti berikut ini:
   import QtQuick 2.4
   import QtQuick.Window 2.2

   Window {
       visible: true
       Grid{
           rows: 2
           columns: 2
           spacing: 20

           Text{
               text:”Nama:”
           }
           Rectangle{
               width: 100
               height: 30
               color: “lightsteelblue”
               border.color:”gray”
               TextInput{
                   id:nama
                   width: 100
                   height: 30
                   text: “nama anda”
               }
           }

           Text{
               text:”Kota:”
           }
           Rectangle{
               width: 100
               height: 30
               color: “lightsteelblue”
               border.color:”gray”
               TextInput{
                   id:kota
                   width: 100
                   height: 30
                   text: “kota anda”
               }
           }
       }

   }
    

3. Jalankan Run dan tampilan akan seperti berikut ini:
   
   Terlihat bahwa ada form pengisian Nama dan Kota dan kemudian kita dapat mengisinya seperti gambar berikut ini:
   

Informasi lebih lanjut silahkan mengunjungi:
1. http://doc.qt.io/qt-5/qml-qtquick-textinput.html .
2. http://qmlbook.github.io/en/ch04/index.html#textinput .

Kunjungi www.proweb.co.id untuk menambah wawasan anda.