Android Support Library - BottomSheet

Android Support Library - BottomSheet

BottomSheet必须是作为CoordinatorLayout的子布局，并为BottomSheet设置app:layout_behavior属性

布局文件activity_main.xml
源码地址

  <?xml version="1.0" encoding="utf-8"?>
  <android.support.design.widget.CoordinatorLayout
    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">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/fragment"
            android:text="Bottom Sheet Fragment"/>
    </LinearLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:id="@+id/bottom_sheet"
        android:background="@color/colorAccent"
        android:paddingLeft="@dimen/activity_vertical_margin"
        android:paddingRight="@dimen/activity_vertical_margin"
        android:paddingTop="@dimen/activity_horizontal_margin"
        android:paddingBottom="@dimen/activity_horizontal_margin"
        app:behavior_hideable="false"
        app:behavior_peekHeight="50dp"
        app:elevation="4dp"
        app:layout_behavior="@string/bottom_sheet_behavior">

        <android.support.v7.widget.RecyclerView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/list_view"
            android:layout_margin="@dimen/activity_vertical_margin"></android.support.v7.widget.RecyclerView>

    </RelativeLayout>

    <android.support.design.widget.FloatingActionButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/fab"
        android:layout_margin="@dimen/activity_vertical_margin"
        android:src="@drawable/ic_emoticon"
        app:layout_anchor="@id/bottom_sheet"
        app:layout_anchorGravity="top|end"/>

  </android.support.design.widget.CoordinatorLayout>

在BottomSheet中加入了一个RecyclerView，实现listview的布局效果

java代码逻辑

  mBottomFragment = (Button)findViewById(R.id.fragment);
  fab = (FloatingActionButton)findViewById(R.id.fab);
  View bottomSheet = findViewById(R.id.bottom_sheet);
  BottomSheetBehavior behavior = BottomSheetBehavior.from(bottomSheet);

  //设置回调方法
  behavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
  @Override
  public void onStateChanged(@NonNull View bottomSheet, int newState) {

  }

  @Override
  public void onSlide(@NonNull View bottomSheet, float slideOffset) {
      //可以设置FAB的动画
      //fab.animate().scaleX(1 - slideOffset).scaleY(1 - slideOffset).setDuration(0).start();

  }
  });

RecyclerView的item的布局

  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal" android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical">

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@mipmap/ic_launcher"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/item_text"
        android:gravity="center_vertical"
        style="@style/TextAppearance.AppCompat.Body1"/>
  </LinearLayout>

设置RecyclerView

  ArrayList<String> data = new ArrayList<>();
  for(int i = 0;i<5;i++){
      data.add("Item "+i);
  }

  RecyclerView recyclerView = (RecyclerView)findViewById(R.id.list_view);
  recyclerView.setHasFixedSize(true);
  recyclerView.setLayoutManager(new LinearLayoutManager(this));
  ItemAdapter adapter = new ItemAdapter(data);
  recyclerView.setAdapter(adapter);

BottomSheetDialogFragment

  public class MyBottomSheetDialogFragment extends BottomSheetDialogFragment {

    private ArrayList<String> mItems;

    static MyBottomSheetDialogFragment newInstance(ArrayList<String> items){
        MyBottomSheetDialogFragment d = new MyBottomSheetDialogFragment();
        Bundle arg = new Bundle();
        arg.putStringArrayList("item",items);
        d.setArguments(arg);
        return d;
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View v = inflater.inflate(R.layout.bottom_dialog,null,false);
        RecyclerView recyclerView = (RecyclerView) v.findViewById(R.id.recycler_view);
        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));

        ItemAdapter adapter = new ItemAdapter(mItems);
        recyclerView.setAdapter(adapter);
        return v;
    }

    @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mItems = getArguments().getStringArrayList("item");
    }
  }

在ManiActivity中的逻辑

  final MyBottomSheetDialogFragment fragment = MyBottomSheetDialogFragment.newInstance(data);

  mBottomFragment.setOnClickListener(new View.OnClickListener(){
      @Override
      public void onClick(View v) {
          fragment.show(getSupportFragmentManager(),fragment.getTag());
      }
  });