هدرهای ثانویه در طراحی متریال

تاریخ انتشار: 22 اسفند 1394

تعداد بازدید: 0 نفر

هدرهای ثانویه (subheader) قطعه هایی از لیست هستند که بخش های خاصی از یک لیست معمولی یا لیست شبکه ای را مشخص میکنند. این قطعه ها یا به صورت داخلی با قطعات دیگر نمایش داده میشوند یا میتوانند به همراه محتوا نمایش داده شوند برای مثال، در یک ستون مجاور.
در زمان اسکرول، هدرهای ثانویه به صورت ثابت در بالای صفحه باقی میمانند تا زمانی که توسط هدر بعدی به خارج از صفحه منتقل شوند.

هدرهای ثانویه در لیست :

ارتفاع قطعه : 489dp
فونت هدر ثانویه : Roboto Medium 14sp
رنگ هدر میتواند 54% مشکی یا رنگ اصلی برنامه باشد.
در لیست های طولانی با اطلاعات پیچیده، از هدرهای ثانویه رنگی استفاده کنید که از محتوا متمایز شود. برای مثال در تنظیمات اندروید هدرهای ثانویه رنگی هستند.
هدر ثانویه باید چپ نویس بوده و به همراه یک شکل یا آیکون باشد.(البته در زبان انگلیسی)

padding : 16dp
ارتفاع قطعه هدر ثانویه : 48dp

هدر ثانویه طوسی در جعبه دریافت ایمیل

چنانچه دکمه عملیاتی شناور به همراه شکل یا آیکون در سمت چپ وجود داشته باشد، هدر ثانویه را با متن تنظیم کنید.

به دلیل وجود دکمه عملیاتی شناور در سمت چپ، هدر با متن تنظیم شده است.
ارتفاع قطعه هدر ثانویه : 48dp
پهنای قطعه دکمه عملیاتی شناور : 72dp

رنگ هدر ثانویه، رنگ اصلی برنامه میباشد.
به دلیل وجود دکمه عملیاتی شناور در سمت چپ، هدر با متن تنظیم شده است.

هدرهای ثانویه در شبکه :

ارتفاع قطعه : 48dp
فونت هدر ثانویه : Roboto Medium 14sp
هدر ثانویه از لبه سمت چپ صفحه به میزان 16dp فاصله دارد.

هدر ثانویه برای جداسازی ماه های سال در یک آلبوم تصاویر

هدر ثانویه در منو :

ارتفاع قطعه : 48dp
فونت هدر ثانویه : Roboto Medium 14sp
هدر ثانویه از لبه سمت چپ صفحه به میزان 16dp فاصله دارد.

مثال هدر ثانویه در منو

مطلب بعدی -> پلکان (stepper)

اشتراک گذاری:

مشاهده نمونه های بیشتر

2 خرداد 1402

راهنمای جامع طراحی سایت فروشگاهی

این راهنما شما را با دانش و استراتژی های مورد نیاز طراحی سایت فروشگاهی استثنایی مجهز می کند. برای کشف قدرت طراحی در فروش آنلاین و ایجاد یک برند دیجیتال موفق آماده شوید.

31 اردیبهشت 1402

تایپوگرافی چیست و چگونه از آن در طراحی سایت استفاده کنیم؟

با استفاده از قدرت تایپوگرافی، طراحان می توانند تجربیات دیجیتالی فریبنده و فراموش نشدنی ایجاد کنند که مجذوب، اطلاع رسانی و تأثیر ماندگاری بر روی کاربران می شود. در این مقاله قصد داریم به صورت کامل مفهموم تایپوگرافی در طراحی سایت را برای شما شرح دهیم.

25 اردیبهشت 1402

طرح رنگ چیست و چگونه از آن در طراحی سایت استفاده کنیم؟

در این مقاله، ما به پیچیدگی‌های طرح‌های رنگی در طراحی وب‌ سایت، بررسی اصول تئوری رنگ‌ها، تأثیرات روان‌شناختی رنگ‌ها و ملاحظات عملی برای انتخاب پالت رنگ مناسب می‌پردازیم.