/ sheet

An Android library for display list and be able to select the item as BottomSheet

An Android library for display list and be able to select the item as BottomSheet

Sheet Selection

SheetSelection is an Android library for display list and be able to select the item as a BottomSheet.

Installation

Add it in your root build.gradle at the end of repositories:

repositories {
    ..
    maven { url 'https://jitpack.io' }
}

Add the dependency

dependencies {
    implementation 'com.github.minibugdev:sheetselection:0.0.1'
}

How to use

ss_1

val items = listOf(
    SheetSelectionItem("1", "Item #1", R.drawable.ic_extension),
    SheetSelectionItem("2", "Item #2", R.drawable.ic_nature),
    SheetSelectionItem("3", "Item #3", R.drawable.ic_fingerprint),
    SheetSelectionItem("4", "Item #4", R.drawable.ic_face)
)

SheetSelection.Builder(context)
    .title("Sheet Selection")
    .items(items)
    .selectedPosition(2)
    .showDraggedIndicator(true)
    .onItemClickListener { item, position -> 
        // DO SOMETHING
    }
    .show()

Configurations

  • Set title by Builder.title(String). It will hide when set to NULL or empty string.
  • Set items by Builder.items(List<SheetSelectionItem>).
  • Set selected item by Builder.selectedPosition(Int). default is SheetSelection.NO_SELECT
  • Show dragged indicator by Builder.showDraggedIndicator(Boolean). default is false
  • Set custom theme by Builder.theme(@StyleRes).
  • To handle the item click listener by Builder.onItemClickListener().

Customize your own style

ss_2

1.Define your theme and style

Add your theme and style to styles.xml or wherever you want.

1. Title text style parent must be Widget.SheetSelection.Title eg.

<style name="Widget.Custom.SheetSelection.Title" parent="@style/Widget.SheetSelection.Title">
    <item name="android:textAppearance">@style/TextAppearance.MaterialComponents.Headline5</item>
    <item name="android:gravity">center</item>
</style>

2. Item text style parent must be Widget.SheetSelection.Item eg.

<style name="Widget.Custom.SheetSelection.Item" parent="@style/Widget.SheetSelection.Item">
    <item name="android:textAppearance">@style/TextAppearance.MaterialComponents.Caption</item>
    <item name="drawableTint">@color/colorPrimary</item>
</style>

3. Indicator style parent must be Widget.SheetSelection.Indicator eg.

<style name="Widget.Custom.SheetSelection.Indicator" parent="@style/Widget.SheetSelection.Indicator">
    <item name="android:layout_marginTop">48dp</item>
</style>

Finally, override SheetSelection attributes by setting your styles to your Theme (parent must be Theme.SheetSelection)

<!-- Customize SheetSelection theme -->
<style name="Theme.Custom.SheetSelection" parent="@style/Theme.SheetSelection">
    <item name="sheetSelection_titleStyle">@style/Widget.Custom.SheetSelection.Title</item>
    <item name="sheetSelection_itemStyle">@style/Widget.Custom.SheetSelection.Item</item>
    <item name="sheetSelection_indicatorStyle">@style/Widget.Custom.SheetSelection.Indicator</item>
    <item name="sheetSelection_indicatorColor">@color/colorAccent</item>
</style>

2. Apply your Theme to SheetSelection

SheetSelection.Builder(this)
    .theme(R.style.Theme_Custom_SheetSelection)
    ..
    .show()

GitHub