Simple dropdown spinner component enabling effortless selection from a list. Offers customizable display options, automatic state updates, and support for option-specific callbacks in applications.
A simple dropdown (spinner) component for Compose Multiplatform. Works on Android 🤖 and iOS 🍏.
Add the dependency in your commonMain source set:
kotlin {
sourceSets {
val commonMain by getting {
dependencies {
implementation("io.github.rufenkhokhar:K-Spinner:latest_release")
}
}
}
}Make sure you have mavenCentral() in your repositories.
@Composable
fun CountriesSpinnerDemo() {
var selected by remember { mutableStateOf("Pakistan") }
val options = listOf("Pakistan", "India", "Bangladesh", "Sri Lanka")
KSpinner(
options = options,
selectedOption = selected,
onOptionSelected = { selected = it },
selectedOptionItem = { Text(it) },
dropDownOption = { Text(it) },
dropDownIcon = { Icon(Icons.Default.ArrowDropDown, contentDescription = null) }
)
}👉 Tap the field, pick an option, and your state updates automatically.
@Composable
fun <T> KSpinner(
options: List<T>,
selectedOption: T,
onOptionSelected: (T) -> Unit,
selectedOptionItem: @Composable (T) -> Unit,
dropDownOption: @Composable (T) -> Unit,
dropDownIcon: @Composable () -> Unit,
modifier: Modifier = Modifier,
shape: Shape = CardDefaults.shape,
colors: CardColors = CardDefaults.cardColors(),
border: BorderStroke? = null,
onOptionsShown: () -> Unit = {},
onOptionsHidden: () -> Unit = {}
)options – list of items to choose fromselectedOption – current selected valueonOptionSelected – callback when a new item is pickedselectedOptionItem – how the chosen item looksdropDownOption – how each row in the dropdown looksdropDownIcon – trailing icononOptionsShown / onOptionsHidden – optional callbacksMIT
A simple dropdown (spinner) component for Compose Multiplatform. Works on Android 🤖 and iOS 🍏.
Add the dependency in your commonMain source set:
kotlin {
sourceSets {
val commonMain by getting {
dependencies {
implementation("io.github.rufenkhokhar:K-Spinner:latest_release")
}
}
}
}Make sure you have mavenCentral() in your repositories.
@Composable
fun CountriesSpinnerDemo() {
var selected by remember { mutableStateOf("Pakistan") }
val options = listOf("Pakistan", "India", "Bangladesh", "Sri Lanka")
KSpinner(
options = options,
selectedOption = selected,
onOptionSelected = { selected = it },
selectedOptionItem = { Text(it) },
dropDownOption = { Text(it) },
dropDownIcon = { Icon(Icons.Default.ArrowDropDown, contentDescription = null) }
)
}👉 Tap the field, pick an option, and your state updates automatically.
@Composable
fun <T> KSpinner(
options: List<T>,
selectedOption: T,
onOptionSelected: (T) -> Unit,
selectedOptionItem: @Composable (T) -> Unit,
dropDownOption: @Composable (T) -> Unit,
dropDownIcon: @Composable () -> Unit,
modifier: Modifier = Modifier,
shape: Shape = CardDefaults.shape,
colors: CardColors = CardDefaults.cardColors(),
border: BorderStroke? = null,
onOptionsShown: () -> Unit = {},
onOptionsHidden: () -> Unit = {}
)options – list of items to choose fromselectedOption – current selected valueonOptionSelected – callback when a new item is pickedselectedOptionItem – how the chosen item looksdropDownOption – how each row in the dropdown looksdropDownIcon – trailing icononOptionsShown / onOptionsHidden – optional callbacksMIT