【React Native】文件翻譯閱讀紀錄 - 基礎 - 處理觸碰
 |
| Facebook Open Source React Native |
用戶主要通過觸摸與移動應用交互。他們可以使用手勢的組合，例如點按按鈕，滾動列表或縮放地圖。 React Native提供了處理各種常見手勢的組件，以及一個全面的手勢響應系統，可以進行更高級的手勢識別，但您最有可能感興趣的一個組件是基本按鈕。
顯示基本按鈕
Button 提供了一個基本的按鈕組件，可以在所有平台上很好地呈現。顯示按鈕的最小示例如下所示：
<Button
onPress={() => {
Alert.alert('You tapped the button!');
}}
title="Press Me"
/>
這將在iOS上呈現藍色標籤，在Android上呈現帶有白色文本的藍色圓角矩形。按下按鈕將調用“onPress”功能，在這種情況下會顯示一個警告彈出窗口。如果您願意，可以指定“顏色”道具來更改按鈕的顏色。
使用下面的示例繼續使用 Button 組件。您可以通過單擊右下角的切換選擇預覽應用的平台，然後點擊“點擊播放”以預覽應用。
Touchables
如果基本按鈕看起來不適合您的應用，您可以使用React Native提供的任何“可觸摸”組件構建您自己的按鈕。 “可觸摸”組件提供捕獲輕敲手勢的能力，並且可以在識別手勢時顯示反饋。但是，這些組件不提供任何默認樣式，因此您需要做一些工作才能讓它們在您的應用中看起來很漂亮。
您使用哪種“可觸摸”組件取決於您想要提供的反饋類型：
您使用哪種“可觸摸”組件取決於您想要提供的反饋類型：
- 通常，您可以在任何可以使用Web上的按鈕或鏈接的地方使用TouchableHighlight。當用戶按下按鈕時，視圖的背景將變暗。
- 您可以考慮在Android上使用TouchableNativeFeedback來顯示響應用戶觸摸的墨水錶面反應漣漪。
- TouchableOpacity可用於通過降低按鈕的不透明度來提供反饋，從而允許在用戶按下時看到背景。
- 如果您需要處理點擊手勢但不希望顯示任何反饋，請使用TouchableWithoutFeedback。
在某些情況下，您可能希望檢測用戶何時按下並保持視圖一段時間。可以通過將函數傳遞給任何“可觸摸”組件的onLongPress道具來處理這些長按。
讓我們看看所有這些行動：
讓我們看看所有這些行動：
滾動列表，滑動頁面和縮放縮放
移動應用程序中常用的另一種手勢是滑動或平移。該手勢允許用戶滾動項目列表，或者瀏覽內容頁面。為了處理這些和其他手勢，我們將學習如何使用ScrollView。
0 意見