Logicchip

Bottom Sheet implementation for Android – Logicchip

Bottom sheet is a component that slides up from bottom of the screen to reveal more content. You can find more detailed information of Bottom Sheet on Google Material Design guidelines.

Download

MainActivity

public class MainActivity extends AppCompatActivity {

    private AdapterColor adapterColor;
    private ArrayList<TypeColor> typeColors;
    private int posOfColor=0,posOfCountry=0;
    private String colorSelected="";
    private RecyclerView recycleViewDialog,recycleViewPersistent;
    private AdapterCountry adapterCountry;
    private ArrayList<TypeCountry> typeCountries;
    private ConstraintLayout constraintLayoutPersistent;
    private BottomSheetBehavior bottomSheetBehaviorPersistant;
    private ImageButton imgBtnUp;
    private AdapterPersistent adapterPersistent;
    private ArrayList<TypePersistent> typePersistents;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        constraintLayoutPersistent=(ConstraintLayout)findViewById(R.id.constraintLayoutPersistent);
        imgBtnUp=(ImageButton)findViewById(R.id.imgBtnUp);
        bottomSheetBehaviorPersistant=BottomSheetBehavior.from(constraintLayoutPersistent);
        recycleViewPersistent=(RecyclerView)findViewById(R.id.recycleViewPersistent);

        recycleViewPersistent.setHasFixedSize(true);
        recycleViewPersistent.setLayoutManager(new LinearLayoutManager(this));

        ForPersistent();

        bottomSheetBehaviorPersistant.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
            @Override
            public void onStateChanged(@NonNull View bottomSheet, int newState) {

                if (newState==BottomSheetBehavior.STATE_EXPANDED){
                   if (imgBtnUp.getRotation()==0F){
                        //  btnBottomSheet.setText("Close Sheet");
                        float deg = imgBtnUp.getRotation() + 180F;
                        imgBtnUp.animate().rotation(deg).setInterpolator(new AccelerateDecelerateInterpolator());

                    }
                }
                switch (newState) {
                    case BottomSheetBehavior.STATE_HIDDEN:
                        break;
                    case BottomSheetBehavior.STATE_EXPANDED: {
                      //  btnBottomSheet.setText("Close Sheet");
                            //float deg = imgBtnUp.getRotation() + 180F;
                            //imgBtnUp.animate().rotation(deg).setInterpolator(new AccelerateDecelerateInterpolator());


                    }
                    break;
                    case BottomSheetBehavior.STATE_COLLAPSED: {
                      //  btnBottomSheet.setText("Expand Sheet");
if (imgBtnUp.getRotation()==180F){
    float deg = 0F;
     imgBtnUp.animate().rotation(deg).setInterpolator(new AccelerateDecelerateInterpolator());

}

                    }
                    break;
                    case BottomSheetBehavior.STATE_DRAGGING:
                        break;
                    case BottomSheetBehavior.STATE_SETTLING:
                        break;
                }
            }

