Skip to content
/ lint-ui Public

A Compose Desktop UI framework supporting global theme control. (aka LintUI)

License

Notifications You must be signed in to change notification settings

lumkit/lint-ui

Repository files navigation

Lint UI for Compose Desktop

License Version Maven Central

A Compose Desktop UI framework supporting global theme control. (aka LintUI)

Introduce

This is a UI framework developed for Compose Desktop (on Material Design 3), and it integrates many features that normal applications should have (such as data persistence). This UI framework will remain open source and free.

Features

  • Support the Root Panel covering the whole window (Lint Window)
  • Material Design3 color matching style (Lint Theme Scope)
  • Commonly used widgets
    • Buttons (Lint Button)
    • Cards (Lint Card)
    • Dividers (Lint Dividers)
    • Folded container (Lint Folder)
    • Minimizable, collapsible and nestable side navigation bar (Lint Side)
    • Flexible window without native decoration (Lint Layer Window)
    • Dialog of basic style (Lint Dialog)
    • Toast (Lint Window Toast)
    • Circle Indicator & Linear Indicator (Lint Progress/Lint Indicator)
    • Stack Chart (Lint Stack Chart)
    • More beautiful and practical UI components will continue to be developed in the future
  • A simple context provider
  • Shared Preferences based on SQLite (SharedPreferences)
  • Out of the box theme management store (Lint Theme Store)
  • Out-of-box theme installation framework
  • Unify the global theme
  • Dynamic perception system dark mode
  • View Model Store
  • More features will be continuously updated in the future

Screen shoot

screen-shoot.png

Use this library in your project

Before that, you can run the example we provided for you to see the concrete effect.

./gradlew desktopRun -DmainClass=MainKt --quiet

LintUI framework version requirements

Lint UI Kotlin Compose Framework Compose Plugin Java
1.0.1 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.2 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.3 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.4 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.5 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.6 1.9.22 1.6.2 1.6.0 JDK 17++
1.0.7 2.0.0-RC2 1.6.11 1.6.11 JDK 17++

1. Configure the Maven central warehouse for the project.

dependencyResolutionManagement {
    repositories {
        google()
        mavenCentral()
        maven(url = "https://jitpack.io")
        maven("https://maven.pkg.jetbrains.space/public/p/compose/dev")
    }
}

2. Import the [lint-compose-ui] dependency.

dependencies {
    // You just import dependencies such as jb-compose-desktop-currentOs and jb-compose-components-resources.

    // Base on KMP
    implementation("io.github.lumkit:lint-compose-ui:1.0.7")
    // Only Desktop
    implementation("io.github.lumkit:lint-compose-ui-desktop:1.0.7")
}

3. Start writing your first desktop application

import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.ui.Modifier
import androidx.compose.ui.window.MenuBar
import io.github.lumkit.desktop.context.LocalContext
import io.github.lumkit.desktop.data.DarkThemeMode
import io.github.lumkit.desktop.example.App
import io.github.lumkit.desktop.lintApplication
import io.github.lumkit.desktop.ui.LintWindow
import io.github.lumkit.desktop.ui.theme.AnimatedLintTheme
import io.github.lumkit.desktop.ui.theme.LocalThemeStore
import lint_ui.example.generated.resources.*
import org.jetbrains.compose.resources.ExperimentalResourceApi
import org.jetbrains.compose.resources.painterResource
import org.jetbrains.compose.resources.stringResource
import java.awt.Dimension

@OptIn(ExperimentalResourceApi::class)
fun main() = lintApplication(
    packageName = "LintUIExample"
) {
    val context = LocalContext.current

    // Toggles the global dark theme mode.
    LintWindow(
        onCloseRequest = ::exitApplication,
        rememberSize = true,
        title = context.getPackageName(),
        icon = painterResource(Res.drawable.compose_multiplatform),
    ) {
        AnimatedLintTheme(
            modifier = Modifier.fillMaxSize(),
        ) {
            Text("Hello Lint UI!")
        }
    }
}

How to use some built-in APIs.

  • Context

     // Get global context
     val context = LocalContext.current
    
     // App work path
     val filesDir = context.getFilesDir()
    
     // App package name
     val packageName = context.getPackageName()
    
     // Persistent file name of App (based on sqlite implementation)
     val sharedPreferences = context.getSharedPreferences("shared preference file name")
    
     // Gets the theme instance in the specified persistence file.
     val theme = context.getTheme(sharedPreferences = sharedPreferences)
  • Shared Preferences

     // Gets the global SharedPreferences instance.
     val sharedPreferences = LocalSharedPreferences.current
    
     // Get the data in the hardware (is-dark is virtual).
     val isDark = sharedPreferences.get<String>("is-dark")
    
     // Put string
     sharedPreferences.putString("is-dark", isDark)
     // Put type data
     sharedPreferences.put("type-data", arrayListOf("Dark", "Light"))
  • ViewModel

    // Create a new entity class that inherits ViewModel[io.github.lumkit.desktop.lifecycle.ViewModel], such as "MyViewModel".
    class MyViewModel : ViewModel() {
    
        private val _text = MutableStateFlow("")
        val text: StateFlow<String> = _text.asStateFlow()
    
        fun setText(text: String) {
            _text.value = text
        }
    
    }
    
    // use view model and state
    val viewModel = viewModel<MyViewModel>()
    val text by viewModel.text.collectAsState()
    
    LintTextField(
        value = text,
        onValueChange = viewModel::setText,
        label = {
            Text("输入内容")
        }
    )
  • More built-in APIs will be gradually opened, so stay tuned

Excellent cited framework or repositories (Rank insensitive)

End

About

A Compose Desktop UI framework supporting global theme control. (aka LintUI)

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages