在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ 輔助功能
JavaScript 環(huán)境
計時器
Native 模塊(iOS)
入門
在設(shè)備上運行
ProgressBarAndroid
iOS 應(yīng)用程序狀態(tài)
網(wǎng)絡(luò)
ToolbarAndroid
測試
輔助功能
網(wǎng)絡(luò)信息
DrawerLayoutAndroid
樣式表
手勢應(yīng)答系統(tǒng)
與現(xiàn)有的應(yīng)用程序集成
樣式
教程
不透明觸摸
調(diào)試 React Native 應(yīng)用
iOS 活動指示器
導(dǎo)航器
無反饋觸摸
動畫布局
Web 視圖
鏈接庫
像素比率
React Native 官網(wǎng)首頁介紹
iOS 導(dǎo)航器
交互管理器
全景響應(yīng)器
SwitchAndroid
TabBarIOS.Item
相機滾動
ToastAndroid
iOS 震動
BackAndroid
文本輸入
iOS 選擇器
應(yīng)用程序注冊表
iOS 開關(guān)
滾動視圖
iOS 日期選擇器
iOS 警告
iOS 鏈接
視圖
圖片
列表視圖
異步存儲
Native UI 組件(Android)
iOS 滑塊
Map 視圖
高亮觸摸
iOS 推送通知
文本
定位
iOS 狀態(tài)欄
Native UI 組件(iOS)
在設(shè)備上運行(Android)
Native 模塊(Android)
Flexbox
已知 Issues
iOS 選項卡
安裝 Android 運行環(huán)境

輔助功能

iOS

在 iOS 系統(tǒng)上輔助功能涵蓋許多話題,但對許多人來說輔助功能是 VoiceOver 的代名詞,即 iOS 3.0 版本以后的一種技術(shù)。它充當(dāng)屏幕閱讀器的角色,允許有視覺障礙的人使用 iOS 設(shè)備。點擊這里了解更多。

Android

對 Android 系統(tǒng)而言,輔助功能涉及到了許多不同的話題,其中之一是讓喪失視力的人能夠使用您的應(yīng)用程序。對于現(xiàn)在的社會,谷歌提供了一個名叫 TalkBack 的內(nèi)置屏幕讀者服務(wù)機器人。使用該機器人,你可以使用觸摸勘探和手勢來使用移動設(shè)備和應(yīng)用程序。TalkBack 可以使用文本語音轉(zhuǎn)換器來閱讀屏幕上的內(nèi)容并且可以發(fā)出警報來通知用戶有關(guān)于應(yīng)用程序中的重要信息。點擊這里來了解更多關(guān)于 Android 的輔助功能的特征以及點擊這里來了解更多關(guān)于使您的本地應(yīng)用程序的輔助功能。

創(chuàng)建輔助性應(yīng)用程序

輔助功能的性質(zhì)

輔助性(iOS, Android)

如果為 true的情況,代表該視圖是一個輔助功能元素。當(dāng)視圖是輔助功能元素時,它把它的子元素分組成一個單一的可選組件。默認情況下,可觸摸的所有元素都具有輔助性。

在 Android 系統(tǒng)中,在 react-native 視圖中 ' accessible={true}' 屬性將被翻譯成本地命令 ' focusable={true}'。

<View accessible={true}>
  <Text>text one</Text>
  <Text >text two</Text>
</View>

在上面的示例中,我們不能分別在 'text one' 和 'text two' 中獲得輔助焦點。相反我們可以在父元素上使用 'accessible' 屬性獲得焦點。

accessibilityLabel (iOS, Android)

如果要將視圖標(biāo)記為具有輔助性,那么一個比較好的做法就是為這個視圖設(shè)置一個 accessibilityLabel 標(biāo)簽以便使用 VoiceOver 的人知道他們選擇了什么元素。當(dāng)用戶選擇了一些元素,那么 VoiceOver 將會閱讀響應(yīng)的字符串文本。

若要使用它,在您的視圖中將 accessibilityLabel 屬性設(shè)置為一個自定義的字符串:

<TouchableOpacity accessible={true} accessibilityLabel={'Tap me!'} onPress={this._onPress}>
  <View style={styles.button}>
    <Text style={styles.buttonText}>Press me!</Text>
  </View>
</TouchableOpacity>

在上面的示例中,TouchableOpacity 元素中的 accessibilityLabel 會被默認的設(shè)置為 "點擊我!"。 該標(biāo)簽是通過使用空格符來串聯(lián)所有文本節(jié)點子元素構(gòu)造的。

