🌙اليوم الثامن من دروس فيجما في رمضان
🌟ماهي القيود (constraints) في فيجما وكيف ممكن تفيدنا في التصميم مع تطبيق عملي
🌟ماهي القيود (constraints) في فيجما وكيف ممكن تفيدنا في التصميم مع تطبيق عملي
بالبداية القيود فائدتها ان تفرض قيود من المستوى الأفقي والرأسي تتحكم في مكان الأشياء في منطقة عند تغيير حجم المنطقة ولها عدة انواع الإختلاف بينهم هو مكان الأشياء عند تغيير حجم المنطقة
أنواعها من المستوى الأفقي:
- Left
- Right
- Left and Right
- Center
- Scale
أنواعها من المستوى الأفقي:
- Left
- Right
- Left and Right
- Center
- Scale
أنواعها من المستوى الرأسي:
- Too
- Bottom
- Top and Bottom
- Center
- Scale
- Too
- Bottom
- Top and Bottom
- Center
- Scale
اي قيمة من انواع القيود من المستوى الرأسي تقدر تستخدمها مع اي قيمة من انواع القيود من المستوى الأفقي ومن خلال القيمتين تتحكم في مكان الأشياء في منطقة عند تغيير حجمها.
أمثلة 👇🏻
أمثلة 👇🏻
🔹الإفتراضي (top left): من خلال الفيديو نلاحظ لما يتغير حجم المنطقة واللي تحتوى الشكل اللي بالنص كأن الشكل مثبت من جهة اليسار وفوق.
🔹 (top right): من خلال الفيديو نلاحظ لما يتغير حجم المنطقة الشكل مثبت من جهة اليمين وفوق.
🔹 (top right-left): الشكل مثبت من اليمين واليسار وفوق فلما يتغير حجم المنطقة كما ملاحظ في الفيديو الشكل صار يتمدد من اليمين واليسار و مثبت من فوق.
🔹 (scale scale): فائدة scale ان الأشكال تتمدد من المستوى الأفقي والرأسي مثل الموضح في الفيديو.
ونفس الشئ لباقي القيم. تقدر تستخدم قيمة من المستوى الأفقي ومن المستوى الرأسي عشان تتحكم في مكانها عند تغيير حجم المنطقة.
كيف ممكن نستفيد منها في التصميم. مثال هذي البطاقة اللي كانت في الدرس الثاني من دروس تعلم فيجما.
رابط الدرس:
احتاج أضيف لها علامة خصم واحتاج تكون ثابتة من جهة اليمين وفوق في البطاقة.
رابط الدرس:
احتاج أضيف لها علامة خصم واحتاج تكون ثابتة من جهة اليمين وفوق في البطاقة.
بالبداية لاننا استخدمنا Auto Layout على كامل البطاقة اي شئ أضيفه على البطاقة بيغير حجم البطاقة عشان يحتوي المحتوى الجديد اللي هو هنا علامة الخصم مثال الموضح في الفيديو. لكن نقدر نحدد مكان العلامة بالضبط بحيث مايتغير شكل البطاقة من خلال خاصية absolute positioning.
اللحين لما نغير حجم البطاقة نلاحظ ان علامة السعر مثبتة من جهة اليسار وفوق لانها القيمة الإفتراضية وانا احتاجها تكون من جهة اليمين وفوق. هنا احتاج اغير قيمة القيود من المستوى الأفقي من يسار إلى يمين عشان تثبت العلامة في يمين البطاقة.
وبس اتمنى انكم استفدتوا من هذا الدرس ولنا لقاء غداً ان شاء الله مع درس جديد 💙
جاري تحميل الاقتراحات...