Skip to content

Commit 47bb3a3

Browse files
update selection texts and sliders
1 parent 3a99ea4 commit 47bb3a3

7 files changed

Lines changed: 112 additions & 39 deletions

File tree

app/src/main/java/com/smarttoolfactory/composecropper/preferences/SelctionWidgets.kt

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,48 @@ internal fun DpSliderSelection(
4949
)
5050
}
5151

52+
@Composable
53+
internal fun SliderWithValueSelection(
54+
modifier: Modifier = Modifier,
55+
value: Float,
56+
title: String = "",
57+
text: String,
58+
onValueChange: (Float) -> Unit,
59+
valueRange: ClosedFloatingPointRange<Float>,
60+
colors: MaterialSliderColors = MaterialSliderDefaults.materialColors(
61+
activeTrackColor = SliderBrushColor(MaterialTheme.colorScheme.primary),
62+
inactiveTrackColor = SliderBrushColor(Color.Transparent),
63+
thumbColor = SliderBrushColor(MaterialTheme.colorScheme.inversePrimary)
64+
)
65+
) {
66+
Column {
67+
68+
Text(
69+
text = if (title.isNotEmpty()) "$title $text" else text,
70+
fontSize = 12.sp,
71+
color = MaterialTheme.colorScheme.tertiary,
72+
fontWeight = FontWeight.Bold
73+
)
74+
75+
Row(
76+
modifier = modifier,
77+
verticalAlignment = Alignment.CenterVertically
78+
) {
79+
80+
ColorfulSlider(
81+
modifier = Modifier.weight(1f),
82+
value = value,
83+
onValueChange = onValueChange,
84+
valueRange = valueRange,
85+
colors = colors,
86+
trackHeight = 11.dp,
87+
thumbRadius = 14.dp
88+
)
89+
90+
91+
}
92+
}
93+
}
5294