accessibilityTraits (iOS)

輔助功能特征告訴人們他們在使用 VoiceOver 的時候選擇了什么元素。此元素是一個標(biāo)簽?一個按鈕?還是標(biāo)頭? accessibilityTraits 將會回答這些問題。

如果要使用它,請把 accessibilityTraits 屬性設(shè)置為 accessibilityTraits 輔助功能字符串(或數(shù)組)之一:

  • none 當(dāng)元素沒有特征的時候使用。
  • button 當(dāng)元素需要被當(dāng)做一個按鈕的時候使用。
  • link 當(dāng)元素需要被當(dāng)做鏈接的時候使用。
  • header 當(dāng)元素作為內(nèi)容部分的標(biāo)題 (如導(dǎo)航欄中的標(biāo)題) 的時候使用。
  • search 當(dāng)文本字段元素也被視為一個搜索字段的時候使用。
  • image 當(dāng)元素需要被作為圖像,比如和按鈕和鏈接結(jié)合的時候使用。
  • selected 當(dāng)該元素被選中時使用。例如,表中被選中的行或者分段控件中選中的按鈕。
  • plays 當(dāng)元素被激活的并且播放自己的聲音的時候使用。
  • key 當(dāng)元素充當(dāng)鍵盤按鍵的時候使用。
  • text 當(dāng)元素應(yīng)該被視為不能更改的靜態(tài)文本的時候使用。
  • summary 當(dāng)在應(yīng)用程序首次啟動的時候,該元素可以提供應(yīng)用程序的實時狀況的摘要的時候使用。例如,當(dāng)關(guān)于天氣的應(yīng)用程序首次啟動的時候,帶有當(dāng)天天氣信息的元素將被該特征所標(biāo)記。
  • disabled 當(dāng)控件未啟動并且對用戶的輸入無響應(yīng)的時候使用。
  • frequentUpdates 當(dāng)元素經(jīng)常更新其標(biāo)簽或者它的值,但是太平凡的發(fā)送通知的時候使用。允許輔助功能客戶端輪詢更改。秒表就是一個例子。
  • startsMedia 當(dāng)激活一個元素并開始一段媒體會話(例如播放電影,錄制音頻)不應(yīng)該被輔助技術(shù)的輸出所打斷,比如 VoiceOver。
  • adjustable 當(dāng)元素可以被"調(diào)整"的時候使用(例如滑塊)。
  • allowsDirectInteraction 當(dāng)元素允許 VoiceOver 用戶直接進行觸摸互動的時候使用(例如,表示一個鋼琴鍵盤的視圖)。
  • pageTurn 當(dāng)它完成閱讀的元素的內(nèi)容時候通知 VoiceOver 需要滾動到下一個頁面。

onAccessibilityTap (iOS)

使用此屬性來分配一個自定義的函數(shù),當(dāng)有人在一個可訪問元素被選中的時候通過雙擊來激活它的時候來調(diào)用該函數(shù)。

onMagicTap (iOS)

當(dāng)有人使用 “magic tap”手勢,即:用兩個手指雙擊的時候,該屬性就會被分配給一個自定義函數(shù),同時,這個函數(shù)會被調(diào)用。一個魔法敲擊函數(shù)應(yīng)該執(zhí)行用戶可以在組件中找到的最具有相關(guān)性的操作。在 iPhone 的手機應(yīng)用程序中,一個魔法敲擊可以接聽或者結(jié)束一個電話。如果所選的元素不具有 onMagicTap 功能,該系統(tǒng)將遍歷視圖層次結(jié)構(gòu)直到它找到一個擁有此功能的視圖。

accessibilityComponentType (Android)

在某些情況下,我們也要提醒選定的組件類型的最終用戶 (即,它是一個"按鈕")。如果我們正在使用本機的按鈕,那么它會自動工作。由于我們使用的是 javascript,所以我們需要為 TalkBack 提供更多的語境。為了達到這個目的,您必須為所有 UI 組件指定 'accessibilityComponentType' 屬性。例如,我們支持 'button','radiobutton_checked' 和 'radiobutton_unchecked'等。

<TouchableWithoutFeedback accessibilityComponentType=”button”
  onPress={this._onPress}>
  <View style={styles.button}>
    <Text style={styles.buttonText}>Press me!</Text>
  </View>
</TouchableWithoutFeedback>

