Android как реализовать нижний лист из документов Material Design
Как вы реализуете спецификацию нижнего листа? http://www.google.com/design/spec/components/bottom-sheets.html
новое обновление для Google Диска показывает это с плавающей Кнопкой действия нажмите ->
предоставленные спецификации никогда не говорят ничего о закругленных углах, независимо от того, что можно сделать, просто не уверены, как это сделать. В настоящее время с помощью библиотеки AppCompat и целевой набор для 21.
спасибо
7 ответов:
Edit
The
BottomSheet
является частьюandroid-support-library
. Смотрите ответ Джона Шелли.
к сожалению, в настоящее время нет" официального " способа сделать это (по крайней мере, я не знаю).
К счастью, есть библиотека под названием "BottomSheet" (клик), который имитирует внешний видBottomSheet
и поддерживает Android 2.1 и выше.в случае приложения Drive, вот как код будет выглядеть, как с этим библиотека:
new BottomSheet.Builder(this, R.style.BottomSheet_Dialog) .title("New") .grid() // <-- important part .sheet(R.menu.menu_bottom_sheet) .listener(new DialogInterface.OnClickListener() { @Override public void onClick(DialogInterface dialog, int which) { // TODO } }).show();
menu_bottom_sheet (в основном стандартный/res / menu/*.xml-ресурс)
<menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@+id/folder" android:title="Folder" android:icon="@drawable/ic_action_folder" /> <item android:id="@+id/upload" android:title="Upload" android:icon="@drawable/ic_action_file_upload" /> <item android:id="@+id/scan" android:title="Scan" android:icon="@drawable/ic_action_camera_alt" /> </menu>
вывод выглядит так:
что, я думаю, довольно близко к оригиналу. Если вы не довольны цветами, вы можете настроить его -посмотреть этот (клик).
отвечая на мой собственный вопрос, чтобы разработчики знали, что новая библиотека поддержки предоставляет это, наконец! Да здравствует всемогущий Google!
пример блог разработчика Android:
// The View with the BottomSheetBehavior View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet); BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet); behavior.setBottomSheetCallback(new BottomSheetCallback() { @Override public void onStateChanged(@NonNull View bottomSheet, int newState) { // React to state change } @Override public void onSlide(@NonNull View bottomSheet, float slideOffset) { // React to dragging events } });
@реверсе -ответ выше по-прежнему является допустимым вариантом, но его приятно знать, что есть стандарт, который поддерживает Google тоже.
теперь вы можете использовать Official
BottomSheetBehavior
API из библиотеки поддержки android 23.2.Ниже приведен пример фрагмента кода
bottomSheetBehavior = BottomSheetBehavior.from(findViewById(R.id.bottomSheet)); case R.id.expandBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED); break; case R.id.collapseBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED); break; case R.id.hideBottomSheetButton: bottomSheetBehavior.setState(BottomSheetBehavior.STATE_HIDDEN); break; case R.id.showBottomSheetDialogButton: new MyBottomSheetDialogFragment().show(getSupportFragmentManager(), "sample");
пожалуйста, обратитесь к Android BottomSheet youtube tutorial чтобы получить понимание о нем.
после сообщения в блоге: http://android-developers.blogspot.com/2016/02/android-support-library-232.html
мой xml в конечном итоге выглядит так:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:id="@+id/coordinator_layout" xmlns:app="http://schemas.android.com/apk/res-auto"> <LinearLayout android:id="@+id/bottom_sheet" android:layout_width="match_parent" android:layout_height="100dp" android:orientation="horizontal" app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> <ImageView android:src="@android:drawable/ic_input_add" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </android.support.design.widget.CoordinatorLayout>
и в моем onCreateView моего фрагмента:
coordinatorLayout = (CoordinatorLayout)v.findViewById(R.id.coordinator_layout); View bottomSheet = coordinatorLayout.findViewById(R.id.bottom_sheet); BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet); behavior.setPeekHeight(100); behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() { @Override public void onStateChanged(@NonNull View bottomSheet, int newState) { // React to state change } @Override public void onSlide(@NonNull View bottomSheet, float slideOffset) { // React to dragging events } });
значение по умолчанию setPeekHeight равно 0, поэтому, если вы не установите его, вы не сможете увидеть свое представление.
Я бы пошел с прямыми углами, как это в руководящих принципах. Что касается реализации-возможно, лучше всего использовать идею из этого проекта:https://github.com/umano/AndroidSlidingUpPanel
Я думаю, что вы можете использовать его как есть или взять идею для реализации. Еще одну замечательную статью о том, как реализовать подобную раздвижную панель можно найти здесь: http://blog.neteril.org/blog/2013/10/10/framelayout-your-best-ui-friend/
вот некоторые из других вариантов:
- есть один доступный от Flipboard, однако встраивание деятельности необходимо изменить для работы нижнего листа.
- Тутти-ч-х bottomsheet: Это было извлечено из ResolverActivity Android РЕПО и запуск активности не должны быть изменены.
недавно Google выпустила Библиотека Поддержки Android 23.2, который официально приносит нижние листы в библиотеку поддержки дизайна Android.