Cara Membuat Kolom Pencarian di Sketchware

Caridi.Net - Tutorial Sketchware kali ini kita akan membuat kolom pencarian serta mengarahkan text yang kita tulis menjadi kata kunci pencarian di google search .

Sebenarnya tutorial Sketchware kali ini sangat mudah namun semoga saja bisa bermanfaat buat kalian semua .

Cara Membuat Kolom Pencarian di Sketchware

Pertama silahkan buat project baru di Sketchware.

Masukan 1 Linear(H) , selanjutnya isi kolom Linear(H) dengan edittext dan imageview sehingga tampilannya akan seperti gambar di bawah ini .

Jika sudah selesai dan tampilannya sama seperti gambar di atas , silahkan klik edittext yang yang ada di kolom Linear(H) lalu klik properties.

Ubah weight edittext1 dari 0 menjadi 1 lalu ubah Hint yang semula edit text di hapus saja sehingga menjadi kosong .

Sekarang klik imageview1 yang ada di dalam linear(H) kemudian ubah gambar menjadi gambar button search .

Jika langkah yang dilakukan benar maka gambar akan persis seperti gambar di bawah ini .

Langkah selanjutnya kamu tinggal masukan webview di luar kolom Linear(H). Jika webview sudah dimasukan sekarang kita atur logika nya .

Masuk ke menu Logic kemudian klik imageview1 atur logicnya seperti berikut :

1. klik view lalu masukan blok webview .... loadUrl ....
2. Klik operator lalu masukan blok join....and... ke dalam kotak blok webview .... loadUrl ....
3. Klik view lalu masukan textview ... gettext ke kotak disamping and .
4. Isi kotak di samping loadUrl dengan https://www.google.co.id/search?q=
5. Atur kolom isian nya sehingga seperti berikut ini :
- webview webview1 LoadUrl https://www.google.co.id/search?q= and textview edittext1 gettext .

Jika benar maka akan seperti gambar di bawah ini

Jika sudah sama seperti gambar di atas sekarang kamu tinggal save project nya lalu klik run.

Silahkan di coba aplikasinya dengan cara masukan kata kunci pencarian yang kamu mau lalu klik icon search .
Di bawah ini adalah gambar contoh hasil pencarian di aplikasi yang barusan kita buat .

Gimana guys , berhasil gak ??

Jika ada kesulitan silahkan isi kolom komentarnya . Jangan lupa ikuti Caridi.net biar dapat updatean trik terbaru langsung ke hp kamu .

MEMBUAT OPREKMINI DI SKETCHWARE II

www.Caridi.net - Melanjutkan Artikel tutorial sketchware yang sebelumnya MEMBUAT MINI BROWSER DI SKETCHWARE . 

Setelah kemarin-kemarin kita baru membuat halaman utamanya saja sekarang kita akan membuat loadingnya berjalan lalu setelah loading beres kita akan arahkan ke halaman baru dan membuat addtext untuk mengarahkan sebuah link yang di masukan ke halaman website yang dituju . Namun sebelumnya saya berterima kasih buat kalian semua yang sudah mengapresiasi artikel-artikel yang saya terbitkan .

yuk langsung saja guys ,,

Pertama-tama kita buat loadingnya berjalan ,, di tutorial kemarin kita baru masukan loadingnya saja, nah sekarang kita buat loadingnya berjalan ,, kemarin saya sudah membuat artikelnya sekarang agan-agan semua tinggal baca saja yah , silahkan di baca tutorial MEMBUAT AKTIVITAS LOADING DI SKETCHWARE  nah jika sudah dibaca sekarang tinggal baca artikel berikut ini MENAMBAHKAN HALAMAN BARU DI SKETCHWARE . 

jika sudah membaca dan mempraktekan kedua langkah di atas sekarang kita lanjut ajah ya gan membuat kolom untuk memasukan text dan mengarahkan link yang kita masukan ke alamat website yang dituju .

yuk kita menuju ke halaman oprekmini2.xml dengan cara klik main.xml yang berada di pojok kiri bawah lalu klik oprekmini2.xml seperti gambar yang ada di bawah ini .

jika sudah , selanjutnya masukan Linear(H) kemudian masukan edittext dua buah dan ImageView ke Linear(H) .

klik edittext1 kemudian klik  properties  lalu ganti weight yang awalnya 0 menjadi 1 kemudian ganti juga Layout_gravity menjadi Bottom , klik text lalu ubah menjadi cari terakhir ubah text_collor menjadi grey atau abu-abu .

klik edittext2 kemudian klik  properties  lalu ganti weight yang awalnya 0 menjadi 1 kemudian ganti juga Layout_gravity menjadi Bottom , klik text lalu ubah menjadi http:// , ubah text_collor menjadi grey atau abu-abu . jika benar hasilnya kan seperti gambar di bawah ini

Sekarang kamu klik tuh ImageView nya yang gambarnya icon android , lalu klik Properties , jika sudah , klik ikon + yang berada di atas icon androidnya kemudian klik yang seperti icon di samping kanan icon tempat sampah , lalu kamu cari icon kaca pembesar / icon search kalau sudah ketemu klik ikon tersebut lalu klik save . jika icon search nya sudah di masukan sekarang kamu tinggal ganti icon android dengan icon search , caranya klik ikon android yang di dalam properties lalu ganti dengan icon kaca pembesar atau search . Jika benar akan seperti gambar di bawah ini .

gimana gampang kan !! ,, jika pusing atau belum mengerti tinggal tanya ajah yah di kolom komentar ,tapi tenang ajah jangan kemana-mana dulu masih belum selesai broh ,, sekarang kita lanjutkan  .

