المكون ProgressBarAndroid في React Native

من موسوعة حسوب
اذهب إلى التنقل اذهب إلى البحث

مهمل: استعمل إحدى هذه الحزم من المجتمع بدلًا منه.

مكوّن React يعمل على نظام Android فقط، يُستخدم للإشارة إلى أن التطبيق قيد التحميل (loading) أو أن هناك بعض الأنشطة قيد التنفيذ في التطبيق.

إليك مثال (تجربة حية):

import React from 'react';
import {View, StyleSheet, ProgressBarAndroid, Text} from 'react-native';

const App = () => {
  return (
    <View style={styles.container}>
      <View style={styles.example}>
        <Text>Circle Progress Indicator</Text>
        <ProgressBarAndroid />
      </View>
      <View style={styles.example}>
        <Text>Horizontal Progress Indicator</Text>
        <ProgressBarAndroid styleAttr="Horizontal" />
      </View>
      <View style={styles.example}>
        <Text>Colored Progress Indicator</Text>
        <ProgressBarAndroid styleAttr="Horizontal" color="#2196F3" />
      </View>
      <View style={styles.example}>
        <Text>Fixed Progress Value</Text>
        <ProgressBarAndroid
          styleAttr="Horizontal"
          indeterminate={false}
          progress={0.5}
        />
      </View>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
  example: {
    marginVertical: 24,
  },
});

export default App;

الخاصيات

يرث خاصيّات المكوّن View.

‎‎animating‎‎

إظهار شريط التحميل (القيمة الافتراضيّة true) أو إخفائه (القيمة false).

النوع مطلوب
قيمة منطقيّة لا

‎‎color‎‎

لون شريط التحميل.

النوع مطلوب
لون لا

‎‎indeterminate‎‎

ما إذا كان شريط التحميل سيُظهر تقدّمًا غير مُحدّد. لاحظ أن هذا يمكن أن يكون ذا القيمة false فقط إذا كانت قيمةُ الخاصيّة styleAttr القيمةَ Horizontal، ويتطلب قيمةَ التقدّم progress.

النوع مطلوب
indeterminateType لا

‎‎progress‎‎

قيمة التّقدم (بين 0 و 1).

النوع مطلوب
عدد لا

‎‎styleAttr‎‎

نمط شريط التقدم. واحدة من القيم التالية:

  • عمودي: Horizontal
  • عادي: Normal (القيمة الافتراضيّة)
  • صغير: Small
  • كبير: Large
  • معكوس: Inverse
  • صغير-معكوس: SmallInverse
  • كبير-معكوس: LargeInverse
النوع مطلوب
('Horizontal', 'Normal', 'Small', 'Large', 'Inverse', 'SmallInverse', 'LargeInverse') لا

‎‎testID‎‎

يُستخدَم لتحديد موقع هذا العرض في الاختبارات الشاملة (end-to-end tests).

النوع مطلوب
سلسلة نصيّة لا

مصادر