در این برگ به آموزش طراحی رابط کاربری اندروید می‌پردازیم. به آموزش کار با ConstraintLayout می‌پردازیم و یک UI واکنش گرا طراحی می‌کنیم.
برخلاف دیگر برگ‌ها در هم‌رویش، این برگ تک درس نیست. این برگ شامل پنج درس با مجموع زمانی حدود 40 دقیقه است.
این برگ در واقع بخشی از این بسته آموزش اندروید با کاتلین (+) است. اما از آنجا که می‌نوانست مستقل نیز برای برنامه نویسان اندروید مفید باشد، در اینجا به صورت رایگان و مستقل نیز منتشر شد.
رابط کاربری واکنش گرا چیست ؟
هرگاه شما در ساخت اپ اندروید، عناصر تشکیل دهنده UI یا ظاهر اپ را به گونه‌ای طراحی کنید که در گوشی‌های با ابعاد مختلف بتوانند به خوبی خود را تطبیق دهد، می‌توانید بگویید که رابط کاربری واکنش گرا یا Responsive UI طراحی کرده‌اید.
البته این گام اول است. یک اپ ریسپانسیو اندروید باید نه تنها به اندازه بلکه به حالت افقی یا عمودی صفحه و حتی زبان گوشی هم واکنش مناسب نشان دهد.
این آموزش در یک نگاه
در جریان این آموزش ابتدا به ساخت اپ اندروید (پروژه اندروید استودیو) می‌پردازیم. سراغ بخش طراحی می‌رویم و با ConstraintLayout آشنا می‌شویم.
ویژگی‌های ConstraintLayout در طراحی UI واکنش گرا به ما کمک می‌کنند. نحوه مقید کردن عناصر صفحه و جانمایی آن‌ها از اطراف و بالا و پایین نخسنین ویژگی مهم است. برای مثال فرق layout_constraintLeft_toLeftOf با layout_constraintStart_toStartOf چیست؟ چطور باید در طراحی یک اپ دو زبانه بودن آن را در نظر گرفت؟
سپس به ویژگی‌های دیگری مانند Bias و Ratio و Chain می‌پردازیم. خواهید دید که با اتکا به این ویژگی‌ها می‌توان اندازه و مکان View ها را به صورت نسبی طراحی کرد. طراحی UI واکنش گرا یعنی همین! یعنی بتوان رفتار عناصر صفحه را نسبت به اندازه و حالت صفحه طراحی کرد.
در جریان آموزش، استفاده از فونت در اندروید و قرار دادن فونت شخصی به صورت اصولی نیز گفته شد. به تعریف استایل در اندروید نیز پرداختیم.
همچنین در این آموزش هر کدام از مفاهیم به صورت عمیق توضیح داده می‌شوند. برای مثال این که Chain چیست و چه نقشی در طراحی ریسپانسیو دارد. ضمنا محدودیت های کانسترینت لیوت را هم خواهیم شناخت.
تمرین و تمرین
در پایان این آموزش یک تمرین کوتاه اما مفید هم به شما واگذار می‌شود. اما بدیهی است که این آموزش و این تمرین تنها یک شروع سریع محسوب می‌شود. یک شروع اصولی! اما حتما می‌دانید که طراحی UI واکنش گرا ریزه کاری و سلیقه زیادی نیاز دارد. نحوه واکنش گرایی عناصر در ساخت اپ های مختلف می‌تواند متفاوت باشد. این چیزی است که شما باید کد بنویسید و بنویسید تا ماهر شوید. اگر پروژه ندارید برای خودتان تمرین تعریف کنید. یا می‌توانید کار رایگان بگیرید و انجام دهید.
برای جزئیات بیشتر در مورد مطالب گفته شده به بخش سرفصل‌ها در انتهای توضیحات مراجعه کنید.
این آموزش بی‌نظیر است زیرا:
- بیشترین نکته‌ها در کوتاه‌ترین زمان گفته شده است.
- مفاهیم در کنار کدنویسی توضیح داده شده است.
- طراحی UI واکنش گرا به ساخت یک اپ حرفه ای می‌انجامد.
پیشنیاز
آموزش سریع برنامه نویسی اندروید — از صفر تا انتشار اولین اپ
کلیدواژه‌ها
آموزش اندروید – طراحی رابط کاربری اندروید – آموزش اندروید با کاتلین – طراحی UI واکنش گرا – آموزش کار با ConstraintLayout – مفهوم chain – مفهوم ration – مفهوم bias – استفاده از فونت در اندروید – تعریف استایل در اندروید
نقد و بررسی‌ها
هنوز بررسی‌ای ثبت نشده است.