在上面的示例中,TouchableWithoutFeedback 是被 TalkBack 作為一個本機按鈕聲明的。

accessibilityLiveRegion (Android)

當(dāng)組件動態(tài)的更改時,我們希望 TalkBack 去提醒最終用戶。'AccessibilityLiveRegion' 屬性讓這成為可能。它可以被設(shè)置為 ‘none’, ‘polite’ 以及 ‘a(chǎn)ssertive’。

  • none 輔助功能服務(wù)不應(yīng)該對此視圖通知改變的地方。
  • polite 輔助功能服務(wù)應(yīng)該對此視圖通知改變的地方。
  • assertive 輔助功能服務(wù)應(yīng)該中斷正在進行的會話,并且以立即宣布該視圖的改變。
<TouchableWithoutFeedback onPress={this._addOne}>
  <View style={styles.embedded}>
    <Text>Click me</Text>
  </View>
</TouchableWithoutFeedback>
<Text accessibilityLiveRegion="polite">
  Clicked {this.state.count} times
</Text>

在上面的示例方法 _addOne 更改了 state.count 變量。當(dāng)最終用戶單擊 TouchableWithoutFeedback 的時候,因為 TalkBack 的 'accessibilityLiveRegion=”polite”' 屬性,所以它讀取了文本視圖中的文本。

importantForAccessibility (Android)

對于兩個重疊的并且擁有相同父元素的 UI 組件,默認的輔助功能焦點可以有不可預(yù)知的行為。如果一個視圖觸發(fā)輔助事件并且它被匯報給了輔助功能服務(wù)器,那么 'ImportantForAccessibility' 屬性將會通過控制解決它,它可以被設(shè)置為‘a(chǎn)uto’, ‘yes’, ‘no’ 以及 ‘no-hide-descendants’ (最后一個值將迫使輔助功能服務(wù)忽略該組件和它的所有子元素)。

<View style={styles.container}>
  <View style={{position: 'absolute', left: 10, top: 10, right: 10, height: 100,
    backgroundColor: 'green'}} importantForAccessibility=”yes”>
    <Text> First layout </Text>
  </View>
  <View style={{position: 'absolute', left: 10, top: 10, right: 10, height: 100,
    backgroundColor: 'yellow'}} importantForAccessibility=”no-hide-descendant”>
    <Text> Second layout </Text>
  </View>
</View>

在上面的示例中,對于 TalkBack 以及其他的輔助功能服務(wù)而言,黃色的布局及其后代是完全不可見的。所以我們可以容易的使用來自于同一個父元素并且不帶有令人疑惑的 TalkBack 的視圖。

發(fā)送輔助功能事件(Android)

有時候在 UI 組件中去觸發(fā)一個輔助功能事件很有用 (即當(dāng)一個自定義的視圖在屏幕上顯示或自定義單選按鈕已被選中)。為了達到這個目的,本地 UIManager 模塊公布了一個名叫 'sendAccessibilityEvent' 的方法。它擁有兩個參數(shù): 視圖標(biāo)簽和一個類型的事件。

_onPress: function() {
  this.state.radioButton = this.state.radioButton === “radiobutton_checked” ?
  “radiobutton_unchecked” : “radiobutton_checked”;
  if (this.state.radioButton === “radiobutton_checked”) {
    RCTUIManager.sendAccessibilityEvent(
      React.findNodeHandle(this),
      RCTUIManager.AccessibilityEventTypes.typeViewClicked);
  }
}

<CustomRadioButton
  accessibleComponentType={this.state.radioButton}
  onPress={this._onPress}/>

在上面的例子中,我們創(chuàng)建了一個如同本按鈕的自定義單選按鈕。更具體地說,TalkBack 可以正確的公布單選按鈕選擇的變化。

測試 VoiceOver 支持的內(nèi)容(iOS)

如果要啟用 VoiceOver,那么請在你的 iOS 設(shè)備上打開設(shè)置應(yīng)用程序的位置。點擊 General,然后點擊 Accessibility。那里你會發(fā)現(xiàn)許多人們用來優(yōu)化他們的設(shè)備的工具,比如粗體文本、 增加的對比度以及 VoiceOver。

如果要啟用 VoiceOver,點擊 "Vision" 下的 VoiceOver,打開顯示在頂部的開關(guān)。

在輔助功能設(shè)置的最底部,還有一個"輔助功能的快捷方式"。你可以使用它三次單擊主頁按鈕來觸發(fā) VoiceOver。