Skip to content

Commit c10d63f

Browse files
SmartToolFactorySmartToolFactory
committed
refactor and cleanup
1 parent 4901f22 commit c10d63f

File tree

8 files changed

+174
-52
lines changed

8 files changed

+174
-52
lines changed

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -21,11 +21,11 @@ Colorful Sliders to get familiar with.
2121
- [x] Add gradient rotation demo
2222
- [x] Add checker Composable/Modifier that draws checker pattern behind to display alpha
2323
- [x] Add console with interoperability between HSV, HSL and RGB(Conversion between color models)
24+
- [x] Add Rectangle Hue+Saturation/Value/Lightness HSV/HSL Selectors
25+
- [x] Add Circle Hue Saturation Selector
2426

2527
### TODOs:
2628

27-
- [ ] Add Rectangle Hue+Saturation/Value/Lightness HSV/HSL Selectors
28-
- [ ] Add Circle Hue Saturation Selector
2929
- [ ] Add option to display colors in a dialog
3030
- [ ] Add and display colors selected previously
3131
- [ ] Add gradient color selection with percentage stops, linear, radial and sweep options

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,7 @@ import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelHSL
2222
import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelHSV
2323
import com.smarttoolfactory.colorpicker.slider.SliderDisplayPanelRGBA
2424
import com.smarttoolfactory.colorpicker.widget.drawChecker
25+
import com.smarttoolfactory.composecolorpicker.ui.theme.backgroundColor
2526
import kotlin.math.roundToInt
2627

