Skip to content

MFlisar/ComposePreferences

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

140 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Maven Central API Kotlin Kotlin Multiplatform

ComposePreferences

Platforms Android iOS Windows WebAssembly

This library offers you an easily extendible compose framework for preferences.

Note

All features are splitted into separate modules, just include the modules you want to use!

Table of Contents

πŸ“· Screenshots

overview overview2

bool

bool-default bool-modern

button

button-default button-modern

color

color-default color-dialog color-dialog2
color-modern

core

info-default info-modern root-default
root-modern

date

date-default date-dialog date-modern

input

input-default input-dialog input-modern

list

list-default list-dialog list-dialog2
list-dropdown list-modern

number

number-default number-dialog number-modern

time

time-default time-dialog time-modern

πŸ’» Supported Platforms

Module android iOS windows wasm
core βœ… βœ… βœ… βœ…
screen-bool βœ… βœ… βœ… βœ…
screen-button βœ… βœ… βœ… βœ…
screen-color βœ… βœ… βœ… βœ…
screen-date βœ… βœ… βœ… βœ…
screen-input βœ… βœ… βœ… βœ…
screen-list βœ… βœ… βœ… βœ…
screen-number βœ… βœ… βœ… βœ…
screen-time βœ… βœ… βœ… βœ…
kotpreferences βœ… βœ… βœ… βœ…

➑️ Versions

Dependency Version
Kotlin 2.3.20
Jetbrains Compose 1.10.3
Jetbrains Compose Material3 1.9.0

⚠️ Following experimental annotations are used:

  • OptIn
    • androidx.compose.ui.ExperimentalComposeUiApi (1x)

I try to use as less experimental features as possible, but in this case the ones above are needed!

πŸ”§ Setup

Using Version Catalogs

Define the dependencies inside your libs.versions.toml file.

[versions]

composepreferences = "<LATEST-VERSION>"

[libraries]

composepreferences-core = { module = "io.github.mflisar.composepreferences:core", version.ref = "composepreferences" }
composepreferences-screen-bool = { module = "io.github.mflisar.composepreferences:screen-bool", version.ref = "composepreferences" }
composepreferences-screen-button = { module = "io.github.mflisar.composepreferences:screen-button", version.ref = "composepreferences" }
composepreferences-screen-color = { module = "io.github.mflisar.composepreferences:screen-color", version.ref = "composepreferences" }
composepreferences-screen-date = { module = "io.github.mflisar.composepreferences:screen-date", version.ref = "composepreferences" }
composepreferences-screen-input = { module = "io.github.mflisar.composepreferences:screen-input", version.ref = "composepreferences" }
composepreferences-screen-list = { module = "io.github.mflisar.composepreferences:screen-list", version.ref = "composepreferences" }
composepreferences-screen-number = { module = "io.github.mflisar.composepreferences:screen-number", version.ref = "composepreferences" }
composepreferences-screen-time = { module = "io.github.mflisar.composepreferences:screen-time", version.ref = "composepreferences" }
composepreferences-kotpreferences = { module = "io.github.mflisar.composepreferences:kotpreferences", version.ref = "composepreferences" }

And then use the definitions in your projects build.gradle.kts file like following:

implementation(libs.composepreferences.core)
implementation(libs.composepreferences.screen.bool)
implementation(libs.composepreferences.screen.button)
implementation(libs.composepreferences.screen.color)
implementation(libs.composepreferences.screen.date)
implementation(libs.composepreferences.screen.input)
implementation(libs.composepreferences.screen.list)
implementation(libs.composepreferences.screen.number)
implementation(libs.composepreferences.screen.time)
implementation(libs.composepreferences.kotpreferences)
Direct Dependency Notation

Simply add the dependencies inside your build.gradle.kts file.

val composepreferences = "<LATEST-VERSION>"

implementation("io.github.mflisar.composepreferences:core:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-bool:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-button:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-color:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-date:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-input:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-list:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-number:${composepreferences}")
implementation("io.github.mflisar.composepreferences:screen-time:${composepreferences}")
implementation("io.github.mflisar.composepreferences:kotpreferences:${composepreferences}")

πŸš€ Usage

Basic example

// select a style for your preferences
val style = DefaultStyle.create()
val modernStyle = ModernStyle.create()

// create a preference settings instance (you can adjust a few additional settings here)
val settings = PreferenceSettingsDefaults.settings(
    style = style
)

// create a state for the preference screen (this is optional - only needed if you need access to informations from this state)
val state = rememberPreferenceState()

// create a preference screen
PreferenceScreen(
    modifier = Modifier,
    settings = settings,
    state = state
) {
    // preference items
    // ...
}

Preference items

Check out the modules region in the menu on the left to find out more about the different preference items.

Here's a very basic example to show you how the preference items are used inside the PreferenceScreen:

PreferenceScreen(
    // ...
) {
    PreferenceSection(
        title = "Section 1"
    ) {
        PreferenceInfo(
            title = "Info 1"
        )
        val checked = remember { mutableStateOf(false) }
        PreferenceBool(
            value = checked,
            title = "Boolean Preference"
        )
        val input =  remember { mutableStateOf("") }
        PreferenceInputText(
            value = input,
            title = "Input Preference"
        )
    }
    PreferenceSection(
        title = "Section 2"
    ) {
        PreferenceInfo(
            title = "Info 2"
        )
    }
}

πŸ“ Modules

✨ Demo

A full demo is included inside the demo module, it shows nearly every usage with working examples.

ℹ️ More

πŸ“š API

Check out the API documentation.

πŸ’‘ Other Libraries

You can find more libraries (all multiplatform) of mine that all do work together nicely here.

About

Compose Preference Screen for Android - Material3 Design (including customisation, nesting and more)

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages