Alihkan tampilan status

Aug 20 2020

Saya mendesain ulang satu set matikan di mana beberapa di antaranya dapat diaktifkan dan dinonaktifkan dengan menggunakan pola standar. Namun, beberapa di antaranya diaktifkan secara default karena izin admin tetapi tidak dapat dinonaktifkan oleh pengguna . Tampilan saat ini menunjukkan matikan ini dengan warna hijau yang lebih terang tetapi seperti yang saya katakan, itu tidak dapat diklik. Ini membuat saya merasa bingung saat menganalisis perilaku dan saya berasumsi pengguna mungkin merasakan hal yang sama. Menurut Anda, apakah ada cara untuk menampilkan toggle ini sehingga pengguna tahu bahwa mereka telah diaktifkan tetapi statusnya tidak dapat diubah? Aplikasi ini responsif dan dapat ditampilkan melalui banyak perangkat. Terima kasih sebelumnya!

Jawaban

44 SoorajMV Aug 20 2020 at 18:24

Desain Material Menunjukkan Status Terkunci dengan versi berwarna abu-abu seperti ini:

Tetapi masalahnya di sini adalah aksesibilitas. Pengguna dengan disabilitas terkait penglihatan tidak akan dapat membedakan keduanya.

Yang dapat Anda lakukan adalah menambahkan simbol gembok di dalam sakelar bersama dengan warna opasitas yang kurang dan Jika pengguna mencoba berinteraksi dengannya, berikan keterangan alat yang mengatakan 'dikunci oleh admin' / "Diaktifkan oleh admin" atau semacamnya.

20 musefan Aug 20 2020 at 18:17

Meskipun memiliki gaya "pudar" untuk kontrol yang dinonaktifkan cukup standar, masalahnya di sini adalah perbedaannya terlalu halus untuk dilihat pengguna dengan jelas.

Anda dapat mengubah warna dari hijau menjadi abu-abu (misalnya), namun hal itu mungkin berisiko kehilangan kejelasan yang sebenarnya berarti "diaktifkan" (yang merupakan tujuan utama dari warna hijau).

Dengan pemikiran tersebut, saran saya adalah menghindari penggunaan kontrol sama sekali untuk tujuan ini. Sebagai gantinya, Anda dapat menggunakan teks untuk menampilkan status aktif / nonaktif tanpa kebingungan menggunakan kontrol untuk melakukannya. Sebagai contoh:


Sebagai alternatif, seperti yang disarankan oleh jcaron, Anda juga dapat secara eksplisit menyatakan bahwa pengaturan telah ditetapkan oleh administrator. Ini membantu menjelaskan kepada pengguna bahwa mereka tidak dapat mengubahnya. Sesuatu seperti ini:

6 thomic Aug 20 2020 at 18:47

Pertama, Anda harus jelas, apakah sakelar Anda harus hanya-baca atau dinonaktifkan.
Inilah artikel bagus tentang itu:https://vaadin.com/docs/v8/framework/articles/ReadOnlyVsDisabledFields.html

Dalam proyek terakhir saya, saya menggunakan gaya ini untuk membedakan status sakelar sakelar.
Sakelar tersebut "aktif dan dipilih", "aktif", "nonaktif" dan "hanya-baca".