            @Override
            public void onSlide(@NonNull View bottomSheet, float slideOffset) {
            //    Toast.makeText(MainActivity.this,"Slide",Toast.LENGTH_SHORT).show();
            }
        });

    }

    public void ForPersistent(){

        typePersistents=new ArrayList<TypePersistent>();
        typePersistents.add(new TypePersistent("Hospital",R.drawable.ic_local_hospital));
        typePersistents.add(new TypePersistent("Fuel Station",R.drawable.ic_ev_station));
        typePersistents.add(new TypePersistent("ATM",R.drawable.ic_local_atm));
        typePersistents.add(new TypePersistent("Restaurant",R.drawable.ic_restaurant));
        typePersistents.add(new TypePersistent("Movies",R.drawable.ic_local_movies));
        adapterPersistent=new AdapterPersistent(MainActivity.this,typePersistents);
        recycleViewPersistent.setAdapter(adapterPersistent);
    }

    public void toggleBottomSheet(View view) {
        if (bottomSheetBehaviorPersistant.getState() != BottomSheetBehavior.STATE_EXPANDED) {
            float deg = imgBtnUp.getRotation() + 180F;
            imgBtnUp.animate().rotation(deg).setInterpolator(new AccelerateDecelerateInterpolator());

            bottomSheetBehaviorPersistant.setState(BottomSheetBehavior.STATE_EXPANDED);
            //btnBottomSheet.setText("Close sheet");
        } else {
            bottomSheetBehaviorPersistant.setState(BottomSheetBehavior.STATE_COLLAPSED);
            //btnBottomSheet.setText("Expand sheet");

            float deg = 0F;
            imgBtnUp.animate().rotation(deg).setInterpolator(new AccelerateDecelerateInterpolator());

        }
    }

    public void BottomSheetDialog(View view){
        typeCountries=new ArrayList<TypeCountry>();
        typeCountries.add(new TypeCountry("India",false));
        typeCountries.add(new TypeCountry("United States",false));
        typeCountries.add(new TypeCountry("China",false));
        typeCountries.add(new TypeCountry("Spain",false));
        typeCountries.add(new TypeCountry("Germany",false));
        typeCountries.add(new TypeCountry("Argentina",false));
        typeCountries.add(new TypeCountry("Brazil",false));
        typeCountries.add(new TypeCountry("Canada",false));
        typeCountries.add(new TypeCountry("Dubai",false));
        typeCountries.add(new TypeCountry("Mexico",false));

        adapterCountry=new AdapterCountry(this,typeCountries);


        View vu= getLayoutInflater().inflate(R.layout.bottom_sheet_dialog, null);
        recycleViewDialog=(RecyclerView)vu.findViewById(R.id.recycleViewDialog);
        recycleViewDialog.setHasFixedSize(true);
        recycleViewDialog.setLayoutManager(new LinearLayoutManager(this));
        recycleViewDialog.setAdapter(adapterCountry);
        BottomSheetDialog dialog = new BottomSheetDialog(this);
        dialog.setContentView(vu);
        dialog.show();
        SelectCountry(posOfCountry);
    }

    public void SelectCountry(int pos){
        posOfCountry=pos;

        for (int i=0;i<typeCountries.size();i++){
            if (typeCountries.get(i).isSelected()){
                typeCountries.get(i).setSelected(false);
                adapterCountry.notifyItemChanged(i);
            }
        }

        //adapterItemThumb.notifyDataSetChanged();
        typeCountries.get(pos).setSelected(true);
        adapterCountry.notifyItemChanged(pos);

    }

    public void BottomSheetFragment(View view){
        typeColors=new ArrayList<TypeColor>();
        typeColors.add(new TypeColor("Red","#d32f2f",true));
        typeColors.add(new TypeColor("Pink","#c2185b",false));
        typeColors.add(new TypeColor("Purple","#7b1fa2",false));
        typeColors.add(new TypeColor("Deep Purple","#512da8",false));
        typeColors.add(new TypeColor("Indigo","#303f9f",false));
        typeColors.add(new TypeColor("Blue","#1976d2",false));
        typeColors.add(new TypeColor("Light blue","#0288d1",false));
        typeColors.add(new TypeColor("Cyan","#0097a7",false));
        typeColors.add(new TypeColor("Teal","#00796b",false));
        typeColors.add(new TypeColor("Green","#388e3c",false));
        typeColors.add(new TypeColor("Light green","#689f38",false));
        typeColors.add(new TypeColor("Lime","#afb42b",false));
        typeColors.add(new TypeColor("Yellow","#fbc02d",false));
        typeColors.add(new TypeColor("Amber","#ffa000",false));
        typeColors.add(new TypeColor("Orange","#f57c00",false));
        typeColors.add(new TypeColor("Deep orange","#e64a19",false));
        typeColors.add(new TypeColor("Brown","#5d4037",false));
        typeColors.add(new TypeColor("Gray","#616161",false));
        typeColors.add(new TypeColor("Blue Gray","#455a64",false));

        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();

        BottomSheetColor.newInstance(typeColors).show(transaction, "colorFragment");
       // SelectPosition();
    }

    public void SelectPosition(){
        BottomSheetColor  bottomSheetColor=(BottomSheetColor)getSupportFragmentManager().findFragmentByTag("colorFragment");
        bottomSheetColor.addSelection(posOfColor);
    }

    public void ColorSelect(TypeColor typeColor,int pos){
        BottomSheetColor  bottomSheetColor=(BottomSheetColor)getSupportFragmentManager().findFragmentByTag("colorFragment");
         bottomSheetColor.addSelection(pos);
         posOfColor=pos;
        //bottomSheetColor.dismiss();
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }


}

ActivityMain 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">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <include layout="@layout/content_main" />

    <!-- Adding bottom sheet after main content -->
    <include layout="@layout/bottom_sheet_persistent" />
</android.support.design.widget.CoordinatorLayout>

ContentMain xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".MainActivity"
    tools:showIn="@layout/activity_main">
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">


            <Button
                android:textAllCaps="false"
                android:onClick="toggleBottomSheet"
                android:layout_gravity="center"
                style="@style/Base.Widget.AppCompat.Button.Colored"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Persistent bottom sheet"/>
            <Button
                android:textAllCaps="false"
                android:onClick="BottomSheetDialog"
                android:layout_gravity="center"
                style="@style/Base.Widget.AppCompat.Button.Colored"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Dialog bottom sheet"/>
            <Button
                android:textAllCaps="false"
                android:onClick="BottomSheetFragment"
                android:layout_gravity="center"
                style="@style/Base.Widget.AppCompat.Button.Colored"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Fragment bottom sheet"/>
        </LinearLayout>
    </RelativeLayout>


</android.support.constraint.ConstraintLayout>
Exit mobile version