Skip to content

Commit 3919111

Browse files
syslogicsyslogic
committed
wrap content, in order to show the hue slider.
1 parent cc1d532 commit 3919111

File tree

4 files changed

+67
-52
lines changed

4 files changed

+67
-52
lines changed

‎library/src/main/java/io/syslogic/colorpicker/compose/ColorPickerComponent.kt

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -87,15 +87,15 @@ fun ColorPickerComponent(
8787
modifier = Modifier.fillMaxWidth()
8888
) {
8989

90-
/* HSV & ARGB */
90+
/* HSV & ARGB Values */
9191
if (showHSV || showARGB) {
9292
Row(
9393
verticalAlignment = Alignment.Top,
9494
modifier = Modifier
9595
.padding(all = rowPadding * 4)
9696
) {
9797

98-
/* HSV */
98+
/* HSV Values */
9999
if (showHSV) {
100100
Column(
101101
horizontalAlignment = Alignment.Start,
@@ -157,7 +157,7 @@ fun ColorPickerComponent(
157157
}
158158
}
159159

160-
/* ARGB */
160+
/* ARGB Values */
161161
if (showARGB) {
162162
Column(
163163
horizontalAlignment = Alignment.End,
@@ -250,7 +250,7 @@ fun ColorPickerComponent(
250250
it.setValue(currentVal)
251251
},
252252
modifier = Modifier
253-
.layoutId(SatVal)
253+
.layoutId(SatValPanel)
254254
.testTag("sat_val")
255255
.pointerInput(Unit) {
256256
detectDragGestures(
@@ -291,7 +291,7 @@ fun ColorPickerComponent(
291291
it.setValue(currentHue)
292292
},
293293
modifier = Modifier
294-
.layoutId(Hue)
294+
.layoutId(HuePanel)
295295
.testTag("hue")
296296
.pointerInput(Unit) {
297297
detectDragGestures(
@@ -336,7 +336,7 @@ fun ColorPickerComponent(
336336
it.setAlphaByColor(currentColor)
337337
},
338338
modifier = Modifier
339-
.layoutId(Alpha)
339+
.layoutId(AlphaPanel)
340340
.testTag("alpha")
341341
.pointerInput(Unit) {
342342
detectDragGestures(

‎library/src/main/java/io/syslogic/colorpicker/compose/ColorPickerDialog.kt

Lines changed: 50 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -3,27 +3,29 @@ package io.syslogic.colorpicker.compose
33
import androidx.compose.foundation.clickable
44
import androidx.compose.foundation.layout.*
55
import androidx.compose.foundation.shape.RoundedCornerShape
6-
76
import androidx.compose.material.*
87
import androidx.compose.material.icons.Icons
98
import androidx.compose.material.icons.filled.Close
10-
119
import androidx.compose.runtime.*
12-
1310
import androidx.compose.ui.Alignment
1411
import androidx.compose.ui.Modifier
1512
import androidx.compose.ui.graphics.Color
13+
import androidx.compose.ui.layout.layoutId
1614
import androidx.compose.ui.platform.LocalContext
1715
import androidx.compose.ui.platform.LocalDensity
16+
import androidx.compose.ui.platform.testTag
17+
import androidx.compose.ui.res.colorResource
1818
import androidx.compose.ui.res.dimensionResource
1919
import androidx.compose.ui.text.TextStyle
2020
import androidx.compose.ui.text.font.FontFamily
2121
import androidx.compose.ui.text.font.FontWeight
2222
import androidx.compose.ui.unit.Dp
2323
import androidx.compose.ui.window.Dialog
24+
import androidx.compose.ui.window.DialogProperties
2425

2526
import io.syslogic.colorpicker.OnColorChangedListener
2627
import io.syslogic.colorpicker.R
28+
import io.syslogic.colorpicker.compose.LayoutId.*
2729

2830
/**
2931
* Jetpack Compose Color-Picker Dialog
@@ -45,54 +47,64 @@ fun ColorPickerDialog(
4547
/* The value is being initialized by the `initialColor`. */
4648
val currentColor: Int by remember { mutableStateOf(initialColor.hashCode()) }
4749

48-
Dialog(onDismissRequest = { showDialog(false) }) {
50+
Dialog(
51+
onDismissRequest = {
52+
showDialog(false)
53+
},
54+
properties = DialogProperties()
55+
) {
4956
Surface(
5057
shape = RoundedCornerShape(dimensionResource(R.dimen.compose_dialog_border_radius)),
51-
color = Color.White
58+
color = colorResource(id = R.color.cardview_light_background),
59+
modifier = Modifier
60+
.layoutId(DialogSurface)
61+
.testTag("surface")
5262
) {
53-
Box(
54-
contentAlignment = Alignment.Center
63+
Column(
64+
modifier = Modifier
65+
.padding(dimensionResource(R.dimen.compose_dialog_column_padding))
5566
) {
56-
Column(
57-
modifier = Modifier
58-
.padding(dimensionResource(R.dimen.compose_dialog_column_padding))
59-
) {
6067

61-
Row(
62-
modifier = Modifier.fillMaxWidth(),
63-
horizontalArrangement = Arrangement.SpaceBetween,
64-
verticalAlignment = Alignment.CenterVertically
65-
) {
66-
Text(
67-
text = dialogTitle,
68-
style = TextStyle(
69-
fontSize = toSp(dp = dimensionResource(R.dimen.compose_dialog_title_font_size)),
70-
fontFamily = FontFamily.Default,
71-
fontWeight = FontWeight.Bold
72-
)
73-
)
74-
Icon(
75-
imageVector = Icons.Filled.Close,
76-
contentDescription = "",
77-
tint = Color.DarkGray,
78-
modifier = Modifier
79-
.width(dimensionResource(R.dimen.compose_dialog_close_icon_size))
80-
.height(dimensionResource(R.dimen.compose_dialog_close_icon_size))
81-
.clickable { showDialog(false) }
68+
Row(
69+
horizontalArrangement = Arrangement.SpaceBetween,
70+
verticalAlignment = Alignment.CenterVertically,
71+
modifier = Modifier.fillMaxWidth()
72+
) {
73+
Text(
74+
text = dialogTitle,
75+
style = TextStyle(
76+
fontSize = toSp(dp = dimensionResource(R.dimen.compose_dialog_title_font_size)),
77+
fontFamily = FontFamily.Default,
78+
fontWeight = FontWeight.Bold
8279
)
83-
}
84-
85-
Spacer(
86-
modifier = Modifier.height(dimensionResource(R.dimen.compose_dialog_spacer_height))
8780
)
81+
Icon(
82+
imageVector = Icons.Filled.Close,
83+
contentDescription = "",
84+
tint = Color.DarkGray,
85+
modifier = Modifier
86+
.width(dimensionResource(R.dimen.compose_dialog_close_icon_size))
87+
.height(dimensionResource(R.dimen.compose_dialog_close_icon_size))
88+
.clickable { showDialog(false) }
89+
)
90+
}
8891

92+
Spacer(
93+
modifier = Modifier.height(dimensionResource(R.dimen.compose_dialog_spacer_height))
94+
)
95+
96+
Box(
97+
modifier = Modifier
98+
.wrapContentHeight()
99+
.wrapContentWidth()
100+
) {
89101
ColorPickerComponent(
90102
initialColor = Color(currentColor),
91103
onColorChanged = onColorChanged,
92104
showAlpha = showAlpha,
93-
showARGB = showARGB,
105+
showHex = showHex,
94106
showHSV = showHSV,
95-
showHex = showHex
107+
showARGB = showARGB
96108
)
97109
}
98110
}

‎library/src/main/java/io/syslogic/colorpicker/compose/LayoutId.kt

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,12 @@ package io.syslogic.colorpicker.compose
66
* @author Martin Zeitler
77
*/
88
enum class LayoutId {
9-
Alpha,
10-
SatVal,
11-
Hue,
9+
AlphaPanel,
10+
SatValPanel,
11+
HuePanel,
12+
1213
OldColor,
13-
NewColor
14+
NewColor,
15+
16+
DialogSurface
1417
}

‎library/src/main/res/values/dimens.xml

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,10 +18,10 @@
1818
<dimen name="compose_argb_value_min_width">30dp</dimen>
1919

2020
<!-- ColorPickerDialog -->
21-
<dimen name="compose_dialog_border_radius">16dp</dimen>
22-
<dimen name="compose_dialog_column_padding">20dp</dimen>
23-
<dimen name="compose_dialog_spacer_height">20dp</dimen>
21+
<dimen name="compose_dialog_border_radius">4dp</dimen>
22+
<dimen name="compose_dialog_column_padding">6dp</dimen>
23+
<dimen name="compose_dialog_spacer_height">8dp</dimen>
24+
<dimen name="compose_dialog_title_font_size">22dp</dimen>
2425
<dimen name="compose_dialog_close_icon_size">30dp</dimen>
25-
<dimen name="compose_dialog_title_font_size">24dp</dimen>
2626

2727
</resources>

0 commit comments

Comments
 (0)