SwiftUI ile Erişilebilirlik: VoiceOver



Herkese bolca selamlar. Ben Yuşa, WeWALK'ta iOS Developer olarak çalışıyorum. Bu yazıda, iOS uygulamamız için temel erişilebilirlik desteğini nasıl entegre edeceğimizi öğreneceğiz. SwiftUI projenize, bu yazıda uygulayacağımız tüm yöntemleri uygulayabilirsiniz.


Dünya Sağlık Örgütü'nün bir makalesine göre, 1 milyar insan görme bozukluğundan muzdarip. Bu 1 milyar insan arasında, ciddi uzak görme bozukluğu veya körlüğü olan 123.7 milyon insan var. Devasa bir insan nüfusundan bahsediyoruz. Modern dünyada, teknoloji şu anda günlük parçalarımızdan biri haline gelmiş durumda. Teknolojiyi hem iş yerinde, hem kişisel alanda hem de diğer şeyler için kullanıyoruz. Görme bozukluğu olmayan kişiler, uygulamaları, web sitelerini veya benzeri şeyleri engelsiz kullanabiliyorlar.


Peki ya görme engelliler ne olacak?


Ayrıca; zihinsel, öğrenme veya işitme engelli kişiler teknolojiyi verimli bir şekilde nasıl kullanacak? Bunun için neyse ki erişilebilirlik teknolojisi var. Bu yazı için, hem bahsettiğimiz dostlarımızın teknolojiden verimli bir şekilde yararlanabilmesi hem de uygulamamızın kullanıcı dostu olmasını sağlamak için erişilebilirliği kullanacağız. Peki erişilebilirlik nedir? Erişilebilirlik, ekranın tüm içeriğine ulaşılmasını sağlayan özellik bütünüdür. Bununla uygulamanızı daha erişilebilir hale getirebilirsiniz. Özelliği uyguladıktan sonra, kullanıcı içeriğe VoiceOver'ı kullanarak erişebilir.


Beni GitHub'da takip ediyorsanız, kesinlikle açık kaynak kodu ne kadar sevdiğimi biliyorsunuzdur. Açık kaynaklı iOS projelerimden birinde, uygulamamın görme, zihinsel, öğrenme veya işitme engelli kişilere hitap edebilmesi için erişilebilirlik desteğini kullanmaya başladım. Şimdi, size erişilebilirliği kullandığım bu projeden bazı kod parçalarını göstereceğim. Mevcut veya yepyeni bir SwiftUI projesi için hikayedeki tüm kod satırlarını uygulayabilirsiniz. Seçim sizin! Ayrıca, bu açık kaynaklı projeyi yazının sonunda da bulabilirsiniz! Harika, değil mi? Öyleyse başlayalım!



VoiceOver'ı Etkinleştirme



VoiceOver, kullanıcının ekranı görmek zorunda kalmadan uygulamayla etkileşim kurmasına olanak tanıyan bir ekran okuyucu teknolojisidir. Özellikle görme problemi olan kişiler için tasarlanmıştır. Bunu etkinleştirmek için Ayarlar > Erişilebilirlik > VoiceOver adımlarını takip edebiliriz. Ayrıca Apple, erişilebilirlik özelliklerine daha hızlı ulaşmaları için kullanıcılarına bir kısayol da sağlıyor. VoiceOver kısayolunu etkinleştirmek için Ayarlar > Erişilebilirlik adımlarını takip edebiliriz. Bu sayfanın altında Erişilebilirlik Kısayolu adında bir seçenek var. Buradan kısayol oluşturmak için bir seçenek seçebiliriz. Kısayolu etkinleştirmek için; fiziksel Home butonu olan iPhone için Home butonuna üç kez üst üste basabiliriz. Çentikli iPhone'lar için ise yan butona dokunabiliriz.



Erişilebilirlik Özellikleri



Erişilebilirlik özellikleri, erişilebilirliği uygulamamız için gereken temel bileşenlerdir. Bu özellikler, içerik hakkındaki bilgileri VoiceOver'a aktarır. Böylece kullanıcı, VoiceOver'ı kullanarak bilgileri (görmeden dinleyerek) okuyabilir. Erişilebilirlik özellikleri için beş temel özelliğimiz var. Şimdi bu özelliklere adım adım bakalım.


- Label: Öğenin adını tanımlar. Örneğin; COVID haberleri.

Text(covidNews.title)
    .font(.subheadline)
    .padding(.all, 10)
    .accessibility(label: Text(covidNews.title))

- Hint: Kullanıcının yapması gereken eylemi açıklar. Örneğin; bir ülke adı girin.

TextField("search".localized(), text: $searchText)
    .padding()
    .accessibility(hint: Text("search".localized()))

- Value: Bir elemanın değerini ifade eder. Örneğin; 10'da 1.

Slider(value: $kmRange, in: 1...10)
    .accessibility(value: Text("\(Int(kmRange)) out of 10"))

- Identifier: UI testlerinde veya kaynak kodunuzda tanımlamak için kullanabileceğiniz bir dize metnidir. Örneğin; daha fazlasını okuyun.

Button("read_more".localized()) {
    UIApplication.shared.open(URL(string: self.covidNews.link)!)
}
.padding(.all, 10)
.accessibility(identifier: "read_more".localized())

Bu bilgileri uygulamamıza uygulayalım ve sonuçları görelim. Aşağıdaki video'da çalışmamızın çıktısını inceleyebilirsiz.




Sonuç



Sonuç olarak, erişilebilirlik desteğimizi uygulamamıza başarıyla uyguladık. Yazının başında da söylediğim gibi erişilebilirliği kullandığım projeyi paylaşıyorum. Aşağıdaki linke tıklayarak ulaşabilirsiniz: Spreat


Hepinize, sağlıklı bir gün geçirmenizi diliyorum!


#iosdevelopment #swift #swiftui #accessibility #voiceover

0 yorum

Komünite

Platform

Mobiler.dev Anasayfa
  • Twitter
  • Instagram
  • development_düzenlendi_düzenlendi
  • Youtube
  • slack-icon-black_edited_edited_edited
  • Gri LinkedIn Simge
imageedit_2_9667998092.png
JetBrains Hakkında Detaylı Bilgi Alın

© 2020 by mobiler.dev

Kurumsal Yazar Hesapları

adesso.png
mobilerdevLogo.jpg
Yazarlık Başvurusu Hakkında Bilgi Alın, Başvuru Yapın.
Topluluk Yazarlarını Tanıyın