نحوه ایجاد منابع جایگزین برای زمان تغییر صفحه نمایش از عمودی به افقی
این درس تخصصی اندروید به شما نشان می‌دهد که چگونه با استفاده از Android Studio و قابلیت Create Landscape Variation، یک نسخه لایوت در پوشه layout-land ایجاد کرده و با تنظیم دقیق ویژگی‌هایی مانند alignParentLeft، layout_marginRight و انتقال TextView به سمت راست تصویر، چیدمان اپلیکیشن خود را برای حالت‌های portrait و landscape به صورت حرفه‌ای بهینه کنید. این آموزش کاربردی به توسعه‌دهندگان کمک می‌کند تا با بهره‌گیری از روش‌های نوین و استفاده از alternative resources، تجربه کاربری بهتری در دستگاه‌های مختلف ارائه دهند و از چیدمان‌های پویا در طراحی اپلیکیشن‌های موبایلی بهره‌مند شوند.
در این ویدیو آموزشی، شما قدم به قدم یاد می‌گیرید چگونه با اعمال تغییرات دقیق و حرفه‌ای، چیدمان اپلیکیشن خود را برای هر دو حالت صفحه نمایش تنظیم کنید. این آموزش نه تنها به بهبود تجربه کاربری کمک می‌کند، بلکه نکات تخصصی در زمینه بهینه‌سازی لایوت‌ها، استفاده از تنظیمات margin و alignment برای طراحی مدرن موبایل را به شما ارائه می‌دهد. اگر به دنبال یادگیری روش‌های نوین و کاربردی در توسعه اپلیکیشن‌های اندروید هستید، این دوره آموزشی برای شما فرصتی استثنایی جهت تسلط بر طراحی چیدمان‌های دینامیک و جذاب می‌باشد.
چند روش برای ساخت یک برنامه که با سایزهای مختلف صفحه نمایش، تراکم های مختلف پیکسلی و جهت ها یا orientations ها سازگار باشه وجود داره. من میخام با تشریح یک تکنیک ساده برای ساخت یک فایل لایوت مجزا که در زمان تغییر جهت دستگاه بین عمودی و افقی استفاده و ارائه میشه کارم رو شروع کنم. در این نسخه از برنامه ام، من یک اکتیویتی About دارم که یک تصویر گرافیکی در بالای اون قرار داره و بعد هم دو تا text view. و text view دوم داخل یک بسته scroll view قرار داده شده، پس وقتی یک متن طولانی داریم میتونیم اون رو در جهت عمودی به بالا و پایین اسکرول اش کنیم.
ولی وقتی که دستگاه رو بچرخونم، در حالت افقی دیگه خیلی جالب به نظر نمیاد. عناصر و اشیا موجود تو صفحه دقیقا به همون ترتیب قبلی قرار داده شدن، ولی متن طولانی که داشتیم کل طول صفحه نمایش رو با گسترده تر شدنش پر کرده و خیلی کشیده شده، و تقریبا از اون حالت عمودی بودن در اومده. خب حالا میخوام یک لایوت مجزا ایجاد کنم که وقتی دستگاه در حالت افقی قرار میگیره تاثیر خودش رو بذاره. برای اینکار، یک کپی از فایل content_about.xml ام میگیرم و بعد هم در یک دایرکتوری جدید با نام layout-land قرارش میدم.
و نهایتا، میخام وقتی دستگاه در حالت افقی قرار گرفت، فریم وورک برنامه به صورت اتوماتیک اون فایل لایوت رو برای نمایش انتخاب کنه. من اینکار رو میتونم به صورت دستی با ساختن یک دایرکتوری و کپی کردن فایل توی اون انجام بدم، ولی اندروید استودیو اینکار رو برای من انجام میده. پس وقتی که در محیط اندروید استودیو هستیم نیازی نیست که بصورت دستی بخایم فایل هامون رو کپی کنیم. من فایل لایوتم رو باز میکنم، و به حالت Design Mode میرم و در این منو از تولبار مد دیزاین، Create Landscape Variation رو انتخاب میکنم. یک نسخه جدید از این فایل برامون باز میکنه، و در تب مربوط به این لایوت میبینید که نام همون لایوت هست با یک پیشوند land.و land از Landscape گرفته شده. در واقع اندروید استودیو این امکان رو در اختیار ما گذاشته که بیاییم رو خودمون حالت نمایشی لایوتمون رو در زمان افقی بودن صفحه نمایش دستگاه همونطوری که دلمون میخواد تنظیم کنیم.
ولی وقتی کرسر ام رو روی تب مربوط به این لایوت قرار میدم مکان واقعی قرارگیری این فایل رو نمایش میده، و در پنجره project، میبینیم که دو نسخه از این فایل لایوت وجود داره. که برای یکی اش تو پرانتز کلمه land رو گذاشته. حالا میخوام همین فایل رو در ویوی Project که مکان دقیق قرارگیری فایل ها رو روی دیسک با ساختار دایرکتوری نشون میده ببینم، و میبینیم که دقیقا در دایرکتوری با نام layout-land قرار داره. خب حالا میخوام یکم تغییرات روی این لایوت اعمال کنم. برای Image View، ویژگی های center horizontal یعنی مرکز از طرف افقی و margin bottom یعنی حاشیه از پایین رو حذف میکنم.
و چند تا تنظیمات مربوط به alignment و margin رو بجاشون اضافه میکنم. همونطور که قبلا هم توضیح دادم alignment مربوط به محل قرار گیری شی و margin مربوط به حاشیه خارجی شی میشه. اول ویژگی align ParentLeft رو مقداردهی میکنم و مقدارش رو true میذارم. برای لایوت هایی که چپ چین هستند یعنی اشیاشون از چپ به راست چیده میشه، ویژگی align ParentStart هم اضافه میکنم و مقدارش رو true میذارم. بعد یک margin از سمت راست تصویر هم با مقدار 10 pixel واسش تعریف میکنم و این باعث میشه مابین تصویری که سمت چپ و متنی که سمت راست هستش کمی فضای خالی ایجاد بشه و متن و تصویر بهم نچسبن درواقع این ماجین ها باعث میشن اشیا از هم فاصله بگیرن و به شکل زیباتری مجزا بشن.
من layout _marginRight رو 10dp قرار میدم، و بعد layout _marginEnd هم اضافه میکنم و مقدار این هم همون 10dp میذارم. بازم میگم که این ویژگی هم برای لایوت های چپ چین استفاده میشه. حالا میرم سراغ اولین text view. این همون تیتر ما هستش، و یکسری تغییرات میخام روی آن اعمال کنم. دیگه نمیخوام این text view زیر تصویرم باشه. بجاش میخوام سمت راستش قرار بگیره. پس ویژگی below رو به layout _toRightOf تغییر میدم و بعد این ویژگی رو تکرار میکنم و این یکی رو layout _toEndOf میذارم.
پس من اومدم Text View رو سمت راست تصویرم گذاشتم. ویژگی margin Bottom رو میذارم رو همون 10dp بمونه چون این همون حالت مجزایی که چند لحظه پیش گفتم اون حالت رو بین تیتر و متن قابل اسکرول ام بوجود میاره و و اون حالت میاد و یک فضای خالی کمی رو ایجاد میکنه. خب میرم سراغ Scroll View، و چند تا تغییر هم اینجا انجام میدم. همچنان میخوام که Scroll View زیر متن تیتر من باشه، پس این ویژگی رو کاریش ندارم، ولی میخوام یک ویژگی با نام layout _alignLeft رو اضافه کنم و مقدارش رو آیدی headline یا تیترم میذارم، باید متن موجود توی اسکرول ویو دقیقا از زیر تیترم شروع بشه و تیتر و متن اصلی در یک راستا باشن. بنابراین مطمئن بشید که هر دو کنترل Text View از لبه سمت چپ در یک راستا باشن.
و یکبار دیگه برای تنظیمات مربوط به چپ چین بودن لایوت layout _alighnStart رو اضافه میکنم و حالا با زدن روی مد دیزاین یه نگاهی به پیش نمایش تغییراتی که دادم میندازم و میبینیم که شکل بهتری نسبت به قبل پیدا کرد. خب حالا، از برنامه روی دستگاهم اجرا میگیرم. وقتی برنامه باز میشه، میرم روی آپشن منو و About رو انتخاب میکنم، و این چیدمان حالت عمودی هستش، و حالا، دستگاه رو به حالت افقی میچرخونم، و میبینیم که به صورت اتوماتیک اون لایوتی که چند لحظه پیش تنظیم کردیم نمایش داده میشه و میتونم متنم رو اسکرول کنم و بخونمش.
حالا دوباره دستگاه رو به حالت عمودی میبرم و لایوت قبلی رو میبینم. خب این یک مثال ساده برای کنترل دستی نمایش اشیا در زمان اجرا و وقتی که دستگاه تغییر جهت میده بود. شما میتونید برای هر دایرکتوری موجود توی منابع مثل layout یا values این کار رو انجام بدید و یک –land به اونا اضافه کنید تا اون فایل یا value در دایرکتوری هایی مرتبط با نسخه افقی تعریف بشن. همچنین میتونید اسناد و راهنماهای موجود برای مثال هایی از این مورد که توسط فریم وورک برنامه اندروید پشتیبانی میشن رو مطالعه کنید.