Skip to content

Commit bff0a6c

Browse files
kavi707kavi707
committed
Color Pallet: Move theme pallet screen composable to common ui
1 parent ec70690 commit bff0a6c

File tree

3 files changed

+122
-108
lines changed

3 files changed

+122
-108
lines changed

ui-app/src/main/kotlin/com/kavi/droid/color/pallet/app/ui/common/CommonComposable.kt renamed to ui-app/src/main/kotlin/com/kavi/droid/color/pallet/app/ui/common/PalletCommonComposable.kt

File renamed without changes.

‎ui-app/src/main/kotlin/com/kavi/droid/color/pallet/app/ui/common/ThemeCommonComposable.kt‎

Lines changed: 121 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,121 @@
1+
package com.kavi.droid.color.pallet.app.ui.common
2+
3+
import androidx.compose.foundation.Canvas
4+
import androidx.compose.foundation.background
5+
import androidx.compose.foundation.border
6+
import androidx.compose.foundation.layout.Arrangement
7+
import androidx.compose.foundation.layout.Box
8+
import androidx.compose.foundation.layout.Column
9+
import androidx.compose.foundation.layout.Row
10+
import androidx.compose.foundation.layout.fillMaxWidth
11+
import androidx.compose.foundation.layout.height
12+
import androidx.compose.foundation.layout.padding
13+
import androidx.compose.foundation.layout.size
14+
import androidx.compose.foundation.layout.width
15+
import androidx.compose.foundation.shape.RoundedCornerShape
16+
import androidx.compose.material3.MaterialTheme
17+
import androidx.compose.material3.Text
18+
import androidx.compose.runtime.Composable
19+
import androidx.compose.ui.Alignment
20+
import androidx.compose.ui.Modifier
21+
import androidx.compose.ui.draw.shadow
22+
import androidx.compose.ui.graphics.Color
23+
import androidx.compose.ui.text.font.FontWeight
24+
import androidx.compose.ui.unit.dp
25+
import com.kavi.droid.color.pallet.KvColorPallet
26+
import com.kavi.droid.color.pallet.model.KvColor
27+
28+
@Composable
29+
fun ColorCircle(givenColor: Color, colorLetter: String = "", letterColor: Color = MaterialTheme.colorScheme.onPrimary) {
30+
31+
val circleSize = 48.dp
32+
33+
Box(
34+
modifier = Modifier
35+
.padding(8.dp)
36+
) {
37+
Canvas(
38+
modifier = Modifier.size(circleSize)
39+
) {
40+
drawCircle(color = givenColor, radius = circleSize.toPx() / 2)
41+
}
42+
43+
Text(colorLetter, modifier = Modifier
44+
.padding(8.dp)
45+
.align(Alignment.Center),
46+
style = MaterialTheme.typography.bodyLarge,
47+
color = letterColor
48+
)
49+
}
50+
}
51+
52+
@Composable
53+
fun ThemeColorRow(givenColor: KvColor) {
54+
Box(
55+
modifier = Modifier
56+
.padding(10.dp)
57+
) {
58+
Row(modifier = Modifier
59+
.border(1.dp, Color.White, shape = RoundedCornerShape(8.dp))
60+
.shadow(
61+
elevation = 10.dp,
62+
shape = RoundedCornerShape(8.dp)
63+
)
64+
.background(Color.White),
65+
verticalAlignment = Alignment.CenterVertically
66+
) {
67+
Box (modifier = Modifier
68+
.width(60.dp)
69+
.height(220.dp)
70+
.padding(top = 16.dp, start = 16.dp, end = 4.dp, bottom = 16.dp)
71+
.background(givenColor.color)
72+
) {
73+
Text("BASE",
74+
modifier = Modifier
75+
.padding(8.dp)
76+
.width(2.dp),
77+
style = MaterialTheme.typography.bodySmall,
78+
fontWeight = FontWeight.ExtraBold,
79+
color = MaterialTheme.colorScheme.onPrimary
80+
)
81+
}
82+
83+
Column(modifier = Modifier
84+
.fillMaxWidth(),
85+
verticalArrangement = Arrangement.Center,
86+
) {
87+
val appThemeColorSet = KvColorPallet.instance.generateThemeColorPallet(
88+
givenColor = givenColor.color,
89+
)
90+
91+
Text("Light Theme", Modifier.padding(top = 8.dp, start = 8.dp), style = MaterialTheme.typography.bodyMedium, fontWeight = FontWeight.ExtraBold,)
92+
93+
Row(
94+
modifier = Modifier
95+
.fillMaxWidth()
96+
.padding(top = 4.dp, start = 8.dp, end = 8.dp, bottom = 4.dp),
97+
//horizontalArrangement = Arrangement.Center
98+
) {
99+
ColorCircle(appThemeColorSet.light.primary, colorLetter = "P")
100+
ColorCircle(appThemeColorSet.light.secondary, colorLetter = "S")
101+
ColorCircle(appThemeColorSet.light.tertiary, colorLetter = "T")
102+
ColorCircle(appThemeColorSet.light.background, colorLetter = "B", letterColor = Color.Black)
103+
}
104+
105+
Text("Dark Theme", Modifier.padding(top = 8.dp, start = 8.dp), style = MaterialTheme.typography.bodyMedium, fontWeight = FontWeight.ExtraBold,)
106+
107+
Row(
108+
modifier = Modifier
109+
.fillMaxWidth()
110+
.padding(top = 4.dp, start = 8.dp, end = 8.dp, bottom = 4.dp),
111+
//horizontalArrangement = Arrangement.Center
112+
) {
113+
ColorCircle(appThemeColorSet.dark.primary, colorLetter = "P")
114+
ColorCircle(appThemeColorSet.dark.secondary, colorLetter = "S", letterColor = Color.Black)
115+
ColorCircle(appThemeColorSet.dark.tertiary, colorLetter = "T")
116+
ColorCircle(appThemeColorSet.dark.background, colorLetter = "B")
117+
}
118+
}
119+
}
120+
}
121+
}

