Skip to content

Commit 4576723

Browse files
SmartToolFactorySmartToolFactory
committed
update demos
1 parent 8ea482d commit 4576723

File tree

5 files changed

+103
-58
lines changed

5 files changed

+103
-58
lines changed

‎app/src/main/java/com/smarttoolfactory/composecolorpicker/demo/ColorModeConversionDemo.kt‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,11 +16,11 @@ import androidx.compose.ui.graphics.toArgb
1616
import androidx.compose.ui.text.font.FontWeight
1717
import androidx.compose.ui.unit.dp
1818
import androidx.compose.ui.unit.sp
19-
import com.smarttoolfactory.colorpicker.*
20-
import com.smarttoolfactory.colorpicker.ui.Orange400
2119
import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelHSL
2220
import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelHSV
2321
import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelRGBA
22+
import com.smarttoolfactory.colorpicker.ui.Orange400
23+
import com.smarttoolfactory.colorpicker.util.*
2424
import com.smarttoolfactory.colorpicker.widget.drawChecker
2525
import com.smarttoolfactory.composecolorpicker.ui.theme.backgroundColor
2626
import kotlin.math.roundToInt
@@ -426,7 +426,6 @@ private fun CheckColorConversionDetailsFromHSL(
426426
}
427427

428428

429-
430429
@Composable
431430
fun SliderDisplayPanelColorFromHSV(
432431
modifier: Modifier,

‎app/src/main/java/com/smarttoolfactory/composecolorpicker/demo/ColorPickerDemo.kt‎

Lines changed: 54 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,72 @@
11
package com.smarttoolfactory.composecolorpicker.demo
22

3-
import androidx.compose.foundation.layout.Column
4-
import androidx.compose.foundation.layout.fillMaxSize
5-
import androidx.compose.foundation.layout.padding
3+
import androidx.compose.foundation.background
4+
import androidx.compose.foundation.layout.*
65
import androidx.compose.foundation.rememberScrollState
76
import androidx.compose.foundation.verticalScroll
8-
import androidx.compose.runtime.Composable
9-
import androidx.compose.runtime.getValue
10-
import androidx.compose.runtime.mutableStateOf
11-
import androidx.compose.runtime.remember
7+
import androidx.compose.material.ButtonDefaults
8+
import androidx.compose.material.OutlinedButton
9+
import androidx.compose.material.Text
10+
import androidx.compose.runtime.*
11+
import androidx.compose.ui.Alignment
1212
import androidx.compose.ui.Modifier
1313
import androidx.compose.ui.graphics.Color
1414
import androidx.compose.ui.unit.dp
15-
import com.smarttoolfactory.colorpicker.picker.ColorPickerHSL
15+
import com.smarttoolfactory.colorpicker.dialog.ColorPickerRingDiamondHSLDialog
16+
import com.smarttoolfactory.colorpicker.widget.ColorDisplayRoundedRect
17+
import com.smarttoolfactory.composecolorpicker.ui.theme.backgroundColor
1618

1719
@Composable
1820
fun ColorPickerDemo() {
1921
Column(
2022
modifier = Modifier
2123
.fillMaxSize()
22-
.padding(8.dp)
23-
.verticalScroll(rememberScrollState())
24+
.background(backgroundColor)
25+
.padding(horizontal = 8.dp, vertical = 4.dp)
26+
.verticalScroll(rememberScrollState()),
27+
horizontalAlignment = Alignment.CenterHorizontally,
2428
) {
25-
val initialColor = Color.hsl(0f, 0.5f, 0.5f)
29+
var previousColor by remember {
30+
mutableStateOf(
31+
Color.hsl(0f, 0.5f, 0.5f)
32+
)
33+
}
34+
var color by remember {
35+
mutableStateOf(Color.hsl(0f, 0.5f, 0.5f))
36+
}
2637

27-
val showColorDialog by remember { mutableStateOf(false) }
28-
ColorPickerHSL(initialColor = initialColor)
38+
Spacer(modifier = Modifier.height(30.dp))
39+
ColorDisplayRoundedRect(
40+
modifier = Modifier.fillMaxWidth(.5f),
41+
initialColor = previousColor,
42+
currentColor = color
43+
)
44+
45+
val buttonModifier = Modifier
46+
.fillMaxWidth()
47+
.padding(4.dp)
48+
49+
var showColorDialogRingDiamondHSL by remember { mutableStateOf(false) }
50+
51+
OutlinedButton(
52+
modifier = buttonModifier,
53+
onClick = { showColorDialogRingDiamondHSL = !showColorDialogRingDiamondHSL },
54+
colors = ButtonDefaults.outlinedButtonColors(
55+
backgroundColor = Color.Transparent
56+
)
57+
58+
) {
59+
Text(text = "Hue Ring-Diamond HSL Dialog")
60+
}
61+
62+
if (showColorDialogRingDiamondHSL) {
63+
previousColor = color.copy()
64+
65+
ColorPickerRingDiamondHSLDialog(color) {
66+
showColorDialogRingDiamondHSL = !showColorDialogRingDiamondHSL
67+
color = it
68+
}
69+
}
2970
}
3071
}
3172

‎app/src/main/java/com/smarttoolfactory/composecolorpicker/demo/ColorfulSliderDemo.kt‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -618,7 +618,7 @@ private fun SliderCircleColorDisplayHSVExamples(
618618
hue = hue,
619619
saturation = saturation,
620620
value = value,
621-
alpha,
621+
alpha = alpha,
622622
onSaturationChange = { saturation = it },
623623
onAlphaChange = { alpha = it }
624624
)
@@ -629,7 +629,7 @@ private fun SliderCircleColorDisplayHSVExamples(
629629
hue = hue,
630630
saturation = saturation,
631631
value = value,
632-
alpha,
632+
alpha = alpha,
633633
onValueChange = { value = it },
634634
onAlphaChange = { alpha = it }
635635
)

‎app/src/main/java/com/smarttoolfactory/composecolorpicker/demo/HSVHSLGradientDemo.kt‎

Lines changed: 33 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ import androidx.compose.ui.graphics.Brush
1717
import androidx.compose.ui.graphics.Color
1818
import androidx.compose.ui.graphics.drawscope.DrawScope
1919
import androidx.compose.ui.unit.dp
20-
import com.smarttoolfactory.colorpicker.drawIntoLayer
20+
import com.smarttoolfactory.colorpicker.util.drawIntoLayer
2121
import com.smarttoolfactory.colorpicker.selector.diamondPath
2222
import com.smarttoolfactory.colorpicker.ui.*
2323
import com.smarttoolfactory.colorpicker.ui.brush.*
@@ -102,40 +102,49 @@ private fun HuePickerHSVGradientExample(
102102
}
103103

104104
CanvasWithTitle(
105-
modifier = modifier.background(Color.LightGray),
105+
modifier = modifier,
106106
text = "HSV Diamond"
107107
) {
108+
108109
val length = size.width
110+
111+
// HSV Gradients
112+
val saturationHSVGradient = saturationHSVGradient(
113+
0f,
114+
start = Offset(
115+
length / 2, 0f
116+
),
117+
end = Offset(
118+
length, length / 2
119+
120+
)
121+
)
122+
val valueGradientHSV = valueGradient(
123+
0f,
124+
start = Offset(
125+
length / 2, 0f
126+
127+
),
128+
end = Offset(
129+
0f, length / 2
130+
)
131+
)
132+
133+
109134
val diamondPath = diamondPath(Size(length, length))
110135

111136
drawIntoLayer {
112137
drawPath(
113138
path = diamondPath,
114-
valueGradient,
139+
valueGradientHSV,
115140
)
116141
drawPath(
117142
path = diamondPath,
118-
saturationGradient,
143+
saturationHSVGradient,
119144
blendMode = BlendMode.Multiply
120145
)
121146
}
122147
}
123-
124-
CanvasWithTitle(
125-
modifier = modifier,
126-
text = "HSV Diamond positions\n" +
127-
"50 samples"
128-
) {
129-
drawSaturationPointsInDiamond(sampleRate = 60, hsv = true)
130-
}
131-
132-
CanvasWithTitle(
133-
modifier = modifier,
134-
text = "HSV Diamond positions\n" +
135-
"10 samples"
136-
) {
137-
drawSaturationPointsInDiamond(sampleRate = 30, hsv = true)
138-
}
139148
}
140149

