Android Support Library - Bottom

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());
    }
});