[MOPCON 2015] 談談行動裝置的 Accessibility

「什麼？這個字『唸』不出來？這到底是什麼功能？」這可能是很多盲人朋友在使用手機時心中的 OS。本議程將藉由簡單的例子 (Android / iOS) 來探討如何使用程式來解決。並從自身實際使用及教學的經驗，透過範例來了解什麼是友善的 APP，讓您的 APP 在絢麗外，也邁向無障礙 (Accessibility)。

Transcript

1. 锓锓遤⹛酤縨涸
   "DDFTTJCJMJUZ Young & Johnny
2. 泹狎䟴 • 揘㿁ဩՈ眢緹चᰂ䨝
 緹አ襎脲讨ਁ硽䋊 ፽疩 • NCC 翕殷篷ᵑ繸咳疻甛㹓䨝 甛㹓 • 篷ᵑ繸翕殷䲒介Ո㹓璢懺 拻䒍
3. c໡൞ᇏ๯ാૼ֥ℶᅰᆀ
   c໡൞ೂޅ൐Ⴈ໡֥൭Ὠ
   c໡෮მ֥֞↜ⅳ նἙ
4. https://fb.com/j796160836 Johnny Sung Mobile devices Developer https://plus.google.com/+JohnnySung http://about.me/j796160836
6. Ӯ碝皞砮襎岄
7. uPresenter iOS Client https://itunes.apple.com/app/id978059571 https://itunes.apple.com/app/id977146419 Mac Server https://play.google.com/store/apps/details?id=com.johnnyworks.presenter Android Client
8. uPresenter
9. uPresenter
10. uPresenter for Wear Ready to present When presenting
11. for Apple Watch uPresenter Ready to present When presenting
12. uPresenter iOS Client https://itunes.apple.com/app/id978059571 https://itunes.apple.com/app/id977146419 Mac Server https://play.google.com/store/apps/details?id=com.johnnyworks.presenter Android Client
13. նἙ c໡൞۽ӱ℩
    cᄝῘứഈေᇿၩ൉喁Ĥ
    cỚᧄ↥ᅰḧỆᆜ֥ཬ௑҄
14. Voice Over iOS
15. ᄸ喁Ῐ c၂Ϯ
    
    Ἁᇹ൐Ⴈ
    
    7PJDF0WFS
16. ॹ෎Ῐ c၂Ϯ
    
    Ἁᇹ൐Ⴈ
    
    Ἁᇹ൐Ⴈॹ෎ᾗ
17. ॹ෎Ῐ c)PNF
    ᾗ’ề೘༯đῘ⬏⇢Ẫ
18. 7PJDF0WFS
    ൭Ⅎࢺℚ
19. ฐ෬
    ề⇢ cề၂༯
    ∻
    5BMLCBDL
    ཌྷ๝ ଉአ瞲碍物
20. ⇢≢ࢊề cቐႷ߁ọ
    ∻
    5BMLCBDL
    ཌྷ๝ ଉአ瞲碍物
21. ềὧ (Click) cềؽ༯
    ∻
    5BMLCBDL
    ཌྷ๝ ଉአ瞲碍物
22. c⅄ᆷềؽ༯
    cࢤⅹ
    
    ㍂ỗểὐ
    c٢ၻ 
    cஅᅶ .BHJD5BQ ଉአ瞲碍物
23. ঵ồ c⅄ᆷཟഈ߁
    c ạⅽ঵ồ֞᾵ඏ ଉአ瞲碍物
24. ঵ồ c⅄ᆷཟ༯߁၂༯
    cạଢభ໊ᇂ঵ồ
 ֞᾵ඏ ଉአ瞲碍物
25. ي∉
    קਈ c೘ᆷ
    ཟഈ
    
    ཟ༯
    ߁
    c ཟഈ
    
    ཟ༯
    ⚂၂∉
 ↌∉⏟´ℭ൐Ⴈ 
 ଉአ瞲碍物
26. ي∉
    קਈ c೘ᆷ
    ཟቐ
    
    ཟႷ
    ߁
    c ཟభ
    
    ཟᗥ
    ⚂၂∉
 ም૫ي∉ℭ൐Ⴈ 
 ଉአ瞲碍物
27. ⊨⁛ c൭ᆷؽᆷ࿈⊨ ଉአ瞲碍物
28. ⊨⁛ cọቔ
    cṌⅳ
    cሳჭ
    cሳẞ
    c∽ၻ෎؇
    cಸఖ
