Skip to content

Welcome to SSComposeExpandableListView! A customizable expandable ListView for Jetpack Compose with support for custom headers, list items 📄, icons 🖼️, animations 🎬, and Material Theming 🎨.

License

Notifications You must be signed in to change notification settings

SimformSolutionsPvtLtd/SSComposeExpandableListView

Repository files navigation

SSComposeExpandableListView

Platform-badge Jetpack Compose-badge API-badge kotlin

Welcome to our SSCompose-Expandable-ListView Library! 🎉 Expandable ListView in Jetpack Compose, providing an easy and flexible way to display hierarchical data in an interactive, expandable list format.

⚡ Features

  • Multiple Item Selection: Supports selecting multiple items at once, allowing users to interact with the list more efficiently.
  • 🔧 Custom Icons: Easily customizable icons for the header, expand/collapse actions, and selected items, providing a more personalized and visually engaging experience.
  • 🎨 Customization Options: Full flexibility to customize the header and list items, including options for text color, background color, and font style, allowing seamless integration with your app's design.
  • 📄 HTML Text Support: The list supports rendering HTML-formatted text, making it easier to display rich content like links, bold, italics, and more within list items.

🖼️ Preview

📚 How it works:

  1. Add the dependency in your app's build.gradle file

    dependencies {
        implementation("com.github.SimformSolutionsPvtLtd:SSComposeExpandableListView:<LATEST_TAG>")
    }
  2. Add the JitPack repository For latest Android Studio, in settings.gradle file inside dependencyResolutionManagement block

    dependencyResolutionManagement {
        repositories {
            ...
            maven { url = uri("https://jitpack.io") }
        }
    }
  3. Create ExpandableListView with default values or with custom values.

    ComposeExpandableListView(
       modifier = Modifier
                      .fillMaxWidth(),
       expandableListData = uiState.simpleExpandableListData,
       onStateChanged = mainViewModel::updateExpandStatus,
       onListItemClicked = mainViewModel::listItemSelected,
       onListItemLongClick = this@MainActivity::listItemLongClicked
    )
  4. If you want to use this component in LazyColumn then you can use a variant scoped to LazyListScope as below.

    LazyColumn {
       composeExpandableListView(
          expandableListData = uiState.simpleExpandableListData,
          onStateChanged = mainViewModel::updateExpandStatus,
          onListItemClicked = mainViewModel::listItemSelected,
          onListItemLongClicked = this@MainActivity::listItemLongClicked
       )
    }

Note: If you have a scrollable Column as a parent then you need to convert your scrollable parent to LazyColumn and use LazyListScope.composeExpandableListView() variant which is scoped to LazyListScope.

🎨 Customization

You can customize the Expandable listview by providing below parameters.

Parameter Name Parameter Type Description Default Value
expandableListData ExpandableListData List of [ExpandableListData] representing the expandable list's headers and child items. N/A
headerStylingAttributes HeaderStylingAttributes Defines styling for headers, including appearance and layout. defaultHeaderStylingAttributes
listItemStylingAttributes ListItemStylingAttributes Defines styling for list items, including appearance and layout. defaultListItemStylingAttributes
contentAnimation ContentAnimation Defines expand/collapse animation for expandable list content. defaultContentAnimation
expandedIcon Int Drawable resource ID for the icon when a header is expanded. up arrow
collapseIcon Int Drawable resource ID for the icon when a header is collapsed. down arrow
itemSelectedIcon Int Drawable resource ID for the icon when a item is selected. check mark
onStateChanged (headerIndex: Int, isExpanded: Boolean) -> Unit Callback for when a header's expand/collapse state changes, providing the header index and expanded state. Empty Lambda
onListItemClicked (headerIndex: Int, itemIndex: Int, isSelected: Boolean) -> Unit Callback for when a list item is clicked, providing the header index, item index, and selection state. Empty Lambda
onListItemLongClicked (headerIndex: Int, itemIndex: Int, isSelected: Boolean) -> Unit Callback for when a list item is long pressed, providing the header index, item index, and selection state. Empty Lambda

❤️ Find the library useful?

Support it by joining stargazers ⭐ for this repository.

🤝 How to Contribute?

Whether you're helping us fix bugs, improve the docs, or a feature request, we'd love to have you! : muscle:
Check out our Contributing Guide for ideas on contributing.

🐞 Bugs and Feedback

For bugs, feature requests, and discussion use GitHub Issues.

🚀 Other Mobile Libraries

Check out our other libraries Awesome-Mobile-Libraries.

⚖️ License

Distributed under the MIT license. See LICENSE for details.

About

Welcome to SSComposeExpandableListView! A customizable expandable ListView for Jetpack Compose with support for custom headers, list items 📄, icons 🖼️, animations 🎬, and Material Theming 🎨.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages