Cara Membuat VoiceOver Lebih Mesra di Apl iOS anda

Dengan beberapa perubahan semasa pembangunan, anda boleh mencipta pengalaman VoiceOver yang lebih baik untuk pengguna anda.

Sejak Apple pertama kali memperkenalkan ciri kebolehaksesan kepada iOS kira-kira lima tahun yang lalu, syarikat telah memperluaskan ciri-ciri ini ke aplikasi pihak ketiga dengan mewujudkan satu set API kebolehaksesan yang kaya. API ini memberi pemaju kemampuan untuk membuat aplikasi bantuan yang mencapai jangkauan pengguna yang lebih luas.

Tetapi, menjadikan aplikasi anda boleh diakses hanyalah permulaan. Anda juga harus empati dengan cara pengguna mungkin menavigasi kandungan aksesibiliti dalam aplikasi anda.

Terutamanya bercakap mengenai VoiceOver, fikirkan cara untuk mengurangkan beban navigasi yang kebolehaksesan mungkin menambah pengalaman. Di samping itu, perhatikan bagaimana VoiceOver mungkin berbunyi kepada pengguna kerana ia mengumumkan kandungan dari satu skrin ke satu atau satu komponen ke seterusnya.

Dalam tutorial ini, kami akan menunjukkan kepada anda cara untuk mengumpulkan barangan aksesibiliti anda dalam pandangan yang kompleks. Ini mengurangkan jumlah swiping melalui unsur-unsur di skrin dan membuat proses navigasi agak kurang rumit untuk pengguna.

Sebelum kita memulakan, mari pastikan anda mempunyai beberapa asas.

Hartanah Aksesibiliti, Belajar Menikmati Mereka

Ciri-ciri aksesibiliti adalah penting di jalan untuk menjadikan kandungan anda tersedia untuk komuniti yang lebih luas. Ciri-ciri kebolehcapaian yang kami akan fokuskan di sini adalahAccessibilityElement, shouldGroupAccessibilityChildren, accessibilityLabel, dan accessibility.

  • isAccessibilityElement: Mudah cukup, bukan? Nilai ini memberitahu iOS sama ada atau tidak ia adalah unsur yang boleh diakses oleh aplikasi bantuan.
  • shouldGroupAccessibilityChildren: Ini menyatakan sama ada VoiceOver harus mengumpulkan kumpulan unsur-unsur anak-anak penerima, tanpa mengira kedudukan mereka pada skrin (iaitu, sel UICollectionView dan UITableView).
  • accessibilityLabel: Inilah yang VoiceOver akan mengumumkan untuk elemen kebolehaksesan yang diberikan. Ia adalah label ringkas yang mengenal pasti unsur kebolehaksesan.
  • aksesibilitas Petunjuk: Biasanya, ini adalah perihalan tentang elemen kebolehcapaian tertentu atau boleh dilakukan. Contohnya, "Ketik dua kali untuk melihat" atau "Butang."

Menghidupkan VoiceOver dalam produk Apple anda boleh dilakukan dengan salah satu daripada dua cara:

  • Secara manual: Pada peranti anda, pergi ke Tetapan> Umum> Aksesibiliti> VoiceOver dan ketik VoiceOver ke keadaan di atas. Itu mudah dilakukan sekali, tetapi melakukan langkah-langkah ini beberapa kali berturut-turut semasa ujian menjadi membosankan. Nasib baik, ada pintasan!
  • Pintasan VoiceOver: Pada peranti anda, pergi ke Tetapan> Umum> Kebolehcapaian> Pintasan Kebolehcapaian dan pastikan VoiceOver dipilih. Kini, apa yang anda perlu lakukan untuk menghidupkan atau mematikan VoiceOver ialah tiga kali ketuk butang Utama. Hebat, betul ?!

Sekiranya anda tertanya-tanya ini tidak akan berfungsi dalam Simulator iOS. Anda perlu menguji penambahan kebolehaksesan anda pada peranti fizikal.

Got it? Besar, mari bermula.

Menggabungkan Kandungan Kebolehaksesan Ke Kumpulan

Seperti yang saya nyatakan sebelum ini, menavigasi melalui unsur-unsur aksesibiliti dengan cepat boleh menjadi aktiviti yang rumit. Bayangkan perlu meleret ke kiri dan kanan antara setiap label dan imej yang terdapat dalam UICollectionViewController atau UITableViewController. Tidak seronok, kan? Apa yang boleh anda lakukan untuk menjadikannya sedikit lebih menawan?

Salah satu cara saya ingin menyelesaikan masalah ini ialah memikirkan setiap sel dalam keadaan tersebut sebagai elemen tunggal. Sekarang bayangkan jika anda boleh leret ke kiri dan kanan di antara setiap sel kerana sel membuang semua kandungannya dan tidak dilabelkan oleh label. Betul, API aksesibiliti yang kaya dengan Apple memberi kami keupayaan untuk melakukan ini dengan silap mata yang mudah.

Mari lihat bagaimana kita boleh melakukan ini dengan UICollectionView.

Pertama, dalam kod anda, tetapkan sifat kebolehaksesan untuk paparan pengumpulan anda. Lihat contoh di bawah.

// Kebolehcapaian
collectionView.isAccessibilityElement = false
collectionView.shouldGroupAccessibilityChildren = true