‎ui-app/src/main/kotlin/com/kavi/droid/color/pallet/app/ui/tab/theme/ThemeColorGen.kt‎

Lines changed: 1 addition & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,23 @@
11
package com.kavi.droid.color.pallet.app.ui.tab.theme
22

3-
import androidx.compose.foundation.Canvas
4-
import androidx.compose.foundation.background
5-
import androidx.compose.foundation.border
6-
import androidx.compose.foundation.layout.Arrangement
7-
import androidx.compose.foundation.layout.Box
83
import androidx.compose.foundation.layout.Column
94
import androidx.compose.foundation.layout.Row
105
import androidx.compose.foundation.layout.fillMaxSize
116
import androidx.compose.foundation.layout.fillMaxWidth
12-
import androidx.compose.foundation.layout.height
137
import androidx.compose.foundation.layout.padding
148
import androidx.compose.foundation.layout.size
15-
import androidx.compose.foundation.layout.width
169
import androidx.compose.foundation.rememberScrollState
17-
import androidx.compose.foundation.shape.RoundedCornerShape
1810
import androidx.compose.foundation.verticalScroll
1911
import androidx.compose.material3.Button
2012
import androidx.compose.material3.MaterialTheme
2113
import androidx.compose.material3.Text
2214
import androidx.compose.runtime.Composable
2315
import androidx.compose.ui.Alignment
2416
import androidx.compose.ui.Modifier
25-
import androidx.compose.ui.draw.shadow
26-
import androidx.compose.ui.graphics.Color
27-
import androidx.compose.ui.text.font.FontWeight
2817
import androidx.compose.ui.tooling.preview.Preview
2918
import androidx.compose.ui.unit.dp
30-
import com.kavi.droid.color.pallet.KvColorPallet
19+
import com.kavi.droid.color.pallet.app.ui.common.ThemeColorRow
3120
import com.kavi.droid.color.pallet.color.MatPackage
32-
import com.kavi.droid.color.pallet.model.KvColor
3321

3422
@Composable
3523
fun ThemeColorGen(modifier: Modifier) {
@@ -73,101 +61,6 @@ fun ThemeColorGen(modifier: Modifier) {
7361
}
7462
}
7563

