الأربعاء، 16 سبتمبر 2015

Vector Drawable example

In Android 5.0 (API Level 21) and above, you can define vector drawables, which scale without losing definition.
(ref: http://developer.android.com/training/material/drawables.html#VectorDrawables)
Create vector image with the shape of a heart, drawable/heart.xml.
<!-- res/drawable/heart.xml -->
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:height="256dp"
android:width="56dp"
android:viewportWidth="32"
android:viewportHeight="32">

<path android:fillColor="#8f00"
android:pathData="M20.5,9.5
c-1.955,0,-3.83,1.268,-4.5,3
c-0.67,-1.732,-2.547,-3,-4.5,-3
C8.957,9.5,7,11.432,7,14
c0,3.53,3.793,6.257,9,11.5
c5.207,-5.242,9,-7.97,9,-11.5
C25,11.432,23.043,9.5,20.5,9.5z" />
</vector>

Use it on layout xml, layout/activity_main.xml.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:autoLink="web"
android:text="http://android-er.blogspot.com/"
android:textStyle="bold" />

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">

<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/heart"
android:background="#D0D0D0"/>

<ImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@drawable/heart"
android:background="#B0B0B0"/>

<ImageView
android:layout_width="match_parent"
android:layout_height="200dp"
android:src="@drawable/heart"
android:background="#909090"/>

</LinearLayout>

</LinearLayout>


next:
- Animate Vector Drawables (AnimatedVectorDrawable) example

ليست هناك تعليقات:

إرسال تعليق