29. ọቔ c⦄Ԣ
    c⬏Ⴈ⇊ଢč≁℟ọቔĎ
    cṌൕ㬪ໃồ
    cၛఋṌṌൕ
    c۷؟ čޓഒ
    "QQ
    ႵᆦჱĎ
30. Ệᆜ⅂ᆴ cഈ༯߁ọ ଉአ瞲碍物
31. ْ߭ c⅄ᆷቐႷῲ߭ℍọ
 ޓཞ಻ו֥൭Ⅎ ଉአ瞲碍物 čၹ㬪ޓഒ
    "QQ
    ႵᆦჱĎ
32. Ἤṅ∦ଞ c೘ᆷề೘༯ čᇿၩ҂ေ↪Ẕ֞Ď ଉአ瞲碍物
33. %FNP
34. -*/& cⅶⅾ≁´㢻Ⴕࢊề ? ? ?
35. Ḩ₽ളࠃ๙ cο₦⫸ⅾோ଀Ẁ 1 2 MBVODI@TFBSDI
    ο₦ MBVODI@OFBSCZ
    ο₦
36. ଲ೶ದℸྛọᇆ߰↌ cο₦⫸ⅾோ଀Ẁ
    cؽἠࢊề
     ⅾோο₦
     ẛ໓ሳ JDPO@DBMM
    ο₦ ֞ک৘₴ 1 2
37. ٚьᅳ cؽἠࢊề
     ⅾோο₦
     ẛ໓ሳ
    c ο₦↥مề⇢ OPPEMF
    ၘṉπ
    ο₦ ⚏ൊ
    ၘṉπ
    ο₦ 1 2
38. ൊᄝٚь cࢊềⅆ྽↜ⅳ
    cᆺ὜⫸wο₦x ⅄֑֑ṓ
    ☪∹֑ṓ

    ෻К൧↋Ὅ⃯ᇏὍਫ਼ؽ؍ཛྷ
    ଲὨṳ၀൧
    
    ଲὨṳ↥଀ᄪҔ֑ṓ
39. ൊᄝٚь ο₦ ο₦ ο₦ ο₦ c๙๙ᆺ⫸wο₦x
40. ↜ⅳ
41. ೲ衔 ೲ衔 ೲ衔...?
42. "DDFTTJCJMJUZ
    GPS
    J04 c℟קูս໓ሳ
    NSString * accessibilityLabel; NSString * accessibilityHint; UIAccessibilityTraits accessibilityTraits;
43. ঵ồ֥ࡏἧ
    GPS
    J04
    ໡֥ቋḨđο₦đềؽ༯ῲյῘ accessibilityLabel accessibilityHint accessibilityTraits
44. ℟קูս໓ሳ • accessibilityLabel • accessibilityHint • accessibilityTraits
45. cࡌ℟
    4QFD
    ေ୆ቓ၂ἠ≾∄֥ο₦ ο₦
46. ୆ॖି὜≾∄ቓ ॢϢο₦ ⅾோ
47. ᄝ
    9DPEF
    ֥∄ሰ
48. ⫸ఏῲࣼṉ≾∄
    “ ”
    
    ο₦
    
    “ ” accessibilityLabel accessibilityHint accessibilityTraits
49. ⅾோ֥ο₦ ୆ॖି὜≾∄ቓ
50. ᄝ
    9DPEF
    ֥∄ሰ
51. ⫸ఏῲࣼṉ≾∄
    “btn.png”đο₦
52. ୆ὕႵॖି὜≾∄ቓ ⅾோ֥ο₦ ໓ሳ
53. ᄝ
    9DPEF
    ֥∄ሰ
54. 
    ᇀᧄ≾ἠખ
55. ⫸ఏῲࣼṉ≾∄
    “btn.png”đο₦
    ໡֥ቋḨ
56. cẛ໓ሳ
    cᆺႵМࣟⅾோο₦
    cⅾோഈڭἒۋ∣⃯ ο₦⚧ቔٚൔ
    “btn.png”đο₦
    
    ο₦
57. cࠎЧჰ≣ğạቐطႷđạഈ֞༯
    cሱịⅆ྽ ࢊềⅆ྽ self.view.accessibilityElements = @[view01, view02];
