Axure RP - Logika Kondisi

Pada bab ini, kita akan membahas logika kondisional yang digunakan dalam Axure RP.

If - Then - Else in Axure

Sama seperti alat pemrograman lainnya, Axure juga mendukung logika kondisional untuk membuat interaksi yang ditingkatkan dalam prototipe. Setelah Anda terbiasa dengan bagaimana Anda dapat memberikan interaksi, memberikan logika kondisional ke interaksi adalah tingkat berikutnya.

Berikut ini adalah alur sederhana dan ringkas untuk logika kondisional -

Jika, widget / layar tertentu diklik
Kemudian, lakukan tindakan / interaksi tertentu
Atau, pertahankan / ubah status widget atau layar

Untuk memahami ini lebih baik, mari kita lanjutkan alur dari contoh sebelumnya. Untuk tujuan ini, kami harus mengenal Condition Builder.

Pembangun Kondisi

Klik dua kali interaksi apa pun, misalnya OnClick. Anda akan dapat melihat Editor Kasus seperti yang ditunjukkan pada tangkapan layar berikut.

Klik tombol - Tambahkan Kondisi di dekat Nama Kasus. Ini akan ditampilkan di bawah di kotak dialog.

Seperti yang ditunjukkan di bawah Deskripsi, pembuat kondisi akan membuat aliran If-Then-Else sesuai kondisi yang dipilih di bagian kondisi.

Mari kita buat kondisi pada tombol ini.

Kami ingin menampilkan tombol sembunyikan gambar, setelah panel dinamis terlihat. Kami membuat panel dinamis terlihat pada klik tombol Show Image pada contoh sebelumnya. Sekarang, mari kita buat tombol lain Sembunyikan Gambar terlihat.

Tutup pembangun kondisi, dan kembali ke area desain.

Sisipkan tombol Sembunyikan Gambar dari Perpustakaan di bawah perpustakaan umum. Untuk mengulangi, praktik terbaiknya adalah memberi nama elemen UI tepat setelah Anda memasukkannya di area desain.

Klik kanan tombol Hide Image dan klik Set Hidden. Tombol akan disembunyikan dari area desain seperti yang ditunjukkan pada gambar layar berikut.

Sekarang, mari kita kembali ke interaksi untuk tombol Show Image.

Pertama, di bawah interaksi tombol Tampilkan Gambar, klik dua kali Kasus 1, Anda akan dapat melihat editor kasus. Gunakan tindakan Show / Hide, untuk memilih hideImageButton dan mengatur visibilitasnya untuk ditampilkan.

Demikian pula, menggunakan tindakan Perlihatkan / Sembunyikan, pilih showImageButton dan setel visibilitasnya untuk disembunyikan.

Kami telah mengatur visibilitas tombol Sembunyikan Gambar sehingga ketika kami mengklik tombol Tampilkan Gambar, tombol tersebut akan ditampilkan.

Kondisi lengkap akan seperti yang ditunjukkan pada screenshot berikut.

Mari kita bangun kondisinya.

Di bawah area desain, klik tombol Sembunyikan Gambar. Dari bagian Inspector, klik Add Case.

Di bawah Tambahkan Kasus, klik tombol Tambahkan Kondisi. Sesuai latar belakang yang disediakan sebelumnya, buat kondisi yang ditetapkan menggunakan nilai dropdown di Condition Builder.