handling-touches
Хэрэглэгч гар утасны апптай харилцахдаа дэлгэцэд хүрдэг. Товчлуур дээр дарах, жагсаалт гүйлгэх, газрын зураг томруулах гэх мэт үйлдлүүд хийдэг. React Native-т бүх төрлийн үйлдлийг зохицуулдаг компонент байдаг. Мөн хариу үйлдлийн цогц систем-тэй бөгөөд энэ нь үйлдлийг илүү ахисан түвшинд танихад тусалдаг. Гэхдээ таны сонирхлыг татах нэг компонент нэг гол компонент бол энгийн Товч юм.
Энгийн товчийг харуулах
Товч нь бүх платформ дээр сайхан харагдах энгийн товчин компонент юм. Элдэв маяггүй товчийг оруулах жишээ :
<Button
onPress={() => {
Alert.alert('You tapped the button!');
}}
title="Press Me"
/>
Энэ товч нь iOS дээр цэнхэр тэмдэг харагдах бол Android дээр цагаан тексттэй дугуй ирмэгтэй цэнхэр тэгш өнцөгт харагдана. Энэ товчийг дарвал "onPress" ажиллах бөгөөд анхааруулга цонх дэлгэц дээр гарч ирнэ. Хэрэв хүсвэл та "өнгийн" пропыг тохируулж товчныхоо өнгийг өөрчилж болно.
Доорх жишээг ашиглан Товч компонентийг хүссэнээрээ ашиглаад үзээрэй. Баруун доод хэсэгт байрлах солих товч дээр дараад аппаа ямар платформ дээр урьдчилан үзэхээ сонгож болно. Тэгээд "Tap to Play" гэсэн дээр дарж аппаа урьдчилан харж болно.
Touchables
Хэрвээ энгийн товч нь таны апп-д тохирохгүй бол та React Native-ийн "Touchable" компонентийг ашиглан өөрийн хүссэн товчоо бүтээх боломжтой. "Touchable" компонент нь товших үйлдлийг таних чадвартай бөгөөд үйлдлийг таньсан даруйдаа хариу үйлдлийг дэлгэц дээр харуулдаг. Эдгээр компонентэд өгөгдмөл хэв маяг гэж байхгүй. Апп дээр товчоо гоё харагдуулахын тулд та бага зэрэг хөдөлмөрлөх шаардлагатай. Аль "Touchable" компонент ашиглах нь ямар төрлийн хариу үйлдэл үзүүлэхийг хүсэж байгаагаас тань хамаарна.
Ерөнхийдөө, та TouchableHighlight-ыг товч эсвэл веб холбоосыг хүссэн газартаа ашиглаж болно. Товч дээр дарах үед арын суурь өнгө бараан болно.
Android дээр хэрэглэгч хүрэх үед бэхний өнгө хөвөрдөг хариу үйлдэл хийдэг болгохыг хүсвэл TouchableNativeFeedback ашиглаарай.
TouchableOpacity ашиглавал товчны харагдах хүч сулрах бөгөөд хэрэглэгч дэлгэц дээр дарж байх үед арын суурийг нэвт харагддаг болгоно.
Хэрэв та товших үйлдлийг хүлээн авах ч ямар нэг хариу үйлдэл дэлгэц дээр харуулахгүй байхыг хүсвэл TouchableWithoutFeedback ашиглаарай.
Зарим үед та хэрэглэгч нэг зүйл дээр дараад, хэр удаан харж буйг мэдэхийг хүсэж магад. "Touchable" компонентуудын аль ч onLongPress пропсийг ажиллуулан энэхүү удаан дарах явцыг зохицуулж болно.
Бодитоор ямар байдгийг харцгаая:
Жагсаалт гүйлгэх, хуудас эргүүлэх болон томруулах
Гар утасны апп дээр түгээмэл хийгддэг өөр нэг үйлдэл нь гүйлгэх эсвэл хөндлөн, босоо байрлалд шилжүүлэх юм. Ингэснээр хэрэглэгч жагсаасан зүйлсийг гүйлгэн харж, хуудас бүхий контентийг гүйлгэн харах боломжтой болдог. Эдгээр болон бусад үйлдлийн талаар мэдэхийг хүсвэл ScrollView хэрхэн ашиглах тухай гэдгийг уншаарай.