58. ⊁Ṧ
    7PJDF0WFS
    ⬏Ⴈ⊯Ⅲ c䩏⤳๙ᆩ
 UIAccessibilityVoiceOverStatusChanged
    c஑ỗ
 UIAccessibilityIsVoiceOverRunning()
59. [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(voiceOverStatusChanged:) name:UIAccessibilityVoiceOverStatusChanged object:nil]; [[NSNotificationCenter defaultCenter] removeObserver:self name:UIAccessibilityVoiceOverStatusChanged object:nil]; 䩏⤳
    /PUJGJDBUJPOT ၍Ԣ
    /PUJGJDBUJPOT ⊁Ṧ
    7PJDF0WFS
    ⬏Ⴈ⊯Ⅲ
60. -(void)voiceOverStatusChanged:(NSNotification *)n { if (UIAccessibilityIsVoiceOverRunning()) { // Voice over is running } else { // Voice over is not running } } ஑ỗ
    7PJDF0WFS
    ⊯Ⅲ ⊁Ṧ
    7PJDF0WFS
    ⬏Ⴈ⊯Ⅲ
61. c၍ọࢊề
 UIAccessibilityLayoutChangedNotification
    c὎૫۷ྍ
    
    ὜Ⴕọቔၻི 
 UIAccessibilityScreenChangedNotification ࢊề๋၍ http://www.deque.com/blog/dynamic-notifications/
62. ࢊề๋၍ UIAccessibilityPostNotification( UIAccessibilityLayoutChangedNotification, view02); ၍ọࢊề֞ଖἠჭࡱഈ ὎૫۷ྍ
    ၍ọࢊềֻ֞၂ἠჭࡱഈ UIAccessibilityPostNotification( UIAccessibilityScreenChangedNotification, view01); UIAccessibilityPostNotification(
 UIAccessibilityScreenChangedNotification, nil); ὎૫۷ྍđ❣၍ọࢊề
63. ิൕ⇫༏ UIAccessibilityPostNotification( UIAccessibilityAnnouncementNotification, @"hello");
64. -(BOOL) accessibilityPerformMagicTap { // Do something } cℯቔ
    .BHJD5BQ
    ⅄ᆷềؽ༯
65. ק∕⊨⁛ọቔ UIAccessibilityCustomAction *a1 = [[UIAccessibilityCustomAction alloc] initWithName:@"Action 1" target:self selector:@selector(action01:)]; UIAccessibilityCustomAction *a2 = [[UIAccessibilityCustomAction alloc] initWithName:@"Action 2" target:self selector:@selector(action02:)]; self.myButton.accessibilityCustomActions = @[a1, a2];
66. ק∕⊨⁛ọቔ - (BOOL) action01:(UIAccessibilityCustomAction *)action { // Do something return YES; } - (BOOL) action02:(UIAccessibilityCustomAction *)action { // Do something return YES; }
67. ῘứԢấ c"DDFTTJCJMJUZ
    *OTQFDUPS

    
    J04
    4JNVMBUPS
    cሱ࠭ທुु
68. TalkBack Android
69. ν⊬
    (PPHMF
    ᇿၻ℻ೆم
 IUUQTQMBZHPPHMFDPNTUPSFBQQTEFUBJMT JEDPNHPPHMFBOESPJEBQQTJOQVUNFUIPE[IVZJO భᇂቔ∊ ν⊬
    ∽ὸ
    ჰ⇫Ỵ∽ၻ
    
    
 IUUQTQMBZHPPHMFDPNTUPSFBQQTEFUBJMT JEDPNJGMZUFLWGMZOPUF
70. ℟ק
    554
    ႄౣ c℟ק
    
    ↥ᅰḧ℟ק
    
    ໓ሳ⊨∽ၻ℻ԛ
71. ≁℟ᾗ₲ c℟ק
    
    ∽࿽∻℻ೆ℟ק
    
    ᾗ₲∻℻ೆم
72. ≁℟ᾗ₲ cṉ۷ᾗ₲đ⇢≢ᇏ໓ᇿၻ
73. Ῐ⬏
    5BML#BDL c℟ק
    
    ↥ᅰḧ℟ק
    
    5BML#BDL
74. 5BMLCBDL
    ൭Ⅎࢺℚ
75. ฐ෬
    ề⇢ cề၂༯ ∻
    7PJDF0WFS
    ཌྷ๝ ଉአ瞲碍物
76. ⇢≢ࢊề cቐႷ߁ọ ∻
    7PJDF0WFS
    ཌྷ๝ ଉአ瞲碍物
77. ềὧ (Click) cềؽ༯ ∻
    7PJDF0WFS
    ཌྷ๝ ଉአ瞲碍物
78. ⚂ọ
    ሱႮ c⅄ᆷቐႷ߁ọ
    ὜Ⴕၻᾲ֥℥⇉ ଉአ瞲碍物
79. ⚂ọ
    ሱႮ c⅄ᆷഈ༯߁ọ
    ὜Ⴕၻᾲ֥℥⇉ ଉአ瞲碍物
80. ⚂ọ
    קਈ c὎၂ἠ
    
    
    
    
    
    
    
    ژὂ
 ཟႷᄜສቐ߁ ଉአ瞲碍物 čၹ㬪҂ݺҠቔĎ Ꟛ㨥 穡勲 >
81. ӈႨ⇢Ẫ c὎၂ἠ
    
    
    
    
    
    
    
    ሳ
 ཟ༯
    
    Ⴗ߁ Ꟛ㨥 穡勲 L ଉአ瞲碍物
82. ӈႨ⇢Ẫ c≚๔߭∣
    c5BMLCBDL℟ק
    c໓ሳ⊨∽ၻ℟ק
83. ӈႨ⇢Ẫ cạỉ؊Ῐ൓倛ồ
    c௓ԛഈ၂ओὐ
    cạ༯၂ἠ⇊ଢῘ൓倛ồ
    cॹ෎ẹ´
84. cཟႷ
    
    ཟ༯߁ ↾ൕ๙ᆩਙ Ꟛ㨥 穡勲 ଉአ瞲碍物
85. ః෰ӈႨᆷ਷ #BDL
    ᾗ
    Ẫᆷཟ༯
    
    ቐ߁
    )PNF
    ᾗ
    Ẫᆷཟഈ
    
    ቐ߁
    ቋ࣍∣Ⴈӱൔ
    Ẫᆷཟቐ
    
    ഈ߁ ଉአ瞲碍物
86. cềؽ༯đ
 ֻؽ༯οᇾ❣຀ှ Ệᆜ⅂ᆴ ଉአ瞲碍物 čၹ㬪҂ݺҠቔĎ
87. "OESPJE
    
    ᗥ
    ྍᄹ cၻਈᾗॖ॥ᇅ߁㘑
    c๝ℭο
    ၻਈ
    ∻
    ၻਈ
    
    đ≚๔∽ၻ
    c㎆ọ൭Ὠđạ༯၂ἠ⇊ଢῘ൓倛ồ
88. %FNP
89. ٚьᅳ cؽἠࢊề
     ⅾோο₦
     ẛ໓ሳ 0,
    ӑഅ 0,
    ӑഅο₦ 1 2
90. ೘⊺ь૶Ḳ൭ 1 2
91. ೘⊺ь૶Ḳ൭ ἐ⇢ഈ૫ὕ൞⇢༯૫
    Ĥ 1 2
92. :BIPP
    ӑάഅӬ cο₦ࢊề↜ⅳ
    cο₦
    Ớб؇
    ↜ⅳ
    cο₦
    նཬ
    ↜ⅳ
    c∉૫ੀӱ↜ⅳ
93. :BIPP
    ӑάഅӬ cࢊề↜ⅳ
     ⅾோ
     ຓॿ 㢻Ⴕ଀Ẁ֥ο₦
     5*(&3
    ޷இ
    DD 1 2
94. :BIPP
    ӑάഅӬ cο₦
    նཬ
    
    Ớб؇
    ↜ⅳ č٢նῄଆൔĎ ྍᄹഅ௖
    ο₦
    
    
    
    
    
    
    
    %#%#%#
    Мࣟ
    
    
    
    
    
    
    
    '''
    Ớбᆴ
    
    
    
95. :BIPP
    ӑάഅӬ c∉૫ੀӱ↜ⅳ 螡䢔珶ߝ ᆙ粙毆薩 奾癱
96. :BIPP
    ӑάഅӬ c∉૫ੀӱ↜ⅳ 螡䢔珶ߝ 奾癱 ᆙ粙毆薩 <
    ࡆೆᇀἨ໾ṻ
    >
97. c℟קูս໓ሳ
    DPOUFOU%FTDSJQUJPO "DDFTTJCJMJUZ
    GPS
    "OESPJE android:contentDescription="౯ጱ磧眢" myButton.setContentDescription("౯ጱ磧眢");
98. ಕ⊾ࢊề ℟ק
    GPDVTBCMF
    
    DMJDLBCMF
    ὜Фಕ⊾ android:focusable="true"
 android:clickable="true"
99. ಕ⊾ࢊề
100. <RelativeLayout android:clickable="true"
 android:layout_width="match_parent"
 android:layout_height="wrap_content">
 
 <ImageView
 android:id="@+id/icon"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:src="@drawable/computer"/>
 
 <TextView
 android:id="@+id/ip"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_toRightOf="@+id/icon"
 android:text="192.168.4.107"/>
 
 <TextView
 android:id="@+id/port"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_toRightOf="@+id/icon"
 android:layout_below="@+id/ip"
 android:text="11000"/>
 </RelativeLayout> ಕ⊾ࢊề
101. TextView Recent TextView
 192.168.201.146 TextView 11000 ಕ⊾ࢊề RelativeLayout clickable ImageView @drawable/computer 
     
     3FDFOU
102. android:importantForAccessibility="auto" • auto - 羬翄ᛔᤈڣ䥁 (毆戔) • yes - ᥝ虏 Talkback ڣ捝 • no - ஺ኼᆿᗭ奲ᆌ讨牧֕䨝薹ຉৼزկ • noHideDescendants - 獊犋虏 Talkback ڣ捝 ޭ੻ಕ⊾ࢊề ಕ⊾ࢊề
103. cࠎЧჰ≣ğạቐطႷđạഈ֞༯
     cሱịⅆ྽ ࢊềⅆ྽ android:nextFocusUp="@+id/view01"
 android:nextFocusDown="@+id/view02" android:accessibilityTraversalBefore="@+id/view1"
 android:accessibilityTraversalAfter="@+id/view2"
104. AccessibilityManager manager = (AccessibilityManager) getSystemService(Service.ACCESSIBILITY_SERVICE); 
 if(manager.isEnabled()) {
 // Talkback is running
 } else {
 // Talkback is not running
 } ⊁Ṧ
     5BMLCBDL
     ൞ڎῘ⬏
105. ࢊề๋၍ view.requestFocus(); ေ౰ࢊề <TextView
 android:text="Hello World!"
 android:layout_width="wrap_content"
 android:layout_height=“wrap_content"> 
 <requestFocus /> 
 </TextView>
106. ิൕ⇫༏ view.announceForAccessibility("Hello"); API level 16
107. ῘứԢấ c↾ൕ∽ၻ℻ԛ
     c⅀⊯᾵ἧ⊁ấ
108. 冓೤
109. 冓೤ c໓ሳ
     ∻
     Мࣟ
     ֥Ớб؇
     c
     
     
     8$"(
     
     ""
     DPNQMJBODF
     c
     
     
     8$"(
     
     """
     DPNQMJBODF http://www.w3.org/TR/2008/REC-WCAG20-20081211/#visual-audio-contrast-contrast Web Content Accessibility Guidelines (WCAG) 2.0
110. 冓೤ http://snook.ca/technical/colour_contrast/colour.html
111. ο₦նཬ c
     Y
     
     QY
     
     
     (PPHMF
     c
     Y
     
     QY
     "QQMF https://www.google.com/design/spec/usability/accessibility.html#accessibility-types https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/ LayoutandAppearance.html
112. ߭Ἢ c⚇ࢳ↥ᅰḧҠቔ൭Ⅎ
     cⅾோο₦ေࡆഈูս໓ሳ
     c਽ၩࢊề֥ⅆ྽đ၍Ԣ঒ࠈ֥ิൕ℥
     cᇿၩ冓೤Ớб؇aο₦նཬ
     cỚᧄ♶≗֥
     6*
     đႨο₦ϔ
114. 3FGFSFODFT • https://developer.apple.com/library/ios/documentation/UIKit/Reference/ UIAccessibility_Protocol/ • http://www.deque.com/blog/dynamic-notifications/ • https://eyes-free.googlecode.com/svn/trunk/documentation/ android_access/index.html • https://www.udemy.com/accessibility-features-on-android/ • http://blog.supertop.co/post/117642258462/custom-accessibility-options- in-unread • http://www.programcreek.com/java-api-examples/index.php? api=android.view.accessibility.AccessibilityManager