آموزشcomponent ها و API ها در React Native

آموزشcomponent ها و API ها در React Native

React Native چندین component built-in دارد. لیست کاملی از component ها و API ها در این سایت موجود است. اگر نمی دانید از کجا شروع کنید، یکی از دسته بندی های زیر مناسب است:

• component های پایه
• User Interface
• List View ها
• component های اختصاصی iOS
• component های اختصاصی android
• component های دیگر

البته شما محدود به component ها و API های React Native نیستید. React Native جامعه ای از توسعه دهندگان است. اگر دنبال کتابخانه ای با کاربردی مشخص می گردید، می توانید npm registry را برای package های React Native نگاه کنید. و یا نگاهی به Awesome React Native بیندازید.

component های پایه

اغلب application ها از یکی از این component ها استفاده می کنند. اگر تازه با React Native آشنا شده اید، بهتر است با آن ها آشنا شوید.

View: اساسی ترین component برای ساخت یک UI

Text: یک component برای نمایش متن

Image: یک component برای نمایش عکس

TextInput: یک component برای دریافت متن از طریق keyboard

ScrollView: یک container با قابلیت scroll که می تواند چندین View و component را درخود نگه دارد.

StyleSheet: یک لایه انتزاعی مشابه stylesheet های CSS

User Interface

از طریق این component ها می توان المان های کنترلی را render کرد.

Button: یک component پایه ی button برای دریافت تعاملات کاربر از طریق touch صفحه

Picker: یک component Picker native در iOS و android

Slider: component برای انتخاب یک مقدار از بین بازه ای از مقادیر

Switch: برای دریافت ورودی های Boolean

List View ها

برخلاف ScrollView، این component ها فقط المان هایی که در لحظه در صفحه نمایش داده می شود را render می کنند و برای لیست هایی با دیتای زیاد مناسب هستند.

FlatList: یک component با قابلیت scroll برای نمایش لیست

SectionList: مشابه FlatList با امکان بخش بندی لیست و افزودن تیتر به هر بخش

component ها و API های ویژه iOS

اغلب این component ها در حقیقت به عنوان wrapper برای کلاس های رایج UIKit عمل می کنند.

ActionSheetIOS: برای نمایش یک action sheet یا share sheet

AlertIOS: یک alert dialog به همراه پیام یا یک notification برای دریافت ورودی از کاربر

AlertIOS: یک alert dialog به همراه پیام یا یک notification برای دریافت ورودی از کاربر

DatePickerIOS: یک date/time picker برای iOS render می کند.

ImagePickerIOS: یک image picker برای iOS render می کند.

NavigatorIOS: یک wrapper برای کلاس UINavigationController، که می توانید با آن یک navigation stack بسازید.

ProgressViewIOS: یک UIProgressView برای iOS render می کند.

PushNotificationIOS: برای مدیریت notification ها، شامل مدیریت مجوزها و icon badge number، در application بکار می رود.

SegmentedControlIOS: یک UISegmentedControl برای iOS رندر می کند.

TabBarIOS: یک UITabViewController را برای iOS render می کند. به همراه TabBarIOS.Item استفاده شود.

component ها و API های ویژه android

اغلب این component ها در حقیقت به عنوان wrapper برای کلاس های رایج androidعمل می کنند.

BackHandler: دکمه سخت افزاری بازگشت را شناسایی می کند.

DatePickerAndroid: یک date picker استاندارد android را باز می کند.

DrawerLayoutAndroid: یک DrawerLayout android را render می کند.

PermissionsAndroid: امکان کار با مدل permission های معرفی شده در Android M را می دهد.

ProgressBarAndroid: یک ProgressBar android را render می کند.

TimePickerAndroid: یک time picker استاندارد android باز می کند.

ToastAndroid: یک notification Toast android می سازد.

ToolbarAndroid: یک Toolbar android را render میکند.

ViewPagerAndroid: یک container برای حرکت به چپ و راست بین child view ها

component های دیگر

این component ها برای کاربردهای خاصی استفاده می شوند. برای لیست کامل component ها و API ها، بخش مربوطه را ببینید.

ActivityIndicator: یک نشانگر دایره ای برای loading نمایش می دهد.

Alert: یک صفحه هشدار با تیتر و متن خاص نمایش می دهد.

Animated: کتابخانه ای برای ایجاد انیمیشن که براحتی قابل ساخت و استفاده هستند

Clipboard: واسطی برای دریافت و مقداردهی به محتوای clipboard در android و iOS

Dimensions: واسطی برای دریافت ابعاد device

KeyboardAvoidingView: یک view که به صورت خودکار در صورت وجود keyboard مجازی، کنار می رود.

Linking: یک واسط کلی برای کار با link هایی که به application وارد می شوند و یا link هایی که از application خارج می شود.

Modal: روشی برای نمایش محتوا روی یک view

PixelRatio: امکان دسترسی به pixel density device را می دهد.

RefreshControl: این component درون یک ScrollView استفاده می شود.

StatusBar: component برای کنترل status bar application

WebView: component که محتوای تحت وب را درون یک view native نمایش می دهد.