🌙اليوم العاشر من دروس فيجما في رمضان
🌟تطبيق عملي على كيفية استخدام component اللي كان في درس امس في التصميم.
#figma
🌟تطبيق عملي على كيفية استخدام component اللي كان في درس امس في التصميم.
#figma
في درس امس احنا عملنا زر ك component في فيجما مع ضبط كل الخصائص فيه من تعديل نص الزر، إظهار او إخفاء مكونات الزر الداخلية او تغيير شكل الأيقونة.
فيديو يوضح الناتج النهائي لدرس امس:
رابط درس امس للي ماشافه:
فيديو يوضح الناتج النهائي لدرس امس:
رابط درس امس للي ماشافه:
عندي هذي البطاقة من درس الثاني من دروس تعلم فيجما (درس خاصية Auto Layout).
رابط الدرس:
رابط الدرس:
احتاج أضيف زرين اثنين واحد رئيسي و واحد فرعي مع أيقونة فقط. الناتج النهائي احتاجه يكون زي كذا.
كيف استخدم الزر اللي عملناه في الدرس امس:
كيف استخدم الزر اللي عملناه في الدرس امس:
١- اول شئ احتاج ابحث عن الزر من خلال خانة assets وأخذ نسخة منه مثل الموضح في الفيديو.
٢- احتاج اغير نص الخط للزر الرئيسي من خلال خانة text في component. اما بالنسبة للزر الفرعي احتاجه يكون زر بأيقونة فقط (أيقونة حفظ) ويكون ستايل فرعي (outline) مثل الموضح في الفيديو.
٣- احتاج استخدم خاصية Auto Layout عشان تكون الأزرار جنب بعض في التصميم واضيفه على البطاقة مثل الموضح في الفيديو.
📍بسبب ان استخدمنا Auto Layout على كامل البطاقة تأقلم حجم البطاقة مع تغيير المحتوى تلقائياً.
📍بسبب ان استخدمنا Auto Layout على كامل البطاقة تأقلم حجم البطاقة مع تغيير المحتوى تلقائياً.
٤- نلاحظ ان كل شئ في البطاقة له حواف منحنية (Border Radius) ما عدا الأزرار فالأفضل ان الأزرار تكون له نفس الحواف للتوحيد. عندي حلين لهذه المشكلة:
- إما نغير الحواف من component الرئيسي ويتغير تلقائياً في كل الأماكن اللي استخدمنا فيه الزر.
- إما نغير الحواف من component الرئيسي ويتغير تلقائياً في كل الأماكن اللي استخدمنا فيه الزر.
- او نغيره في نسخة اللي أخذناها من component (اللي استخدمناها في البطاقة) فبتغير فقط في النسخة مو الأماكن الاخرى اللي استخدمنا فيه الزر لاننا غيرنا النسخة مو الأصل.
وبكذا وصلنا لنهاية درس component. هذي الخاصية تعتبر من اهم الخصائص في برنامج فيجما وتساعدك في ترتيب شغلك وسرعة إجراء التعديلات. اتمنى انكم استفدتوا من هذا الدرس.
ولما لقاء غداً بإذن الله مع درس جديد💜.
ولما لقاء غداً بإذن الله مع درس جديد💜.
جاري تحميل الاقتراحات...