【Android】BottomSheetBehaviorの実装方法メモ
記事見てみると、サポートライブラリが旧情報しか無かったので困惑した為、メモを残そうと思う。
AndroidXで実装する!
こんな感じで実装出来た!
ボタンを押したら、BottomSheetBehaviorの機能を使って、リストを下から表示させるというもの。
注意点として、レイアウトは「coordinatorlayout」を使わないと実装出来なかった事かな。
使わないでも実装出来るのかは謎い。詳しい人教えて欲しいっす。
レイアウトが他にもいくつかあって、いまいち使い分け方が理解出来ていないので、自分の中での課題ですね。
開発環境
Android Studio = 3.5.3
compileSdkVersion = 29
targetSdkVersion = 29
minSdkVersion = 21
サポート ライブラリ = Androidx
Lang = Java
ソース
package com.hiropon.test; import androidx.appcompat.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.ArrayAdapter; import android.widget.Button; import android.widget.ListView; import com.google.android.material.bottomsheet.BottomSheetBehavior; public class MainActivity extends AppCompatActivity { private BottomSheetBehavior behavior; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); // BottomSheetの処理 View bottomSheet = findViewById(R.id.bottom_sheet); behavior = BottomSheetBehavior.from(bottomSheet); behavior.setState(BottomSheetBehavior.STATE_HIDDEN); ArrayAdapter<String> menu_adapter = new ArrayAdapter<>(this, android.R.layout.simple_list_item_1); menu_adapter.add("test1"); menu_adapter.add("test2"); menu_adapter.add("test3"); menu_adapter.add("test4"); menu_adapter.add("test5"); ListView menuList = findViewById(R.id.list_menu); menuList.setAdapter(menu_adapter); Button btnPlayer1 = findViewById(R.id.Button1); btnPlayer1.setOnClickListener(new View.OnClickListener() { public void onClick(View v) { if (behavior.getState() == BottomSheetBehavior.STATE_EXPANDED) { behavior.setState(BottomSheetBehavior.STATE_HIDDEN); } else { behavior.setState(BottomSheetBehavior.STATE_EXPANDED); } } }); } }
<?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <Button android:id="@+id/Button1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="B1" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" /> <androidx.coordinatorlayout.widget.CoordinatorLayout android:id="@+id/coordinatorLayout" android:layout_width="match_parent" android:layout_height="match_parent" android:translationZ="2dp" tools:layout_editor_absoluteX="-179dp" tools:layout_editor_absoluteY="-16dp"> <LinearLayout android:id="@+id/bottom_sheet" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@android:color/white" android:orientation="vertical" app:behavior_hideable="true" app:behavior_peekHeight="200dp" app:layout_behavior="@string/bottom_sheet_behavior"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginStart="15dp" android:layout_marginTop="15dp" android:text="Menu" android:textSize="18sp" /> <ListView android:id="@+id/list_menu" android:layout_width="match_parent" android:layout_height="wrap_content" android:divider="@color/colorWhite" /> </LinearLayout> </androidx.coordinatorlayout.widget.CoordinatorLayout> </androidx.constraintlayout.widget.ConstraintLayout>
参考リンク
Bottom Sheets の実装方法 - ユーザーインターフェイス - Android 開発入門
[Android] ListView + Bottom Sheet でマテリアルな一覧画面を作ってみた - Qiita
BottomSheetBehaviorを使う - Qiita
縦または横一列に要素を並べるリニアレイアウト (LinearLayout) - ユーザーインターフェイス - Android 開発入門