2728
/**
@@ -35,7 +36,7 @@ fun ColorModeConversionDemo() {
3536
modifier = Modifier
3637
.verticalScroll(rememberScrollState())
3738
.fillMaxSize()
38-
.background(Color.LightGray)
39+
.background(backgroundColor)
3940
.padding(vertical = 10.dp),
4041
horizontalAlignment = Alignment.CenterHorizontally
4142
) {

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

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import androidx.compose.ui.unit.sp
1818
import com.smarttoolfactory.colorpicker.slider.*
1919
import com.smarttoolfactory.colorpicker.ui.Blue400
2020
import com.smarttoolfactory.colorpicker.widget.drawChecker
21+
import com.smarttoolfactory.composecolorpicker.ui.theme.backgroundColor
2122

2223
@Composable
2324
fun ColorfulSliderDemo() {
@@ -26,7 +27,7 @@ fun ColorfulSliderDemo() {
2627
modifier = Modifier
2728
.verticalScroll(rememberScrollState())
2829
.fillMaxSize()
29-
.background(Color.LightGray)
30+
.background(backgroundColor)
3031
.padding(vertical = 10.dp),
3132
horizontalAlignment = Alignment.CenterHorizontally
3233
) {
@@ -64,7 +65,6 @@ fun ColorfulSliderDemo() {
6465
// Sliders with Circle Color display on left
6566
SliderCircleColorDisplayHSLExamples(modifier, sliderModifier)
6667
SliderCircleColorDisplayHSVExamples(modifier, sliderModifier)
67-
6868
}
6969
}
7070

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

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -136,8 +136,6 @@ private fun HuePickerHSVGradientExample(
136136
) {
137137
drawSaturationPointsInDiamond(sampleRate = 30, hsv = true)
138138
}
139-
140-
141139
}
142140

143141
@Composable

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

Lines changed: 49 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -43,6 +43,8 @@ fun SaturationSelectorDemo() {
4343
Spacer(modifier = Modifier.height(20.dp))
4444
SVSelectorWithHSVRectangleExample(cardModifier, selectorModifier)
4545
Spacer(modifier = Modifier.height(20.dp))
46+
SLSelectorWithHSLRectangleExample(cardModifier, selectorModifier)
47+
Spacer(modifier = Modifier.height(20.dp))
4648
HSSelectorHSVCircleExample(cardModifier, selectorModifier)
4749
Spacer(modifier = Modifier.height(20.dp))
4850
HSSelectorWithHSVRectangleExample(cardModifier, selectorModifier)
@@ -114,7 +116,7 @@ private fun SVSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
114116
SVSelectorRectHSV(
115117
modifier = Modifier
116118
.fillMaxWidth()
117-
.aspectRatio(4/3f),
119+
.aspectRatio(4 / 3f),
118120
hue = hue,
119121
saturation = saturation,
120122
value = value,
@@ -139,6 +141,48 @@ private fun SVSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
139141
}
140142
}
141143

144+
@Composable
145+
private fun SLSelectorWithHSLRectangleExample(modifier: Modifier, selectorModifier: Modifier) {
146+
147+
var hue by remember { mutableStateOf(0f) }
148+
var saturation by remember { mutableStateOf(.5f) }
149+
var lightness by remember { mutableStateOf(.5f) }
150+
var alpha by remember { mutableStateOf(1f) }
151+
152+
Title(text = "Saturation-Lightness Selector Rect HSL")
153+
154+
Column(
155+
modifier = modifier,
156+
horizontalAlignment = Alignment.CenterHorizontally
157+
) {
158+
SLSelectorRectHSL(
159+
modifier = Modifier
160+
.fillMaxWidth()
161+
.aspectRatio(4 / 3f),
162+
hue = hue,
163+
saturation = saturation,
164+
lightness = lightness,
165+
selectionRadius = 8.dp
166+
) { s, l ->
167+
saturation = s
168+
lightness = l
169+
}
170+
171+
SliderCircleColorDisplayHueHSL(
172+
hue = hue,
173+
saturation = saturation,
174+
lightness = lightness,
175+
alpha = alpha,
176+
onHueChange = {
177+
hue = it
178+
},
179+
onAlphaChange = {
180+
alpha = it
181+
}
182+
)
183+
}
184+
}
185+
142186
@Composable
143187
private fun HSSelectorHSVCircleExample(modifier: Modifier, selectorModifier: Modifier) {
144188
var hue by remember { mutableStateOf(0f) }
@@ -195,7 +239,7 @@ private fun HSSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
195239
HueSaturationSelectorRectHSV(
196240
modifier = Modifier
197241
.fillMaxWidth()
198-
.aspectRatio(4/3f),
242+
.aspectRatio(4 / 3f),
199243
hue = hue,
200244
saturation = saturation,
201245
onChange = { h, s ->
@@ -237,7 +281,7 @@ private fun HVSelectorWithHSVRectangleExample(modifier: Modifier, selectorModifi
237281
HueValueSelectorRectHSV(
238282
modifier = Modifier
239283
.fillMaxWidth()
240-
.aspectRatio(4/3f),
284+
.aspectRatio(4 / 3f),
241285
hue = hue,
242286
value = value,
243287
onChange = { h, v ->
@@ -279,7 +323,7 @@ private fun HSSelectorWithHSLRectangleExample(modifier: Modifier, selectorModifi
279323
HueSaturationSelectorRectHSL(
280324
modifier = Modifier
281325
.fillMaxWidth()
282-
.aspectRatio(4/3f),
326+
.aspectRatio(4 / 3f),
283327
hue = hue,
284328
saturation = saturation,
285329
onChange = { h, s ->
@@ -321,7 +365,7 @@ private fun HLSelectorWithHSLRectangleExample(modifier: Modifier, selectorModifi
321365
HueLightnessSelectorRectHSL(
322366
modifier = Modifier
323367
.fillMaxWidth()
324-
.aspectRatio(4/3f),
368+
.aspectRatio(4 / 3f),
325369
hue = hue,
326370
lightness = lightness,
327371
onChange = { h, l ->

‎colorpicker/src/main/java/com/smarttoolfactory/colorpicker/DrawUtil.kt‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,11 +18,12 @@ fun DrawScope.drawBlendingRectGradient(
1818
src: Brush,
1919
srcTopLeft: Offset = Offset.Zero,
2020
srcSize: Size = this.size,
21+
blendMode: BlendMode = BlendMode.Multiply
2122
) {
2223
with(drawContext.canvas.nativeCanvas) {
2324
val checkPoint = saveLayer(null, null)
2425
drawRect(dst, dstTopLeft, dstSize)
25-
drawRect(src, srcTopLeft, srcSize, blendMode = BlendMode.Multiply)
26+
drawRect(src, srcTopLeft, srcSize, blendMode = blendMode)
2627
restoreToCount(checkPoint)
2728
}
2829
}

‎colorpicker/src/main/java/com/smarttoolfactory/colorpicker/selector/HueLightnessValueSelectorRect.kt‎

Lines changed: 40 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,12 @@
11
package com.smarttoolfactory.colorpicker.selector
22

33
import androidx.compose.foundation.Canvas
4-
import androidx.compose.foundation.background
54
import androidx.compose.foundation.layout.BoxWithConstraints
65
import androidx.compose.foundation.layout.fillMaxSize
76
import androidx.compose.runtime.*
87
import androidx.compose.ui.Modifier
98
import androidx.compose.ui.geometry.Offset
109
import androidx.compose.ui.graphics.Brush
11-
import androidx.compose.ui.graphics.Color
1210
import androidx.compose.ui.input.pointer.consumeDownChange
1311
import androidx.compose.ui.input.pointer.consumePositionChange
1412
import androidx.compose.ui.platform.LocalDensity
@@ -41,12 +39,16 @@ fun HueValueSelectorRectHSV(
4139
val selectorType = SelectorType.HVWithHSV
4240

4341
// Red, Magenta, Blue, Cyan, Green, Yellow, Red
44-
val colorScaleHSLGradient = Brush.linearGradient(
45-
colors = gradientColorScaleHSV,
46-
start = Offset.Zero,
47-
end = Offset(Float.POSITIVE_INFINITY, 0f)
48-
)
49-
val transparentToBlackGradient = transparentToBlackVerticalGradient()
42+
val colorScaleHSLGradient = remember {
43+
Brush.linearGradient(
44+
colors = gradientColorScaleHSV,
45+
start = Offset.Zero,
46+
end = Offset(Float.POSITIVE_INFINITY, 0f)
47+
)
48+
}
49+
val transparentToBlackGradient = remember {
50+
transparentToBlackVerticalGradient()
51+
}
5052

5153
SelectorRectangle(
5254
modifier = modifier,
@@ -80,12 +82,16 @@ fun HueSaturationSelectorRectHSV(
8082
val selectorType = SelectorType.HSWithHSV
8183

8284
// Red, Magenta, Blue, Cyan, Green, Yellow, Red
83-
val colorScaleHSLGradient = Brush.linearGradient(
84-
colors = gradientColorScaleHSV,
85-
start = Offset.Zero,
86-
end = Offset(Float.POSITIVE_INFINITY, 0f)
87-
)
88-
val transparentToWhiteGradient = transparentToWhiteVerticalGradient()
85+
val colorScaleHSLGradient = remember {
86+
Brush.linearGradient(
87+
colors = gradientColorScaleHSV,
88+
start = Offset.Zero,
89+
end = Offset(Float.POSITIVE_INFINITY, 0f)
90+
)
91+
}
92+
val transparentToWhiteGradient = remember {
93+
transparentToWhiteVerticalGradient()
94+
}
8995

9096
SelectorRectangle(
9197
modifier = modifier,
@@ -121,12 +127,16 @@ fun HueSaturationSelectorRectHSL(
121127
val selectorType = SelectorType.HSWithHSL
122128

123129
// Red, Magenta, Blue, Cyan, Green, Yellow, Red
124-
val colorScaleHSLGradient = Brush.linearGradient(
125-
colors = gradientColorScaleHSL,
126-
start = Offset.Zero,
127-
end = Offset(Float.POSITIVE_INFINITY, 0f)
128-
)
129-
val transparentToGrayGradient = transparentToGrayVerticalGradient()
130+
val colorScaleHSLGradient = remember {
131+
Brush.linearGradient(
132+
colors = gradientColorScaleHSL,
133+
start = Offset.Zero,
134+
end = Offset(Float.POSITIVE_INFINITY, 0f)
135+
)
136+
}
137+
val transparentToGrayGradient = remember {
138+
transparentToGrayVerticalGradient()
139+
}
130140

131141
SelectorRectangle(
132142
modifier = modifier,
@@ -160,12 +170,16 @@ fun HueLightnessSelectorRectHSL(
160170
val selectorType = SelectorType.HLWithHSL
161171

162172
// Red, Magenta, Blue, Cyan, Green, Yellow, Red
163-
val colorScaleHSLGradient = Brush.linearGradient(
164-
colors = gradientColorScaleHSL,
165-
start = Offset.Zero,
166-
end = Offset(Float.POSITIVE_INFINITY, 0f)
167-
)
168-
val transitionGradient = whiteToTransparentToBlackVerticalGradient()
173+
val colorScaleHSLGradient = remember {
174+
Brush.linearGradient(
175+
colors = gradientColorScaleHSL,
176+
start = Offset.Zero,
177+
end = Offset(Float.POSITIVE_INFINITY, 0f)
178+
)
179+
}
180+
val transitionGradient = remember {
181+
whiteToTransparentToBlackVerticalGradient()
182+
}
169183

170184
SelectorRectangle(
171185
modifier = modifier,

0 commit comments

Comments
 (0)