التصنيفات
Android

استخدام Vectors في تطبيقات الاندرويد

في إصدار الاندرويد 5 قامت قوقل بإضافة دعم للفيكتور ولكن إصدارات الاندرويد القديمة لاتدعم هذا النوع من الصور ولكن في تحديث مكتبة support تم دعم VectorDrawableCompat و أيضا Animated VectorDrawableCompat .
ولا يخفى علينا أن للفيكتور أفضل من pngs سواء في الوضوح أو الحجم .

لاحظ الفرق في الصورة في الأسفل.

على اليسار تم استخدام Vector ونلاحظ الدقة بخلاف PNG

الاستخدام :
وتحتاج لاستخدام الفيكتور القيام بتحديث مكتبة الاندرويد Support إلى الإصدار 23.2
التفعيل :
من Bulid.gradle سنقوم بتفعيل flag  كما يظهر في الاسفل :

اذا كنت تستخدم Gradle v2 :

android {
  defaultConfig {
    vectorDrawables.useSupportLibrary = true
  }
}

اذا كنت تستخدم Gradle v1.5 :

android {
  defaultConfig {
    // Stops the Gradle plugin’s automatic rasterization of vectors
    generatedDensities = []
  }
  // Flag to tell aapt to keep the attribute ids around
  aaptOptions {
    additionalParameters "--no-version-vectors"
  }
}

طريقة الاستخدام :
نعلم انه في مكتبة appcompat تم اضافة عناصر جديدة وذلك لاضافة المميزات الجديدة للاصدارات القديمة من اندرويد . وتم اضافة attribute جديد باسم srcCompat وهذا attrs يقوم باستبدال android:src  ويمكنه التعامل مع Vector وايضاً الصور العادية .

سنقوم باضافة vector جديد باستخدام android Studio . من قائمة File -> new -> vector assets وقم باختيار الفيكتور المناسب او قم باضافته من جهازك مباشرة .

الان سنقوم باضافة Vector الى FloatActionButton كما نلاحظ في الكود بالاسفل :

<android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        app:srcCompat="@drawable/ic_alarm_on_black_24dp" />

هنا قمنا باضافة Vector باستخدام xml ماذا عن كتابته في كلاس جافا ؟!

لم تتغير طريقة اضافة Vector في Java عن اضافة الصور فسيكون الكود كالتالي

 FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
        fab.setImageResource(R.drawable.ic_alarm_on_black_24dp);

 الان قم باستخدام Vector واكسب بعض الحجم في تطبيقك 😍

اترك تعليقاً

لن يتم نشر عنوان بريدك الإلكتروني.