ما هي الأشياء القابلة للمس في React Native؟
ما هي الأشياء القابلة للمس في React Native؟
user
تعمل اللمسات كبدائل للأزرار. على عكس الأزرار، يمكنك تشغيل دعائم النمط من خلالها مما يسمح بمستوى عالٍ من التخصيص. توفر المكونات القابلة للمس القدرة على التقاط إيماءات النقر ويمكنها عرض التعليقات عند التعرف على الإيماءة. فيما يلي مثال على استخدام Touchable....

استيراد React، { useState } من 'react'؛
استيراد {StyleSheet، Text، View، FlatList، TouchableOpacity} من 'react-native'؛

تصدير الوظيفة الافتراضية التطبيق () {
  const [people, setPeople] = useState([
    { الاسم: 'شون'، المعرف: '1' }،
    { الاسم: 'يوشي'، المعرف: '2' }،
    { الاسم: 'ماريو'، المعرف: '3' }،
    { الاسم: 'لويجي'، المعرف: '4' }،
    { الاسم: 'خوخ'، المعرف: '5' }،
    { الاسم: 'الضفدع'، المعرف: '6' }،
    { الاسم: 'العربة'، المعرف: '7' }،
  ]);

  const pressHandler = (id) => {
    console.log(id);
    setPeople((prevPeople) => {
      return prevPeople.filter(person => person.id != id);
    });
  };

  يعود (
    <عرض النمط={styles.container}>

      <FlatList
        عدد الأعمدة={2}
        keyExtractor={(العنصر) => item.id}
        البيانات = {الناس}
        renderItem={({ العنصر }) => (
          <TouchableOpacity onPress={() => pressHandler(item.id)}>
            <نمط النص={styles.item}>{item.name}</Text>
          </TouchableOpacity>
        )}
      />

    </عرض>
  );
}

أنماط ثابتة = StyleSheet.create({
  حاوية: {
    فليكس: 1،
    الحشو العلوي: 40،
    الحشو الأفقي: 20،
    لون الخلفية: '#fff'،
  },
  غرض: {
    فليكس: 1،
    هامشأفقي: 10,
    الهامش العلوي: 24،
    الحشو: 30،
    لون الخلفية: "وردي"،
    حجم الخط: 24،
  },
});
assistant