Localization: كيف تدعم أكثر من لغة في تطبيقك

Ammar AlTahhanمنذ 9 أشهر

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

 

سنتعرف في هذا الدرس على طريقة انشاء تطبيق يدعم تعدد اللغات بحسب لغة الجهاز، سنعتمد اللغتين العربية والانجليزية في هذا التطبيق.

 

سنبدأ أولا باضافة جميع اللغات التي نريد دعمها في تطبيقنا

نذهب الى Project Navigator

598db809e98a7_ScreenShot2017-08-11at4_04_21PM.thumb.png.0a3448df36c5f239c4820761d51f3952.png

ثم نقوم باضافة اللغات المطلوبة من الأسفل

598db7f260434_ScreenShot2017-08-11at4_05_29PM.thumb.png.d5266e3898066230b7bbbc94923d0746.png

نلاحظ تقسيم الملفات الى لغتين كما في الصورة

598db7f4b1871_ScreenShot2017-08-11at4_11_04PM.png.db2f771db7234b0b8668face37d082b9.png

االآن سنقوم بانشاء ملف من نوع String لنخزن فيه جميع الStrings باللغتين العربية والانجليزية

اضغط على File > New > File واختر النوع String كما في الصورة

598db7fa32711_ScreenShot2017-08-11at4_12_00PM.thumb.png.173c8f629fd3dee53cf5e6ac49809559.png

تأكد من تسمية الملف باسم "Localizable" تماما كما هو ليتعرف عليه الxCode بشكل صحيح

الآن نختار الملف الجديد من اليسار، ومن قائمة الFile Inspector نضغط على Localize ونختار اللغة الانجليزية مبدئيا

598db801a4f5b_ScreenShot2017-08-11at4_14_46PM.thumb.png.988c13954ad1dc1835eda03475db213e.png

الآن نختار اللغة العربية أيضا لنقوم بتقسيم ملف الLocalizable.strings الى لغتين

598db8047b899_ScreenShot2017-08-11at4_15_11PM.png.628e610e54c24a750fb3dbe1227a1a4a.png

قم باضافة الStrings المطلوبة الى الملفين بالطريقة التالية

599013cfd7f1e_ScreenShot2017-08-13at11_41_08AM.thumb.png.78b3a34c612058190616d5824f881435.png

ليقوم الxCode بعمل Build تأكد من:

  • كتابة الkey بشكل موحد بين اللغتين العربية والانجليزية
  • وضع علامة ال= بين الkey والvalue
  • كتابة الvalue بين علامتي تنصيص ""
  • انهاء السطر بSemi-Colon ;

 

 

لنرى طريقة استدعاء الStrings  من ملف Localizable قمت بعمل الواجهة البسيطة التالية:

598db80ece0ae_ScreenShot2017-08-11at4_22_10PM.thumb.png.30864886281f5f77e32a7bc0201c000b.png

وقمت بربط الOutlets والActions كالتالي:

598db7df8e67a_ScreenShot2017-08-11at4_22_17PM.thumb.png.9f637a799e010979c0515aea0e80da81.png

 

الآن اضف الكود التالي في زر اللغة الانجليزية:


		let path = Bundle.main.path(forResource: "en", ofType: "lproj")
        let bundle = Bundle.init(path: path!)! as Bundle
        
        nameLbl.text = bundle.localizedString(forKey: "WebsiteName", value: nil, table: nil)

والتالي لزر اللغة العربية:


		let path = Bundle.main.path(forResource: "ar", ofType: "lproj")
        let bundle = Bundle.init(path: path!)! as Bundle
        
        nameLbl.text = bundle.localizedString(forKey: "WebsiteName", value: nil, table: nil)

 

في السطر الأول: قمنا بتعريف الpath الذي سيوصلنا لكل من ملفات اللغة العربية والانجليزية

(يمكنك معرفة الResource والType من قائمة الFile Inspector عند الضغط على ملفي العربية والانجليزية)

59902d58d57a0_ScreenShot2017-08-11at4_54.24PMcopy.png.4fe1fb84c14cb92e1124c4fa76380451.png

في السطر الثاني قمنا بتعريف كل من ملفات اللغتين كVariable يحمل الاسم bundle

في السطر الثالث قمنا باستدعاء الString المطلوب باستخدام الميثود localizedString(_:String,_:String,_:Strint( 

 

والآن عند تجربة البرنامج نرى النتيجة التالية (صورة GIF):

 

59903066c8d13_Webp.net-gifmaker(2).gif.3a338b5ee0ed29809a8612736caf38b0.gif

 

حتى الآن كنا نحدد ملف اللغة الذي نريد استدعاء الString منه

والآن سنقوم بتغيير النص اعتمادا على لغة الجهاز باستخدام زر واحد فقط

لنرى ذلك قمت بتغيير الStoryboard ليحتوي على زر واحد فقط، وقمت باضافة الoutlets والactions كالتالي:

599013d402869_ScreenShot2017-08-13at11_42_03AM.thumb.png.9156cb90e6811f5d3c565a5b23bfcb64.png

599013da0a9c4_ScreenShot2017-08-13at11_45_28AM.thumb.png.27847ba98c13f4c2f82d7d165207e176.png

 

والآن قم باضافة السطرين التاليين للميثود viewDidLoad()


let btnTitle: String = NSLocalizedString("ButtonText", comment: "")
languageBtn.setTitle(btnTitle, for: .normal)

والسطر التالي للميثود الخاصة بالbutton action


nameLbl.text = NSLocalizedString("WebsiteName", comment: "")

في هذه الاكواد، قمنا باستعمال الميثود NSLocalizedString لاستدعاء الString المناسب بحسب لغة الجهاز

لتجربة البرنامج سنقوم بتشغيله على جهاز بلغة انجليزية، ثم سنحولها للعربية ونعيد التجربة

(صورة GIF):

59902ffef35d2_Webp.net-gifmaker(1).gif.cc0f211795dcbb5d40717be7d3ef64b3.gif

Webp.net-gifmaker.gif.e29126ee2476fcf836a6b379b980b503.gif

 

 

وصلنا الى ختام الدرس، أستودعكم الله الذي لا تضيع ودائعه.

كلمات دليلية:
0
إعجاب
110
مشاهدات
0
مشاركة
0
متابع
متميز
محتوى رهيب

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

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

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