Expanding bottom sheets یا این که Bottom sheet های قابل بسط ، سطح خرد و فرو ریخته ای را مهیا می نماید که میتواند طراحی اپلیکیشن در شکل نیاز بوسیله استفاده کننده پیشرفت یابد تا فضای بیشتری به آن تخصیص یابد. این نوع شایسته ترین خصوصیت های دو نوع پیشین Bottom Sheet ها را ارائه می نماید؛ دسترسی مداوم نوع استاندارد و دور و اطراف و تمرکز نوع مقید.
طراحی
در اینجا یک مثال بی آلایش از یک قاب خودمانی را بوسیله Bottom Sheet طراحی میکنیم. دراین نرم افزار هنگامی استفاده کننده دکمه ای رایاپارس را کلیک می نماید Bottom Sheet نشان داده میشود. برای فهم خوب طراحی هر مرحله را مستقل تحقیق میکنیم.
مرحله اولیه
اضافه کردن نیازمندی به پوشه گریدل. به پوشه build.gradle در فایل app پروژه کد تحت را اضافه نمایید:
implementation \"com.android.support:design:27.0.2\"
مرحله دوم
آغاز فولدر layout که میخواهیم در Bottom Sheet اکران داده خواهد شد را میسازیم:
xmlns:app=\"http://schemas.android.com/apk/res-auto\"
android:layout_width=\"match_parent\"
android:layout_height=\"wrap_content\"
android:paddingBottom=\"8dp\">
android:id=\"@+id/txt_download\"
style=\"@style/BottomSheetItem\"
android:drawableStart=\"@drawable/ic_baseline_save_alt_24\"
android:drawableLeft=\"@drawable/ic_baseline_save_alt_24\"
android:text=\"Download\"
app:layout_constraintEnd_toEndOf=\"parent\"
app:layout_constraintStart_toStartOf=\"parent\"
app:layout_constraintTop_toTopOf=\"parent\" />
android:id=\"@+id/txt_copy\"
style=\"@style/BottomSheetItem\"
android:drawableStart=\"@drawable/copy_iocn\"
android:drawableLeft=\"@drawable/copy_iocn\"
android:text=\"Copy\"
app:layout_constraintEnd_toEndOf=\"parent\"
app:layout_constraintStart_toStartOf=\"parent\"
app:layout_constraintTop_toBottomOf=\"@+id/txt_download\" />
android:id=\"@+id/txt_share\"
style=\"@style/BottomSheetItem\"
android:layout_marginTop=\"8dp\"
android:drawableStart=\"@drawable/share_iocn\"
android:drawableLeft=\"@drawable/share_iocn\"
android:text=\"Share\"
app:layout_constraintEnd_toEndOf=\"parent\"
app:layout_constraintStart_toStartOf=\"parent\"
app:layout_constraintTop_toBottomOf=\"@+id/txt_copy\" />
android:id=\"@+id/txt_whats_app\"
style=\"@style/BottomSheetItem\"
android:drawableStart=\"@drawable/ic_whatsapp_new\"
android:drawableLeft=\"@drawable/ic_whatsapp_new\"
android:text=\"Whats App\"
app:layout_constraintEnd_toEndOf=\"parent\"
app:layout_constraintStart_toStartOf=\"parent\"
app:layout_constraintTop_toBottomOf=\"@+id/txt_share\" />
میتوانید استیل های پایین را نیز به فولدر styles.xml اضافه فرمائید:
اکنون که مرحله پیاده سازی ظواهر Bottom Sheet را بدون نقص کرده ایم، به مرحله کد نویسی می رسیم.