141150
@Composable
@@ -196,15 +205,15 @@ private fun HuePickerHSLGradientExample(
196205
text = "HSL Diamond positions\n" +
197206
"50 samples"
198207
) {
199-
drawSaturationPointsInDiamond(sampleRate = 60, hsv = false)
208+
drawSaturationPointsInDiamond(sampleRate = 60)
200209
}
201210

202211
CanvasWithTitle(
203212
modifier = modifier,
204213
text = "HSL Diamond positions\n" +
205214
"10 samples"
206215
) {
207-
drawSaturationPointsInDiamond(sampleRate = 30, hsv = false)
216+
drawSaturationPointsInDiamond(sampleRate = 30)
208217
}
209218
}
210219

@@ -324,8 +333,7 @@ private fun DrawScope.drawSaturationWithSampling(sampleRate: Int, hsv: Boolean)
324333
* creating points to draw like gradient effect for HSL color
325334
*/
326335
private fun DrawScope.drawSaturationPointsInDiamond(
327-
sampleRate: Int,
328-
hsv: Boolean
336+
sampleRate: Int
329337
) {
330338
val width = size.width
331339
val samplingRate = (width / sampleRate).toInt()
@@ -337,13 +345,8 @@ private fun DrawScope.drawSaturationPointsInDiamond(
337345
val saturation = xPos / width
338346
val value = 1 - (yPos / width)
339347

340-
val colors = if (hsv) {
341-
Color.hsv(0f, saturation, value)
342-
} else {
343-
Color.hsl(0f, saturation, value)
344-
}
345348
drawRect(
346-
color = colors,
349+
color = Color.hsl(0f, saturation, value),
347350
size = Size(samplingRate.toFloat(), samplingRate.toFloat()),
348351
topLeft = Offset(xPos.toFloat(), yPos.toFloat())
349352
)

‎app/src/main/java/com/smarttoolfactory/composecolorpicker/demo/SaturationSelectorDemo.kt‎

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -40,19 +40,19 @@ fun SaturationSelectorDemo() {
4040
.background(Color.White)
4141

4242
SLWithHSLDiamondExample(cardModifier, selectorModifier)
43-
Spacer(modifier = Modifier.height(20.dp))
43+
Spacer(modifier = Modifier.height(30.dp))
4444
SVSelectorWithHSVRectangleExample(cardModifier, selectorModifier)
45-
Spacer(modifier = Modifier.height(20.dp))
45+
Spacer(modifier = Modifier.height(30.dp))
4646
SLSelectorWithHSLRectangleExample(cardModifier, selectorModifier)
47-
Spacer(modifier = Modifier.height(20.dp))
47+
Spacer(modifier = Modifier.height(30.dp))
4848
HSSelectorHSVCircleExample(cardModifier, selectorModifier)
49-
Spacer(modifier = Modifier.height(20.dp))
49+
Spacer(modifier = Modifier.height(30.dp))
5050
HSSelectorWithHSVRectangleExample(cardModifier, selectorModifier)
51-
Spacer(modifier = Modifier.height(20.dp))
51+
Spacer(modifier = Modifier.height(30.dp))
5252
HVSelectorWithHSVRectangleExample(cardModifier, selectorModifier)
53-
Spacer(modifier = Modifier.height(20.dp))
53+
Spacer(modifier = Modifier.height(30.dp))
5454
HSSelectorWithHSLRectangleExample(cardModifier, selectorModifier)
55-
Spacer(modifier = Modifier.height(20.dp))
55+
Spacer(modifier = Modifier.height(30.dp))
5656
HLSelectorWithHSLRectangleExample(cardModifier, selectorModifier)
5757
}
5858
}
@@ -71,7 +71,7 @@ fun SLWithHSLDiamondExample(modifier: Modifier, selectorModifier: Modifier) {
7171
modifier = modifier,
7272
horizontalAlignment = Alignment.CenterHorizontally
7373
) {
74-
SLSelectorDiamondHSL(
74+
SaturationLightnessSelectorDiamondHSL(
7575
modifier = selectorModifier,
7676
hue = hue,
7777
saturation = saturation,
@@ -113,7 +113,7 @@ private fun SVSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
113113
modifier = modifier,
114114
horizontalAlignment = Alignment.CenterHorizontally
115115
) {
116-
SVSelectorRectHSV(
116+
SaturationValueSelectorRectHSV(
117117
modifier = Modifier
118118
.fillMaxWidth()
119119
.aspectRatio(4 / 3f),
@@ -127,6 +127,7 @@ private fun SVSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
127127
}
128128

129129
SliderCircleColorDisplayHueHSV(
130+
modifier = Modifier.padding(8.dp),
130131
hue = hue,
131132
saturation = saturation,
132133
value = value,
@@ -155,7 +156,7 @@ private fun SLSelectorWithHSLRectangleExample(modifier: Modifier, selectorModifi
155156
modifier = modifier,
156157
horizontalAlignment = Alignment.CenterHorizontally
157158
) {
158-
SLSelectorRectHSL(
159+
SaturationLightnessSelectorRectHSL(
159160
modifier = Modifier
160161
.fillMaxWidth()
161162
.aspectRatio(4 / 3f),
@@ -169,6 +170,7 @@ private fun SLSelectorWithHSLRectangleExample(modifier: Modifier, selectorModifi
169170
}
170171

171172
SliderCircleColorDisplayHueHSL(
173+
modifier = Modifier.padding(8.dp),
172174
hue = hue,
173175
saturation = saturation,
174176
lightness = lightness,

0 commit comments

Comments
 (0)