tambahkan lagi dua buah Linear(H) di bawah linear1 , tapi ingat , masukinnya satu-satu yah broh soalnya gak bisa langsung dua-duanya , nah jika sudah sekarang total linearnya menjadi tiga buah , klik linear2 kemudian klik Properties selanjutnya ganti weight menjadi 1 , jika sudah silahkan kembali lalu isi linear2 dengan WebView . klik webview nya kemudian klik properties kemudian ganti weight nya menjadi 1 .

jika langkah-langkah di atas benar maka tampilannya akan seperti gambar di bawah ini

masukan 3 buah imageview ke linear3 . selanjutnya masukan icon back , forward , dan icon close atau x ke imagemanager. buka properties imageviewnya satu-satu , silahkan ganti

nama yang awalnya imageview2 menjadi back
nama yang awalnya imageview3 menjadi close
nama yang awalnya imageview4 menjadi forward

ceklis center_horizontal dan center_vertical di dalam layout_gravity

ubah weight  menjadi 1

Kemudian ganti icon imageview2 menjadi back ,
imageview3 menjadi icon x dan
imageview4 menjadi icon forward .

jika langkah di atas dilakukan dengan benar maka tampilannya akan seperti gambar di bawah ini

gimana lumayan pusing kan ,, oke silahkan save dulu ,, selanjutnya kita kan membuat logika nya ,, tapi di artikel yang akan datang yah ... sampai jumpa guys

silahkan save alamat blog saya ,, untuk mengikuti tutorial selanjutnya . jika kamu tidak ingin ketinggalan tutorial selanjutnya silahkan masukan email kamu di kolom yang saya sediakan di bawah lalu klik subscribe ,, nanti saya akan kirim updatean tutorial ini langsung ke email kamu .

jika di tutorial kali ini ada kesulitan silahkan bertanya di kolom komentar tentang kesulitan kamu ,, jangan lupa di share yah , kita berbagi ilmu bersama-sama .

MENAMBAHKAN HALAMAN BARU DI SKETCHWARE

Tutorial kali ini bang caridi mau berbagi cara untuk menambahkan sebuah halaman kerja baru di sketchware . jika halaman main.xml kamu sudah terisi dengan menu-menu yang kamu rasa sudah cukup untuk tampilan utama aplikasi kamu , maka sekarang kita harus membuat halaman untuk menjadi tempat persinggahan dari halaman main.xml / halaman utama .

nah bang caridi sekarang mencoba membuat sebuah halaman baru untuk aplikasi yang saat ini bang caridi buat ,, yaitu oprex mini , nah jika kamu mau membuat sebuah aplikasi browser mini juga boleh di coba baca tutorialnya MEMBUAT MINI BROWSER DI SKETCHWARE .

sekarang kita mulai membuat halaman baru nya :

pertama silahkan buka project kalian masing-masing , kemudian klik main.xml yang ada dibagian pojok kiri bawah layar nanti akan terbuka halaman seperti gambar di bawah ini :

jika sudah muncul halaman seperti gambar di atas silahkan klik icon + . nah silahkan setting sesuai gambar di bawah ini .

jika sudah seperti itu tinggal tinggal klik add . nah sampai situ kamu sudah berhasil membuat halaman kerja baru di sketchware .

jika sudah berhasil berarti kamu tinggal membuat logika untuk mengarahkan dari halaman main.xml ke halaman oprexmini2 . silahkan ikuti tutorialnya di bawah ini

CARA SETTING LOGIC UNTUK MEMBUKA HALAMAN LAIN DI SKETCHWARE

Masuk ke menu logic nanti akan terbuka 2 menu di halaman tersebut . Menu Events dan menu Components ,sekarang kita buat komponen baru dengan cara klik icon + di samping menu components.  nanti akan muncul halaman komponen dan setting pengaturannya seperti gambar di bawah ini .

jika sudah di atur seperti tampilan gambar di atas sekarang kamu tinggal klik Add .

nah jika sudah di buat intent , sekarang kita tinggal mengatur logika nya .

saat ini saya memberi contoh didalam lembar kerja membuat oprekmini ,, untuk logika nya kamu bisa sesuaikan dengan project yang sedang kamu buat. Contohnya jika kamu ingin mengarahkan ke halaman dua dengan klik sebuah button maka kamu pasang logika ini di button OnClick .

yuk di lanjut ,, untuk di halaman lembar kerja oprekmini saya buat logika mengarahkan ke halaman oprekmini2 setelah loading selesai .

Klik OnCreate di bawah menu event , setelah terbuka halaman OnCreate Selanjutnya kamu masukan Component Timer ... after ... ms ( lewati langkah ini jika kamu bukan membuat aplikasi oprekmini . ikuti langkah di bawahnya) .

masukan ketiga component inten di bawah ini kedalam  Component timer , jika bukan membuat oprekmini tinggal masukan component inten nya saja ke logicnya .

masukan component intent ... setAction ...

masukan component intent ... setScreen ... 

masukan component StartActivity intent ... 

jika sudah selesai maka setting sesuai gambar di bawah ini 

untuk settingan bukan membuat oprekmini seperti gambar di bawah ini .

sampai disini kamu sudah berhasil membuat logika untuk mengarahkan halaman 1 ke halaman 2 .

silahkan save alamat blog saya ,, untuk mengikuti tutorial selanjutnya . jika kamu tidak ingin ketinggalan tutorial selanjutnya silahkan masukan email kamu di kolom yang saya sediakan di bawah lalu klik subscribe ,, nanti saya akan kirim updatean tutorial ini langsung ke email kamu .

jika di tutorial kali ini ada kesulitan silahkan bertanya di kolom komentar tentang kesulitan kamu ,, jangan lupa di share yah , kita berbagi ilmu bersama-sama .