Skip to content

Latest commit

 

History

History
256 lines (155 loc) · 6.18 KB

README.md

File metadata and controls

256 lines (155 loc) · 6.18 KB
Raw

ListBottomSheet

Tag jitpack Licence Stars

Release 1.3.7

  • Multiple selection list

Release v1.2.4

  • Search field hint can be changed
  • You can set custom font for the list items

Release v1.2.3

  • Searchable list
  • Selected item indicator
  • Adding action button

Installation

Add Jitpack to your repositories in your project level build.gradle file

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

Add the below to your dependencies, in your build.gradle file

implementation 'com.github.ZakariaJawas:ListBottomSheet:1.3.7'

Preview

Basic

Searchable

Selected Item

Usage

Step 1 Create your model

ListBottomSheet adapter requires a list of objects (model) with a field annotated with @NameField for exmaple

data class Category(val id: Int, @NameField var name: String)

make sure to annotate your title field in your model class with @NameField otherwise UnspecifiedFieldNameExpection will be thrown

Step 2 Build the sheet

 val mList = listOf(Category(1, "Category 1"), Category(2, "Category 2"), Category(3, "Category 3"))
 val listSheet = ListBottomSheet.Builder<Category>(this)
            .list(mList)
            .title("Choose one")
            .onChooseItemCallback { sheet: ListBottomSheet<Category>, category: Category, position: Int ->
                sheet.dismiss() //hide the dialog
            }            
            .build()

Step 3 Show the list sheet

listSheet.show()

Available Properities

titleAlignment

used to change the alignment of the title

Values
Gravity.RIGHT
Gravity.LEFT
Gravity.CENTER

titleSize

used to change the size of the title

listSheet.titleSize = 18F

titleColor

used to change the color of the title

listSheet.titleColor = ContextCompat.getColor(this, R.color.colorPrimary)

selectedItemIndex

used to change the selected item in the list at any time in the code

listSheet.selectedItemIndex = 2

Customization

You can use the following functions with the builder to customize the list sheet

itemLayout(Int)

used to pass a custom item layout instead of the default layout provided by the library

.itemLayout(R.layout.custom_list_item)

make sure there is a TextView with id textView so the sheet can display the titles in the list

cancelable(Boolean) default value true

used to allow or prevent the sheet from being dismissed by clicking outside the sheet

cancelButtonVisible(Boolean) default value false

used to hide or show the close button in the sheet

selectedItemColor(Int)

param Int is color integer value not color resource id

used to change the default selected item color, default value (BLACK)

.selectedItemColor(ContextCompat.getColor(this, R.color.colorAccent))

selectedItemBackgroundColor(Int)

note: this property available only for MultiListBottomSheet

param Int is color integer value not color resource id

used to change the default selected item background color, default value (Light Grey)

.selectedItemBackgroundColor(ContextCompat.getColor(this, R.color.lightGrey))

selectedItemIndex(Int)

used to build the sheet with initial selected item in the list, default value -1 means no selected item

.selectedItemIndex(2)

searchable(Boolean) default value false

used to enable the search functionality in the bottom sheet

setActionButtonTitle(String)_

used to change the action button title, default value Ok

setOnActionCallback(ListBottomSheet)_

this is a callback for the action button click listener, it will return an instance of the current sheet so it can be dismissed

.setOnActionCallback {
                Toast.makeText(this, "On Action Button Clicked", Toast.LENGTH_SHORT).show()
                it.dismiss()
            }

For MultiListBottomSheet use this

setOnActionCallback(MultiListBottomSheet, List)_

this is a callback for the action button click listener, it will return an instance of the current sheet so it can be dismissed and a list of the selected items

.setOnActionCallback {	
	sheet, selectedItems ->
	Toast.makeText(this, "${selectedItems.size} items selected", Toast.LENGTH_SHORT).show()
	sheet.dismiss()
    }

setSearchHint(String)_

used to change the search field hint text, default value Search

.setCustomTypeface(Typeface)_

used to change the list items font, default value is the current system font

to change the font of the list items, first create a typeface

val typeface = Typeface.createFromAsset(applicationContext.assets, "font/roboto_bold.ttf")

then pass the typeface to the function setCustomTypeface

note: if you use Calligraphy library to change the whole app font, all views inside the bottom list sheet view will be changed as well except the list items which you will have to use this function to do so

Compatibility

Minimum Android SDK: API level 16

Author

Zakaria Jawas @zakariajawas

Getting help

If you spot a problem you can open an issue on the Github page, or alternatively, you can contact me via jawas.zakaria@gmail.com

Support the library by twitting in twitter

If you enjoy it, please make this library better 👍