مدخل الى ملحقات الواجهة ( UI Components ) في NativeScript

xlmnxpمنذ 6 سنوات

بسم الله الرحمن الرحيم

السلام عليكم ورحمة الله وبركاته

ملحقات واجهة المستخدم ( UI Component ) هي ملحقات واجهة اصلية ( Native )  للجهاز تكون معدة مسبقًا في إطار NativeScript للأستخدام ( مثل الازرار ومستعراض النصوص والحقل النصي ) تساعد للأدخال والاخراج من والى واجهة المستخدم

(  UI هو اختصار لـ User Interface ( واجهة المستخم ) )

 

خصائص مشتركة في جميع الملحقات

id لتعيين معرف للملحق
class لتعيين صنف للملحق
style لتعيين سمة للمحلق
loaded تشغيل دالة بعد الأنتهاء من تحميل العنصر

الملحقات في nativescript

buttonPage.png.8e6f5fc194847e5ac0678e133425c0a6.png598191308cf05_buttonPage(1).png.e6de58c442ef6e6974eb87af9f6a163e.png

Button زر

 

labelPage.png.fd6aa38fc5bdcdb32da6b14b22d4a4e4.png5981913b3ac48_labelPage(1).png.6dcdd0f92871e2c31485d750d96ea32c.png

Label مستعرض نص

 

textFieldPage.png.40967537659955f2898308947f56db88.png5981914de7749_textFieldPage(1).png.ae05713123d7bf34c301d224a4671d5c.png

TextField حقل نصي للأدخال

 

textViewPage.png.0da50d1482f0e83b7c82241d30115ac2.png598191505eb02_textViewPage(1).png.7de130ee028e6e44d3fc402f212a5573.png

TextView حقل نصي متعدد الاسطر قابل للتمدد للأدخال

 

searchBarPage.png.114e708e8cb0122c2b0feff7d27cf8c4.png598191422ce63_searchBarPage(1).png.3c55fdcb811e0e6c51b3d907d39c0ef4.png

SearchBar شريط البحث

 

switchPage.png.1a0c450457e56fc5f40e4cf3f6b69db4.png598191472b2bc_switchPage(1).png.15ed7a30c81ed3498524afab7afe99d4.png

Switch مفتاح تبديل ( مشابه للمفتاح الكهربائي ) للتفعيل او الغاء التفعيل

 

sliderPage.png.ca147466bc069046f0100c24e6e77b65.png5981914576cfc_sliderPage(1).png.87e1c123bb4a75eb74cdc529dec57ef2.png

Slider منزلق لتحديد بين عدة قيم

 

progressPage.png.1b2a511d7ecdd61371f715e80109650e.png5981914058b94_progressPage(1).png.c058e5bbe75c484c737c12cb6eb6e659.png

Progress شريط التقدم شريط يعرض ما بين قيمتين 0 و 100

 

activityIndicatorPage.png.751722748022afb443d389cbe903bfd5.png5981912c8eb16_activityIndicatorPage(1).png.82495cbf542ee46bbf4926397a8d13af.png

ActivityIndicator مؤشر انتظار

 

imagePage.png.93c548643f842f6a7330f7617f45522d.png598191382e4c8_imagePage(1).png.6c8d1910bd29c5bc48ad64a074079996.png

Image مستعرض صور

 

listViewPage.png.c7b18554c3d5cd728190a4e384c61aa7.png5981913e96a29_listViewPage(1).png.82743a1ab8efd5d1878f93ea253d6bb8.png

ListView مستعرض لمصفوفة او لعدة حقول

 

htmlViewPage.png.7c03564e606fcf54dac205e9cf701d90.png5981913666cdc_htmlViewPage(1).png.1c71e10a341b8fa883ecf979c6737033.png

HtmlView مستعرض لناتج لشفرة HTML

 

webViewPage.png.d8250474f7acb4f75558b6e3ae2165d2.png5981915484050_webViewPage(1).png.2d385f8b8d6f50a4f552903a5115819a.png

WebView مستعرض ويب

 

tabViewPage.png.338aa9ac2c34d12578fd919b74ba06c3.png598191491448e_tabViewPage(1).png.0aa60c97b1888687878ed56e1233f54d.png

TabView علامات تبويب لعرض عدة صفحات داخل التطبيق

 

segmentedBarPage.png.4981b31f92f411f1b51c9944928b123b.png59819143be4a0_segmentedBarPage(1).png.d7b597308b2e481157f528ca54346c68.png

SegmentedBar شريط ازرار متقسمة

 

datePickerPage.png.225d314d8f64beb15b4e15a8ee553865.png59819132b36dd_datePickerPage(1).png.b4949e849157e2484757c8f9cc7c8f68.png

DatePicker لتحديد تاريخ معين من شريط التاريخ

 

timePickerPage.png.dda11be9c3b9f8d9408b9d946e165a93.png5981915241397_timePickerPage(1).png.17b38aabee4adc6ab0b163a67c90eacd.png

TimePicker لتحديد وقت معين من شريط الوقت

 

listPickerPage.png.91a09dd12ebb4a815c7548bc2be5522f.png5981913cbdadb_listPickerPage(1).png.f75b3fe1096a239da33f40eb2c7cf9bf.png

ListPicker للتحديد نص من مصفوفة نصوص

 

dialogsPage_confirm.png.64d464a2292469b61520e8aa4076c1c4.png598191349aa99_dialogsPage_confirm(1).png.ce6248de7f8cdd1c4ae980ffb7d7f736.png

Dialogs نوافذ منبثقة مثل اعلامات ( Alert )

التعليقات (0)

لايوجد لديك حساب في عالم البرمجة؟

تحب تنضم لعالم البرمجة؟ وتنشئ عالمك الخاص، تنشر المقالات، الدورات، تشارك المبرمجين وتساعد الآخرين، اشترك الآن بخطوات يسيرة !