Skip to content

A setting library for Jetpack Compose with Material You design

License

Notifications You must be signed in to change notification settings

re-ovo/compose-setting

Repository files navigation

ComposeSetting

This is a basic Compose setting library that provides a basic Material3 setting components It also provides a persistent state system based on MMKV. Compared with SharedPreference/DataStore, it can support synchronous reading without loss of performance

Features

  • Remember Preference
  • Material3 Setting Component
  • High Performance
  • Support Synchronous Reading/Writing

Screenshot

Import to your project

  1. Import jitpack to your repository
repositories {
    maven {
        url 'https://jitpack.io'
    }
}
  1. Import the library
implementation 'com.github.re-ovo:compose-setting:<latest-version>'

Remember Preference

You should initialize the MMKV before using it.

// Call this function in your Application.onCreate()
initComposeSetting()

You can use rememberXXXPreference function, which can persist remember a certain value in Compose

val booleanPreference by rememberBooleanPreference(
key = "boolean_preference",
default = false
)

Other types of preference can be used as well, such as

  • rememberStringPreference
  • rememberIntPreference
  • rememberLongPreference
  • rememberFloatPreference
  • rememberDoublePreference
  • rememberStringPreference
  • rememberStringSetPreference

If you want to read/write the preference synchronously without Compose context, you can use mmkvPreference to do that:

mmkvPreference.getBoolean("boolean_preference", false)
mmkvPreference.putBoolean("boolean_preference", true)
    ...

Setting Components

This library provides several out-of-the-box setting item components

SettingBooleanItem

This component is used to display a setting item with a boolean value

val booleanPref = rememberBooleanPreference(
    key = "boolean_preference",
    defaultValue = false
)
SettingBooleanItem(
    state = booleanPref,
    title = {
        Text("Network")
    },
    text = {
        Text("This is the description")
    },
    icon = {
        Icon(Icons.Outlined.Notifications, null)
    }
)

SettingStringItem

This component is used to display a setting item with a string value

val stringPref = rememberStringPreference(
    key = "string_preference",
    defaultValue = "default"
)
// Pick Based
SettingStringPickerItem(
    state = stringPref,
    title = {
        Text("Set Phone Brand")
    },
    text = {
        Text("Select your phone brand")
    },
    icon = {
        Icon(Icons.Outlined.Phone, null)
    },
    stateRange = setOf(
        "Xiaomi", "Google", "Oppo"
    )
)
// Input Field Based
SettingStringInputDialogItem(
    state = stringPref,
    title = {
        Text("Set Phone Brand")
    },
    icon = {
        Icon(Icons.Outlined.Phone, null)
    },
    validator = { value ->
        value.length >= 3
    },
    invalidMessage = {
        Text("Invalid Phone Brand")
    },
    confirmText = {
        Text("Confirm")
    },
    dismissText = {
        Text("Dismiss")
    }
)

SettingLinkItem

This component is used to display a basic setting item

SettingLinkItem(
    title = {
        Text("Network")
    },
    text = {
        Text("This is the description")
    },
    icon = {
        Icon(Icons.Outlined.Notifications, null)
    },
    onClick = {
        // do something by yourself
    }
)

SettingItemCategory

This component is used to display a category of setting items

 SettingItemCategory(
    title = {
        Text(text = "Compose Yes")
    }
) {
    // Your Menu Items Here
}

About

A setting library for Jetpack Compose with Material You design

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages