یک جریان و ریتم انعطاف پذیر با ساختار و روش های مهار برای محتوای خود ایجاد کنید.
1. ساختار پایه
برای شروع ایجاد یک ساختار محکم با نرده‌های محافظ ثابت، حاشیه‌ها و ستون‌ها را به چیدمان‌های خود اضافه کنید.
حاشیه ها فاصله هایی را در لبه های چپ و راست صفحه و محتوا ایجاد می کنند. یک مقدار حاشیه استاندارد برای اندازه فشرده 16 dp است، اما حاشیه ها باید با صفحه نمایش های بزرگتر سازگار شوند. محتوای بدنه برنامه و اقدامات شما باید با این حاشیه ها مطابقت داشته باشد.
همچنین می‌توانید در این مرحله از مناطق امن یا ورودی‌ها اطمینان حاصل کنید. ورودی های نوار سیستم از قرار گرفتن اقدامات مهم در زیر نوارهای سیستم جلوگیری می کند. برای جزئیات بیشتر به ترسیم محتوای خود در پشت نوارهای سیستم مراجعه کنید.
از ستون‌ها برای ایجاد یک ساختار شبکه‌ای انعطاف‌پذیر برای هم‌ترازی ثابت، و ارائه تعریف عمودی برای یک طرح با تقسیم محتوا در ناحیه بدنه استفاده کنید. محتوا در نواحی صفحه حاوی ستون ها قرار می گیرد. این ستون‌ها ساختاری را به چیدمان شما می‌بخشند و ساختاری مناسب برای چیدمان عناصر فراهم می‌کنند.
از یک شبکه ستونی برای تراز کردن محتوا با یک شبکه زیرین استفاده کنید اما اندازه انعطاف پذیر را حفظ کنید. شبکه ستون می‌تواند با تغییر اندازه ستون‌ها و تعداد ستون‌ها بر حسب نیاز اندازه صفحه در نقاطی خاص، فاکتورهای شکل متفاوتی را در خود جای دهد و در عین حال به محتوا اجازه می‌دهد تا مقیاس نیز داشته باشد. از گرانول بودن بیش از حد با شبکه ستون خودداری کنید، این همان چیزی است که شبکه پایه برای آن است: ارائه واحدهای فاصله گذاری ثابت.
مراقب ایجاد یک شبکه همراه از ردیف‌ها باشید، زیرا می‌تواند مقیاس افقی محتوای را در جهت‌ها و عوامل شکل محدود کند، معمولاً ایجاد قوانین padding سازگاری بصری مورد نیاز را فراهم می‌کند.
شروع به افزودن کپی به ساختار طرح. حاشیه ها از محتوا در مقابل لبه های صفحه محافظت می کنند. ستون ها یک ساختار فاصله و تراز ثابت را ارائه می دهند.
2. اعمال مهار
برای گروه بندی بصری عناصر از محدودیت استفاده کنید.
مهار به استفاده از فضای سفید و عناصر قابل مشاهده در کنار هم برای ایجاد یک گروه بندی بصری اشاره دارد. ظرف شکلی است که نمایانگر یک ناحیه بسته است. در یک چیدمان واحد، می‌توانید عناصری را که دارای محتوا یا عملکرد مشابه هستند، با هم گروه‌بندی کنید و با استفاده از فضای باز، تایپوگرافی و تقسیم‌کننده‌ها، آنها را از سایر عناصر جدا کنید.
می توانید موارد مشابه را با فاصله سفید یا تقسیم بندی قابل مشاهده گروه بندی کنید تا به راهنمایی کاربر در محتوا کمک کند.
محتوی ضمنی از فضای سفید برای گروه‌بندی بصری محتوا برای ایجاد مرزهای ظرف استفاده می‌کند، در حالی که محدودیت صریح از اشیایی مانند خطوط جداکننده و کارت‌ها برای گروه‌بندی محتوا استفاده می‌کند.
شکل زیر نمونه ای از استفاده از محفظه ضمنی برای حاوی هدر و کپی اولیه را نشان می دهد. شبکه ستون برای تراز و ایجاد گروه بندی استفاده می شود. نکات برجسته به صراحت در کارت ها موجود است. استفاده از نماد نگاری و سلسله مراتب تایپ برای جداسازی بصری بیشتر.
3. محتوای موقعیت
Android راه‌های متعددی برای مدیریت عناصر محتوا در محفظه‌های مربوطه دارد که می‌تواند به موقعیت مناسب آنها کمک کند، از جمله جاذبه، فاصله و مقیاس‌گذاری.
جاذبه استانداردی برای قرار دادن یک شی در یک ظرف بالقوه بزرگتر برای موارد استفاده خاص است. شکل زیر نمونه‌هایی از موقعیت‌یابی اجسام شروع و مرکز ( 1 )، افقی بالا و مرکز ( 2 )، پایین سمت چپ ( 3 )، و انتهای و راست ( 1 ) را نشان می‌دهد.
4. مقیاس محتوا
مقیاس بندی برای تطبیق محتوای پویا، جهت گیری دستگاه و اندازه صفحه بسیار مهم است. عناصر می توانند ثابت بمانند یا مقیاس شوند.
توجه به نحوه نمایش تصاویر در کانتینرها با مقیاس و موقعیت بسیار مهم است تا اطمینان حاصل شود که علیرغم بافت دستگاه چگونه می‌خواهید تصویر به نظر برسد، در غیر این صورت ممکن است فوکوس اصلی تصویر قطع شده باشد، تصاویر ممکن است برای طرح‌بندی خیلی کوچک یا بزرگ باشند، یا سایر جلوه‌های نامطلوب.
محتوایی که یادداشت نشده است می تواند متفاوت از آنچه شما انتظار دارید یا می خواهید ظاهر شود.
محتوای پین شده
بسیاری از عناصر در تعامل، پیمایش و موقعیت‌یابی با شکاف‌ها یا داربست‌ها ساخته شده‌اند. برخی از عناصر را می توان به گونه ای تغییر داد که به جای واکنش به پیمایش، ثابت بمانند، به عنوان مثال دکمه های عمل شناور (FAB) که اقدامات مهم را در خود جای می دهند.
تراز
از AlignmentLine برای ایجاد خطوط تراز سفارشی استفاده کنید، که طرح‌بندی‌های والدین می‌توانند از آن برای تراز و قرار دادن فرزندان خود استفاده کنند.
انجام دهید
نکن
چیدمان کامپوننت
مؤلفه های ماده 3 پیکربندی ها و حالت های خود را برای تعامل و محتوا ارائه می دهند.
Compose طرح‌بندی‌های مناسبی را برای ترکیب اجزای مواد در الگوهای رایج صفحه نمایش فراهم می‌کند. اجزای سازنده مانند داربست شکاف هایی را برای اجزای مختلف و سایر عناصر صفحه فراهم می کند. درباره اجزای متریال و چیدمان بیشتر بخوانید .