|
1 | 1 | # Compose Fluent |
2 | 2 |
|
3 | | -[](https://github.com/Konyaco/compose-fluent-ui/blob/master/LICENSE) |
| 3 | +[](LICENSE) |
4 | 4 | [](https://github.com/Konyaco/compose-fluent-ui/releases) |
| 5 | + |
5 | 6 |
|
6 | | -**Fluent Design** UI library for **Jetbrains Compose** |
| 7 | + |
| 8 | +**Fluent Design** UI library for **Compose Multiplatform** |
7 | 9 |
|
8 | 10 |  |
9 | 11 |
|
10 | 12 | ## Current Status |
11 | 13 |
|
12 | | -> This library is experimental, any API (even the package name) would be changed in the future without any notification. |
| 14 | +> This library is experimental, any API would be changed in the future without any notification. |
13 | 15 |
|
14 | | -Current version: `v0.0.1-dev3` |
| 16 | +Please note that there are lots of hard-coding and workarounds in our source code, which we plan to eliminate in the future. |
15 | 17 |
|
16 | | -Now supported: |
| 18 | +Thank you for using our library. We look forward to receiving your feedback and contributions! |
17 | 19 |
|
18 | | -- Coarse implementation of some basic components: `Button`, `Switcher`, `TextField`, `Slider`... |
19 | | -- A fake `Mica` and `Layer` |
20 | | -- Dark theme and light theme |
21 | 20 |
|
22 | | -There are lots of hard-code and workaround in our source code, we are going to eliminate them in the future |
| 21 | +## Quick Start |
23 | 22 |
|
24 | | -Thank you for using our library, and we look forward to your feedback and contributions! |
| 23 | +### Add Dependency |
25 | 24 |
|
26 | | -### Multiplatform |
| 25 | +```kts |
| 26 | +implementation("com.konyaco:fluent:0.0.1-dev4") |
| 27 | +implementation("com.konyaco:fluent-icons-extended:0.0.1-dev4") // If you want to use full fluent icons. |
| 28 | +``` |
27 | 29 |
|
28 | | -Currently, only Desktop platforms are supported. It might be easy to migrate to multiplatform. |
| 30 | +### Example |
29 | 31 |
|
30 | | -## How to Use |
| 32 | +```kotlin |
| 33 | +import com.konyaco.fluent.component.* |
31 | 34 |
|
32 | | -We are not yet published our library to maven. You can download the source code or jar in release page |
| 35 | +@Composable |
| 36 | +fun App() { |
| 37 | + FluentTheme { |
| 38 | + Mica(Modifier.fillMaxSize()) { |
| 39 | + Column(Modifier.padding(24.dp)) { |
| 40 | + Button(onClick = {}) { |
| 41 | + Text("Hello Fluent Design") |
| 42 | + } |
| 43 | + } |
| 44 | + } |
| 45 | + } |
| 46 | +} |
| 47 | +``` |
| 48 | +See [`example`](example) module for more details. |
33 | 49 |
|
34 | | -- `FluentTheme()` is the context and entry point of the application. |
| 50 | +- `FluentTheme()` is the context and entry point of the application, just like `MaterialTheme` |
35 | 51 | - Components are under `component` package |
36 | 52 | - `Mica` and `Layer` are under `background` package |
37 | 53 |
|
38 | | -About the API usage, just see `Main.kt` |
39 | | - |
40 | 54 | ## License |
41 | 55 |
|
42 | 56 | This library is under Apache-2.0 license. |
43 | 57 |
|
44 | 58 | The copyright of the icon assets (in `com.konyaco.fluent.icons` package) belongs to Microsoft. |
45 | 59 |
|
46 | | -## TODO |
47 | | - |
48 | | -- M1 |
49 | | - - [ ] Basic Inputs |
50 | | - - [x] Button |
51 | | - - [x] Toggle Switch |
52 | | - - [x] Checkbox |
53 | | - - [x] Radio Button |
54 | | - - [x] Slider |
55 | | - - [ ] Dropdown |
56 | | - - [ ] Pill Button |
57 | | - - [x] Layers |
58 | | - - [x] Fake Mica |
59 | | - - [x] Simple Layer |
60 | | - - [x] Text Field |
61 | | - - [x] Part of Animation |
62 | | -- M2 |
63 | | - - [ ] Theme |
64 | | - - [x] Light and Dark theme |
65 | | - - [ ] Custom Accent color |
66 | | - - [ ] Animation |
67 | | - - [ ] Refactor architecture, cleanup code, eliminate hard-code |
68 | | - - [ ] More |
69 | | -- M3 |
70 | | - - [ ] Compound components (Side Nav, Top Nav, Tab View, etc...) |
71 | | - - [ ] Layer (Might be delayed) |
72 | | - - [ ] Real Mica |
73 | | - - [ ] Acrylic |
74 | | - - [ ] Accessibility Semantics |
| 60 | +## Components |
| 61 | + |
| 62 | +### Layers |
| 63 | + |
| 64 | +- Mica |
| 65 | + - [x] Simple Mica |
| 66 | + - [ ] Real Mica |
| 67 | +- Layer |
| 68 | + - [x] Simple Layer |
| 69 | + - [ ] Real Layer |
| 70 | +- [ ] Acrylic |
| 71 | + |
| 72 | +### Basic Inputs |
| 73 | + |
| 74 | +- [x] Button |
| 75 | +- [x] ToggleSwitch |
| 76 | +- [x] CheckBox |
| 77 | +- [x] RadioButton |
| 78 | +- [x] Slider |
| 79 | +- [x] DropdownMenu |
| 80 | +- [x] TextField |
| 81 | +- [x] ProgressBar |
| 82 | +- [x] ProgressRing |
| 83 | +- [ ] Pill Button |
| 84 | +- [ ] ComboBox |
| 85 | +- [ ] RatingControl |
| 86 | + |
| 87 | +### Basic Components |
| 88 | + |
| 89 | +- [ ] Tooltip |
| 90 | +- [ ] InfoBar |
| 91 | +- [ ] FilePicker |
| 92 | +- [ ] Menu |
| 93 | + |
| 94 | +### Dialogs |
| 95 | + |
| 96 | +- [x] Simple Dialog |
| 97 | +- [ ] Compound Dialog (Title, Content, Controls) |
| 98 | +- [ ] Flyout |
| 99 | + |
| 100 | +### Animations |
| 101 | + |
| 102 | +- [x] Animation Preset Constants (Duration, Easing Functions) |
| 103 | + |
| 104 | +### Theme |
| 105 | + |
| 106 | +- [x] Light and Dark theme |
| 107 | +- [ ] Custom accent color |
| 108 | + |
| 109 | +### Compound Components |
| 110 | + |
| 111 | +- [ ] Color Picker |
| 112 | +- [ ] DateTime Picker |
| 113 | +- [ ] Calender |
| 114 | +- [ ] Navigation |
| 115 | + - [ ] NavigationView |
| 116 | + - [ ] BreadcrumbBar |
| 117 | + - [ ] Pivot |
| 118 | + - [ ] TabView |
| 119 | + |
| 120 | +### TODO |
| 121 | + |
| 122 | + |
| 123 | +- [ ] Accessibility Semantics |
0 commit comments