مقدمة في استخدام Data Binding

في الاونة الاخيرة قامت اندرويد باصدار مكتبة Data Binding وهي مكتبة تساعدنا على التعامل اكثر مع التصميم ولغة xml بشكل موسع ويمكن تعريفها بـ”اكواد جافا اقل واكواد xml اكثز “.

كنا في السابق نسخدم findviewbyid كمرجع للـViews في التصميم ولكن مع استخدام المكتبة الجديدة سنتغني جملة وتفصيلا عن هذه الدالة وسنبدأ في البرمجة بمنطقية باستخدام لغة XML الخاصة بالواجهات والمصادر .

اتبع الخطوات بالاسفل وستكون النتيجة مرضية لك بشكل كبير وستتضح لك الصورة ان شاء الله ?.

١ – اضافة المكتبة للـAndroid Studio :

سنقوم بانشاء مشروع جديد ونقوم بتجهيز الـAndroid Studio بالمكتبات اللازمة ,اذهب الى هذا الملف داخل ملفات المشروع build.gradle وقم باضافة السطر التالي :

classpath "com.android.databinding:dataBinder:1.0-rc1"<br>

سيكون الملف لديك بهذا الشكل :

dependencies {
        classpath 'com.android.tools.build:gradle:1.3.0'
        classpath "com.android.databinding:dataBinder:1.0-rc1"
    }

الان سنقوم باضافة data binding plugin مباشرة بعذ android plugin بالشكل التالي :

apply plugin: 'com.android.application'
apply plugin: 'com.android.databinding'

جميل الان اصبح المشروع يدعم Data Binding

٢ – كتابة اول data binding :

سنقوم الان بكتابة مثال بسيط يوضح لنا طريقة استخدام Data Binding .

سنقوم بانشاء Class لاستخدامه كـData Object وسناخذ ابسط انواع Data وهو (POJO) .

هذا النوع من Object لاتتغير القيم بعد اضافتها 

public class User {
   private final String firstName;
   private final String lastName;
   public User(String firstName, String lastName) {
       this.firstName = firstName;
       this.lastName = lastName;
   }
   public String getFirstName() {
       return this.firstName;
   }
   public String getLastName() {
       return this.lastName;
   }
}

Class بسيط يحتوي علي متغيرين من نوع String لاسم المستخدم الاول والاخير لايوجد تغيير هنا ولكن سيكون التغيير في ملف التصميم الخاص بالشاشة لدينا وهو activity_main.xml 

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android">

    <data>
        <variable
            name="user"
            type="name.ahmed.databindingtutorial.User" />
    </data>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.firstName}" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@{user.lastName}" />
    </LinearLayout>
</layout>

? نلاحظ هنا ان عملية التصميم تختلف عن ماتعلمناه وتاتي Data Binding بداية ب layout ويتكون من عنصر data و وتصميم الشاشة الخاص بنا .

<variable
            name="user"
            type="name.ahmed.databindingtutorial.User" />

اضفنا هنا متغير المسؤول عن البيانات وحددنا له اسم user و نوع البيانات من class user الذي قمنا بانشائه سابقا

انتبه الى مسار Class داخل مشروعك

<TextView android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="@{user.firstName}"/>

تتم كتابة المتغيرات داخل خصائص Views بهذا الشكل “{}@” ونلاخظ ان text قمنا بكتابة اسم المتغير user وبعد ذلك اسم المستخدم firstName .

لايوجد هناك اكمال تلقائي فيجب عليك الحذر عند كتابة المتغيرات 

الان نكون قد انتهينا من طريقة ربط Class بالتصميم وايضا تجهيز TextView لعرض اسم المستخدم  سننتقل الان لكود الجافا لدينا في Activity .

٣ – ربط البيانات :

الان وبعد الانتهاء افتراضيا سيقوم Binding Class بتوليد Data Binding من ملف layout . الجميل ان اسم Class الذي تم انشاءه سيكون نفس اسم ملف التصميم activity_main.xml متبوعا بكلمة Binding اي سيكون بهذا الاسم “ActivityMainBinding” وسيكون هذا الكلاس مسؤول عن التعامل مع variable وايضا مع ملف التصميم .

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ActivityMainBinding binding = DataBindingUtil.setContentView(this, R.layout.activity_main);
        User user = new User("محمد", "عبدالله");
        binding.setUser(user);
    }

الان عند تشغيل التطبيق ستظهر لنا هذه النتيجة :

..