76-
@Composable
77-
fun ThemeColorRow(givenColor: KvColor) {
78-
Box(
79-
modifier = Modifier
80-
.padding(10.dp)
81-
) {
82-
Row(modifier = Modifier
83-
.border(1.dp, Color.White, shape = RoundedCornerShape(8.dp))
84-
.shadow(
85-
elevation = 10.dp,
86-
shape = RoundedCornerShape(8.dp)
87-
)
88-
.background(Color.White),
89-
verticalAlignment = Alignment.CenterVertically
90-
) {
91-
Box (modifier = Modifier
92-
.width(60.dp)
93-
.height(220.dp)
94-
.padding(top = 16.dp, start = 16.dp, end = 4.dp, bottom = 16.dp)
95-
.background(givenColor.color)
96-
) {
97-
Text("BASE",
98-
modifier = Modifier
99-
.padding(8.dp)
100-
.width(2.dp),
101-
style = MaterialTheme.typography.bodySmall,
102-
fontWeight = FontWeight.ExtraBold,
103-
color = MaterialTheme.colorScheme.onPrimary
104-
)
105-
}
106-
107-
Column(modifier = Modifier
108-
.fillMaxWidth(),
109-
verticalArrangement = Arrangement.Center,
110-
) {
111-
val appThemeColorSet = KvColorPallet.instance.generateThemeColorPallet(
112-
givenColor = givenColor.color,
113-
)
114-
115-
Text("Light Theme", Modifier.padding(top = 8.dp, start = 8.dp), style = MaterialTheme.typography.bodyMedium, fontWeight = FontWeight.ExtraBold,)
116-
117-
Row(
118-
modifier = Modifier
119-
.fillMaxWidth()
120-
.padding(top = 4.dp, start = 8.dp, end = 8.dp, bottom = 4.dp),
121-
//horizontalArrangement = Arrangement.Center
122-
) {
123-
ColorCircle(appThemeColorSet.light.primary, colorLetter = "P")
124-
ColorCircle(appThemeColorSet.light.secondary, colorLetter = "S")
125-
ColorCircle(appThemeColorSet.light.tertiary, colorLetter = "T")
126-
ColorCircle(appThemeColorSet.light.background, colorLetter = "B", letterColor = Color.Black)
127-
}
128-
129-
Text("Dark Theme", Modifier.padding(top = 8.dp, start = 8.dp), style = MaterialTheme.typography.bodyMedium, fontWeight = FontWeight.ExtraBold,)
130-
131-
Row(
132-
modifier = Modifier
133-
.fillMaxWidth()
134-
.padding(top = 4.dp, start = 8.dp, end = 8.dp, bottom = 4.dp),
135-
//horizontalArrangement = Arrangement.Center
136-
) {
137-
ColorCircle(appThemeColorSet.dark.primary, colorLetter = "P")
138-
ColorCircle(appThemeColorSet.dark.secondary, colorLetter = "S", letterColor = Color.Black)
139-
ColorCircle(appThemeColorSet.dark.tertiary, colorLetter = "T")
140-
ColorCircle(appThemeColorSet.dark.background, colorLetter = "B")
141-
}
142-
}
143-
}
144-
}
145-
}
146-
147-
@Composable
148-
fun ColorCircle(givenColor: Color, colorLetter: String = "", letterColor: Color = MaterialTheme.colorScheme.onPrimary) {
149-
150-
val circleSize = 48.dp
151-
152-
Box(
153-
modifier = Modifier
154-
.padding(8.dp)
155-
) {
156-
Canvas(
157-
modifier = Modifier.size(circleSize)
158-
) {
159-
drawCircle(color = givenColor, radius = circleSize.toPx() / 2)
160-
}
161-
162-
Text(colorLetter, modifier = Modifier
163-
.padding(8.dp)
164-
.align(Alignment.Center),
165-
style = MaterialTheme.typography.bodyLarge,
166-
color = letterColor
167-
)
168-
}
169-
}
170-
17164
@Preview
17265
@Composable
17366
fun ThemeColorGenPreview() {

0 commit comments

Comments
 (0)