5395
@Composable
5496
internal fun SliderSelection(

app/src/main/java/com/smarttoolfactory/composecropper/preferences/frames/edit/CropShapeAddDialog.kt

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
package com.smarttoolfactory.composecropper.preferences.frames.edit
22

33
import androidx.compose.material3.AlertDialog
4-
import androidx.compose.material3.Button
54
import androidx.compose.material3.Text
5+
import androidx.compose.material3.TextButton
66
import androidx.compose.runtime.*
77
import androidx.compose.ui.graphics.ImageBitmap
88
import androidx.compose.ui.res.imageResource
@@ -84,7 +84,7 @@ fun CropShapeAddDialog(
8484
}
8585
},
8686
confirmButton = {
87-
Button(onClick = {
87+
TextButton(onClick = {
8888

8989
val newOutlines: List<CropOutline> = cropFrame.outlines
9090
.toMutableList()
@@ -103,11 +103,11 @@ fun CropShapeAddDialog(
103103

104104
onConfirm(newCropFrame)
105105
}) {
106-
Text("OK")
106+
Text("Accept")
107107
}
108108
},
109109
dismissButton = {
110-
Button(onClick = { onDismiss() }) {
110+
TextButton(onClick = { onDismiss() }) {
111111
Text(text = "Cancel")
112112
}
113113
}

app/src/main/java/com/smarttoolfactory/composecropper/preferences/frames/edit/CutCornerCropShapeEdit.kt

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,19 @@ package com.smarttoolfactory.composecropper.preferences.frames.edit
33
import androidx.compose.foundation.layout.*
44
import androidx.compose.foundation.shape.CutCornerShape
55
import androidx.compose.material3.ExperimentalMaterial3Api
6-
import androidx.compose.material3.Slider
76
import androidx.compose.material3.TextField
87
import androidx.compose.runtime.*
98
import androidx.compose.ui.Modifier
109
import androidx.compose.ui.draw.clipToBounds
1110
import androidx.compose.ui.graphics.ImageBitmap
1211
import androidx.compose.ui.platform.LocalDensity
1312
import androidx.compose.ui.unit.dp
13+
import com.smarttoolfactory.composecropper.preferences.SliderWithValueSelection
1414
import com.smarttoolfactory.cropper.model.AspectRatio
1515
import com.smarttoolfactory.cropper.model.CornerRadiusProperties
1616
import com.smarttoolfactory.cropper.model.CutCornerCropShape
1717
import com.smarttoolfactory.cropper.util.drawOutlineWithBlendModeAndChecker
18+
import kotlin.math.roundToInt
1819

1920
@OptIn(ExperimentalMaterial3Api::class)
2021
@Composable
@@ -105,23 +106,31 @@ internal fun CutCornerCropShapeEdit(
105106

106107
Spacer(modifier=Modifier.height(10.dp))
107108

108-
Slider(
109+
SliderWithValueSelection(
109110
value = topStartPercent,
111+
title = "Top Start",
112+
text = "${(topStartPercent * 10f).roundToInt() / 10f}%",
110113
onValueChange = { topStartPercent = it },
111114
valueRange = 0f..100f
112115
)
113-
Slider(
116+
SliderWithValueSelection(
114117
value = topEndPercent,
118+
title = "Top End",
119+
text = "${(topEndPercent * 10f).roundToInt() / 10f}%",
115120
onValueChange = { topEndPercent = it },
116121
valueRange = 0f..100f
117122
)
118-
Slider(
123+
SliderWithValueSelection(
119124
value = bottomStartPercent,
125+
title = "Bottom Start",
126+
text = "${(bottomStartPercent * 10f).roundToInt() / 10f}%",
120127
onValueChange = { bottomStartPercent = it },
121128
valueRange = 0f..100f
122129
)
123-
Slider(
130+
SliderWithValueSelection(
124131
value = bottomEndPercent,
132+
title = "Bottom End",
133+
text = "${(bottomEndPercent * 10f).roundToInt() / 10f}%",
125134
onValueChange = { bottomEndPercent = it },
126135
valueRange = 0f..100f
127136
)

app/src/main/java/com/smarttoolfactory/composecropper/preferences/frames/edit/OvalCropShapeEdit.kt

Lines changed: 19 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ package com.smarttoolfactory.composecropper.preferences.frames.edit
33
import androidx.compose.foundation.layout.*
44
import androidx.compose.foundation.shape.GenericShape
55
import androidx.compose.material3.ExperimentalMaterial3Api
6-
import androidx.compose.material3.Slider
76
import androidx.compose.material3.TextField
87
import androidx.compose.runtime.*
98
import androidx.compose.ui.Modifier
@@ -15,6 +14,7 @@ import androidx.compose.ui.graphics.ImageBitmap
1514
import androidx.compose.ui.platform.LocalDensity
1615
import androidx.compose.ui.unit.LayoutDirection
1716
import androidx.compose.ui.unit.dp
17+
import com.smarttoolfactory.composecropper.preferences.SliderWithValueSelection
1818
import com.smarttoolfactory.cropper.model.AspectRatio
1919
import com.smarttoolfactory.cropper.model.OvalCropShape
2020
import com.smarttoolfactory.cropper.util.drawOutlineWithBlendModeAndChecker
@@ -120,26 +120,32 @@ internal fun OvalCropShapeEdit(
120120

121121
Spacer(modifier = Modifier.height(10.dp))
122122

123-
Slider(
123+
SliderWithValueSelection(
124124
value = startAngle,
125+
title = "Start Angle",
126+
text = "${startAngle.toInt()}°",
125127
onValueChange = { startAngle = it },
126128
valueRange = 0f..360f
127129
)
128-
Slider(
130+
SliderWithValueSelection(
129131
value = sweepAngle,
132+
title = "Sweep Angle",
133+
text = "${sweepAngle.toInt()}°",
130134
onValueChange = { sweepAngle = it },
131135
valueRange = 0f..360f
132136
)
133-
Slider(
134-
value = offsetX,
135-
onValueChange = { offsetX = it },
136-
valueRange = 0f..100f
137-
)
138-
Slider(
139-
value = offsetY,
140-
onValueChange = { offsetY = it },
141-
valueRange = 0f..100f
142-
)
137+
138+
// TODO Add offset
139+
// Slider(
140+
// value = offsetX,
141+
// onValueChange = { offsetX = it },
142+
// valueRange = 0f..100f
143+
// )
144+
// Slider(
145+
// value = offsetY,
146+
// onValueChange = { offsetY = it },
147+
// valueRange = 0f..100f
148+
// )
143149

144150
}
145151
}

app/src/main/java/com/smarttoolfactory/composecropper/preferences/frames/edit/PolygonCropShapeEdit.kt

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,14 +2,14 @@ package com.smarttoolfactory.composecropper.preferences.frames.edit
22

33
import androidx.compose.foundation.layout.*
44
import androidx.compose.material3.ExperimentalMaterial3Api
5-
import androidx.compose.material3.Slider
65
import androidx.compose.material3.TextField
76
import androidx.compose.runtime.*
87
import androidx.compose.ui.Modifier
98
import androidx.compose.ui.draw.clipToBounds
109
import androidx.compose.ui.graphics.ImageBitmap
1110
import androidx.compose.ui.platform.LocalDensity
1211
import androidx.compose.ui.unit.dp
12+
import com.smarttoolfactory.composecropper.preferences.SliderWithValueSelection
1313
import com.smarttoolfactory.cropper.model.AspectRatio
1414
import com.smarttoolfactory.cropper.model.PolygonCropShape
1515
import com.smarttoolfactory.cropper.util.createPolygonShape
@@ -85,17 +85,21 @@ internal fun PolygonCropShapeEdit(
8585

8686
Spacer(modifier = Modifier.height(10.dp))
8787

88-
Slider(
88+
SliderWithValueSelection(
8989
value = sides.toFloat(),
90+
title="Sides",
91+
text = "$sides",
9092
onValueChange = {
9193
sides = it.toInt()
9294
shape = createPolygonShape(sides = sides, angle)
9395
},
94-
valueRange = 3f..15f,
95-
steps = 10
96+
valueRange = 3f..15f
9697
)
97-
Slider(
98+
99+
SliderWithValueSelection(
98100
value = angle,
101+
title="Angle",
102+
text = "${angle.toInt()}°",
99103
onValueChange = {
100104
angle = it
101105
shape = createPolygonShape(sides = sides, degrees = angle)

app/src/main/java/com/smarttoolfactory/composecropper/preferences/frames/edit/RoundedCornerCropShapeEdit.kt

Lines changed: 14 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,18 +3,19 @@ package com.smarttoolfactory.composecropper.preferences.frames.edit
33
import androidx.compose.foundation.layout.*
44
import androidx.compose.foundation.shape.RoundedCornerShape
55
import androidx.compose.material3.ExperimentalMaterial3Api
6-
import androidx.compose.material3.Slider
76
import androidx.compose.material3.TextField
87
import androidx.compose.runtime.*
98
import androidx.compose.ui.Modifier
109
import androidx.compose.ui.draw.clipToBounds
1110
import androidx.compose.ui.graphics.ImageBitmap
1211
import androidx.compose.ui.platform.LocalDensity
1312
import androidx.compose.ui.unit.dp
13+
import com.smarttoolfactory.composecropper.preferences.SliderWithValueSelection
1414
import com.smarttoolfactory.cropper.model.AspectRatio
1515
import com.smarttoolfactory.cropper.model.CornerRadiusProperties
1616
import com.smarttoolfactory.cropper.model.RoundedCornerCropShape
1717
import com.smarttoolfactory.cropper.util.drawOutlineWithBlendModeAndChecker
18+
import kotlin.math.roundToInt
1819

1920
@OptIn(ExperimentalMaterial3Api::class)
2021
@Composable
@@ -105,23 +106,31 @@ internal fun RoundedCornerCropShapeEdit(
105106

106107
Spacer(modifier=Modifier.height(10.dp))
107108

108-
Slider(
109+
SliderWithValueSelection(
109110
value = topStartPercent,
111+
title = "Top Start",
112+
text = "${(topStartPercent * 10f).roundToInt() / 10f}%",
110113
onValueChange = { topStartPercent = it },
111114
valueRange = 0f..100f
112115
)
113-
Slider(
116+
SliderWithValueSelection(
114117
value = topEndPercent,
118+
title = "Top End",
119+
text = "${(topEndPercent * 10f).roundToInt() / 10f}%",
115120
onValueChange = { topEndPercent = it },
116121
valueRange = 0f..100f
117122
)
118-
Slider(
123+
SliderWithValueSelection(
119124
value = bottomStartPercent,
125+
title = "Bottom Start",
126+
text = "${(bottomStartPercent * 10f).roundToInt() / 10f}%",
120127
onValueChange = { bottomStartPercent = it },
121128
valueRange = 0f..100f
122129
)
123-
Slider(
130+
SliderWithValueSelection(
124131
value = bottomEndPercent,
132+
title = "Bottom End",
133+
text = "${(bottomEndPercent * 10f).roundToInt() / 10f}%",
125134
onValueChange = { bottomEndPercent = it },
126135
valueRange = 0f..100f
127136
)

cropper/src/main/java/com/smarttoolfactory/cropper/widget/CropFrameDisplayCard.kt

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ import androidx.compose.runtime.Composable
1515
import androidx.compose.runtime.remember
1616
import androidx.compose.ui.Alignment
1717
import androidx.compose.ui.Modifier
18-
import androidx.compose.ui.draw.clip
1918
import androidx.compose.ui.draw.drawWithCache
2019
import androidx.compose.ui.graphics.Color
2120
import androidx.compose.ui.graphics.drawOutline
@@ -88,16 +87,20 @@ fun CropFrameDisplayCard(
8887
scaleX = iconScale
8988
scaleY = iconScale
9089

91-
translationX = 20f
92-
translationY = -20f
93-
}
94-
.clip(CircleShape)
95-
.background(editButtonBackgroundColor)
96-
.fillMaxSize(.35f)
90+
val translation = this.density.run { 12.dp.toPx() }
91+
translationX = translation
92+
translationY = -translation
93+
clip = true
94+
shape = CircleShape
9795

96+
this.density
97+
}
9898
.clickable {
9999
onClick()
100100
}
101+
.padding(8.dp)
102+
.background(editButtonBackgroundColor, CircleShape)
103+
.size(20.dp)
101104
.padding(4.dp),
102105
imageVector = Icons.Default.Edit,
103106
tint = editButtonContentColor,

0 commit comments

Comments
 (0)