مقالات طراحی اپلیکیشن اندروید آموزش ساخت یک vector در اندروید

ساخت یک vector در اندروید به جای استفاده از تصاویر bitmap دو دلیل مهم دارد:

بدون هر گونه از دست دادن کیفیت بزرگنمایی می شوند و برای همه‌ی صفحات با هر density فقط یک vector نیاز است.

با استفاده از SVG paths می توان یک vector در اندروید ساخت که به روش آن می پردازیم.

مثالی برای آشنایی با روش ساخت vector در اندروید:

 

قصد ساخت شکل زیر را داریم :

یک مثلث با رنگ فیروزه ای در بالا چپ و یک مثلث با رنگ سبز تیره در پایین راست.

۱ – ابتدا یک فایل drawable با نام دلخواه ایجاد میکنیم :

 

۲ – ساخت یک vector در اندروید با سایز و مشخصات زیر می سازیم :

اندازه height و width را براساس نیاز خود تغییر دهید، android:viewportWidth و android:viewportHeight ویژگی های بیسار مهمی برای تعیین میزان canvas هستند که برای راحتی با اندازه height و width یکی در نظر میگیریم.

۳ – رسم اولین مثلث :

برای رسم اولین مثلث باید مسیر مانند شکل زیر از A به B سپس به C برویم :

 

باید متذکر شد که گوشه بالا چپ نقطه (۰,۰) است و گو شه ی پایین راس نقطه (۱۰۰,۱۰۰) است زیرا ما android:viewportWidth=”100″ و android:viewportHeight=”100″ را اینگونه مقداری کرده ایم.

روش اضافه کردن مسیر به vector به گونه زیر است:

برای ایجاد مسیر ما از سه متغییر کمک میگیریم که به توضیح آنها می پردازیم.

M : به معنی Moveto که نقطه شروع حرکت را مشخص می کن.

L : به معنی Lineto که خط به نقطه بعدی را رسم می‌ کند.

z : در پایان هر سمیر این متغیر را میگذاریم.

برای رسم مثلث بالا باید :

  1.  از نقطه (A=(0,0  شروع کنیم : M 0,0
  2. بعد باید به نقطه (B=(100,0 برویمL 100,0
  3. عد به نقطه (C=(0,100 می رویم : L 0,100

۴ – در آخر مسیر را میبیندیم : z

مسیر کلی حرکت ما به این شکل می شود : M 0,0 L 100,0 0,100 z

حال این مسیر را در داخل vector با رنگ دلخواه قرار می دهیم :

شکل زیر از مسیر بالا پدید می آید.

 

۴ – رسم مثلث دوم :

برای رسم مثلث دوم باید :

  • (B=(100,0
  • (C=(0,100
  • (D=(100,100

پس مسیر به این گونه می شود : M 100,0 L 0,100 100,100 z

و شکل نهایی به صورت زیر می شود:

 

برای دیدن آموزش های دیگر در تیک۴ اینجا کلیک کتید.

آموزش ساخت یک vector در اندروید
5 (100%) 1 vote
Telegram Facebook WhatsApp +Google Twitter LinkedIn

دیدگاه خود را بیان کنید

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

This site uses Akismet to reduce spam. Learn how your comment data is processed.