Di sini kami memberitahu aplikasi bantuan untuk bertindak seperti pandangan pengumpulan tidak ada. Oleh itu, ia tidak akan dipilih sebagai swipes pengguna melalui pandangan ibu bapa apabila VoiceOver dihidupkan. Saya tahu ini seolah-olah menjadi intuitif, tetapi jangan risau. Perkara seterusnya yang akan kami lakukan ialah menetapkan setiap elemen dalam paparan koleksi sebagai unsur kebolehaksesan.

Dalam contoh ini, kami akan memohon akses kepada UICollectionViewCell yang memaparkan maklumat untuk album muzik. Setiap sel akan mempunyai imej, tajuk album, dan nama artis.

@IBOutlet var imageView: UIImageView!
@IBOutlet var titleLabel: UILabel!
@IBOutlet var artistLabel: UILabel!

Pertama, kami akan mengkonfigurasi sel kami:

func konfigurasi terakhir (model cellWithModel: Album) {
    jika membiarkan karya seniName = model.artworkName {
        imageView.image = UIImage (dinamakan: artworkName)
    }
    artistLabel.text = model.artist? .name
    titleLabel.text = model.title
    applyAccessibility ()
}

Kemudian, gunakan ciri-ciri aksesibiliti untuk setiap UICollectionViewCell:

func akhir berlakuAccessibility () {
    isAccessibilityElement = benar
    accessibilityLabel = "\ (titleLabel.text!) \ (artistLabel.text!)"
    accessibilityHint = "Ketuk dua kali untuk dimainkan."
    imageView.isAccessibilityElement = false;
    artistLabel.isAccessibilityElement = false;
    titleLabel.isAccessibilityElement = false;
}

Seperti yang dapat anda lihat, setiap sel ditetapkan sebagai elemen kebolehaksesan yang seterusnya menambahkannya ke senarai item aksesibilitas untuk pandangan induknya. Ini bermakna bahawa sebagai swipes pengguna melalui item paparan koleksi, setiap elemen akan mempunyai peluang untuk menerangkan kandungannya.

Kemudian, kami menambah bukan hanya tajukLabel teks tetapi juga teksLabel artist ke kebolehaksesanLabel sel. Dengan cara ini, seperti VoiceOver bercakap kepada pengguna, mereka mendengar kandungan kedua-dua label dalam sel album kami bukan hanya satu atau yang lain. Dan, tentu saja, kami menetapkan hak aksesHint supaya pengguna dapat mengetahui apa yang akan berlaku apabila mereka melaksanakan tindakan dua kali ketuk. Perlu diingat bahawa petunjuk kebolehaksesan akan sentiasa diucapkan berikutan seketika sebentar selepas aksesibiliti elemenLabel telah dibaca. Anda tidak akan mendengarnya dengan segera.

Akhir sekali, di dalam sel album kami, kami menetapkan nilai setiap kanak-kanak adalahAccessibilityElement kepada palsu. Sudah tentu, menetapkan sel sebagai unsur kebolehaksesan akan, secara lalai, membuat anak-anaknya unsur tidak mudah diakses.

Whew, sekarang selepas itu, mari kita lihat bagaimana ia berfungsi. Video ini menunjukkan apa yang akan berlaku jika kami tidak melakukan semua langkah di atas dan kemudian menunjukkan contoh di mana kami menggunakan sifat aksesibiliti kami.

Unsur-unsur sel berkumpulan bukan sahaja lebih baik apabila dibaca oleh VoiceOver, mereka mengurangkan navigasi.

Membuat UICollectionViewCells Boleh Dibawa Bunyi Seperti Manusia

Banyak masa, saya perhatikan pemaju bergegas menerusi kebolehcapaian dalam apl mereka. Ini boleh disebabkan oleh beberapa faktor, tetapi kandungan kebolehaksesanLabel hartanah cenderung memerlukan sedikit sentuhan cinta.

Dalam contoh terdahulu bagaimana kami menetapkan KebolehcapaianLabel sel album kami, anda akan melihat bahawa ia membaca lurus kandungannya dengan agak cepat dalam beberapa kes. Tetapi bagaimana jika kita menulis label kami sama dengan cara kita bercakap? Menambah koma, atau bahkan gabungan, dapat membantu membuat label bunyi lebih baik kepada khalayak anda dengan membuat jeda di dalam VoiceOver's dikte

Berikut adalah contoh mudah untuk menambah koma ke accessibilityLabel untuk sel album kami.

accessibilityLabel = "\ (titleLabel.text!), \ (artistLabel.text!)"

Ia halus tetapi berkesan. Tonton video pendek ini untuk mendengar apa perbezaan yang boleh dibuat. Dalam video, sel di sebelah kiri tidak mengandungi koma, manakala sel-sel di sebelah kanan lakukan.

Bekerja Dengan Kebolehaksesan Minda

Apple telah mengambil langkah pertama dan menyediakan pemaju dengan keupayaan untuk mencipta aplikasi dibantu. Menjalankan usaha itu dengan menambah akses ke alur kerja pembangunan anda. Lebih mudah daripada yang anda fikir dan pengguna aplikasi anda akan berterima kasih kepada anda!

Untuk lebih mendalam mengenai reka bentuk dan pembangunan, langganlah BPXL Craft dan ikuti Black Pixel di Twitter.

Black Pixel adalah agensi produk digital kreatif. Ketahui lebih lanjut di blackpixel.com.