Skip to content

Commit 5295b84

Browse files
author
Robert Ehrhardt
committed
feat: refactor popup content builder and add BarPopupData
- Rename `contentBuilderFunction` to `valueFormatter` for more clarity. - Introduce `BarPopupData` to encapsulate bar data, rect, and indices. - Update click and long-click callbacks to use `BarPopupData`. - Update docs to match new `valueFormatter` name. - Remove contentBuilder from deprecated properties.
1 parent e07a91f commit 5295b84

File tree

9 files changed

+151
-102
lines changed

9 files changed

+151
-102
lines changed

app/src/commonMain/kotlin/ir/ehsannarmani/compose_charts/ui/ColumnSample.kt

Lines changed: 15 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,16 @@ import androidx.compose.ui.unit.dp
2323
import androidx.compose.ui.unit.sp
2424
import ir.ehsannarmani.compose_charts.ColumnChart
2525
import ir.ehsannarmani.compose_charts.extensions.format
26-
import ir.ehsannarmani.compose_charts.models.*
26+
import ir.ehsannarmani.compose_charts.models.AnimationMode
27+
import ir.ehsannarmani.compose_charts.models.BarProperties
28+
import ir.ehsannarmani.compose_charts.models.Bars
29+
import ir.ehsannarmani.compose_charts.models.GridProperties
30+
import ir.ehsannarmani.compose_charts.models.HorizontalIndicatorProperties
31+
import ir.ehsannarmani.compose_charts.models.IndicatorCount
32+
import ir.ehsannarmani.compose_charts.models.IndicatorPosition
33+
import ir.ehsannarmani.compose_charts.models.LabelHelperProperties
34+
import ir.ehsannarmani.compose_charts.models.LabelProperties
35+
import ir.ehsannarmani.compose_charts.models.PopupProperties
2736

2837

2938
val columnGridProperties = GridProperties(
@@ -155,17 +164,17 @@ fun RowScope.ColumnSample() {
155164
color = Color.White,
156165
fontFamily = ubuntu,
157166
),
158-
contentBuilderFunction = { dataIndex, valueIndex, value ->
167+
valueFormatter = { dataIndex, valueIndex, value ->
159168
value.format(1) + " Million" + " - dataIdx: " + dataIndex + ", valueIdx: " + valueIndex
160169
},
161170
containerColor = Color(0xff414141),
162171
),
163172
labelHelperProperties = LabelHelperProperties(textStyle = TextStyle(fontSize = 12.sp, fontFamily = ubuntu, color = Color.White)),
164-
onBarClick = { bar, indices ->
165-
println(bar)
173+
onBarClick = { popupData ->
174+
println(popupData.bar)
166175
},
167-
onBarLongClick = { bar, indices ->
168-
println("long: $bar")
176+
onBarLongClick = { popupData ->
177+
println("long: ${popupData.bar}")
169178
}
170179
)
171180
}

app/src/commonMain/kotlin/ir/ehsannarmani/compose_charts/ui/LineSample.kt

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,19 @@ import androidx.compose.ui.unit.dp
2323
import androidx.compose.ui.unit.sp
2424
import ir.ehsannarmani.compose_charts.LineChart
2525
import ir.ehsannarmani.compose_charts.extensions.format
26-
import ir.ehsannarmani.compose_charts.models.*
26+
import ir.ehsannarmani.compose_charts.models.AnimationMode
27+
import ir.ehsannarmani.compose_charts.models.DividerProperties
28+
import ir.ehsannarmani.compose_charts.models.DotProperties
29+
import ir.ehsannarmani.compose_charts.models.DrawStyle
30+
import ir.ehsannarmani.compose_charts.models.GridProperties
31+
import ir.ehsannarmani.compose_charts.models.HorizontalIndicatorProperties
32+
import ir.ehsannarmani.compose_charts.models.LabelHelperProperties
33+
import ir.ehsannarmani.compose_charts.models.LabelProperties
34+
import ir.ehsannarmani.compose_charts.models.Line
35+
import ir.ehsannarmani.compose_charts.models.LineProperties
36+
import ir.ehsannarmani.compose_charts.models.PopupProperties
37+
import ir.ehsannarmani.compose_charts.models.StrokeStyle
38+
import ir.ehsannarmani.compose_charts.models.ZeroLineProperties
2739

2840
val gridProperties = GridProperties(
2941
xAxisProperties = GridProperties.AxisProperties(
@@ -308,7 +320,7 @@ fun RowScope.LineSample3() {
308320
fontFamily = ubuntu
309321
),
310322
mode = PopupProperties.Mode.PointMode(),
311-
contentBuilderFunction = { dataIndex, valueIndex, value ->
323+
valueFormatter = { dataIndex, valueIndex, value ->
312324
value.format(1) + " Million" + " - dataIdx: " + dataIndex + ", valueIdx: " + valueIndex
313325
},
314326
containerColor = Color(0xff414141)

app/src/commonMain/kotlin/ir/ehsannarmani/compose_charts/ui/RowSample.kt

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,15 @@ import androidx.compose.ui.unit.dp
2424
import androidx.compose.ui.unit.sp
2525
import ir.ehsannarmani.compose_charts.RowChart
2626
import ir.ehsannarmani.compose_charts.extensions.format
27-
import ir.ehsannarmani.compose_charts.models.*
27+
import ir.ehsannarmani.compose_charts.models.AnimationMode
28+
import ir.ehsannarmani.compose_charts.models.BarProperties
29+
import ir.ehsannarmani.compose_charts.models.Bars
30+
import ir.ehsannarmani.compose_charts.models.GridProperties
31+
import ir.ehsannarmani.compose_charts.models.IndicatorCount
32+
import ir.ehsannarmani.compose_charts.models.LabelHelperProperties
33+
import ir.ehsannarmani.compose_charts.models.LabelProperties
34+
import ir.ehsannarmani.compose_charts.models.PopupProperties
35+
import ir.ehsannarmani.compose_charts.models.VerticalIndicatorProperties
2836

2937
val rowGridProperties = GridProperties(
3038
enabled = true,
@@ -161,7 +169,7 @@ fun RowScope.RowSample() {
161169
color = Color.White,
162170
fontFamily = ubuntu,
163171
),
164-
contentBuilderFunction = { dataIndex, valueIndex, value ->
172+
valueFormatter = { dataIndex, valueIndex, value ->
165173
value.format(1) + " Million" + " - dataIdx: " + dataIndex + ", valueIdx: " + valueIndex
166174
},
167175
containerColor = Color(0xff414141),
@@ -372,7 +380,7 @@ fun RowScope.RowSample2() {
372380
color = Color.White,
373381
fontFamily = ubuntu,
374382
),
375-
contentBuilderFunction = { dataIndex, valueIndex, value ->
383+
valueFormatter = { dataIndex, valueIndex, value ->
376384
value.format(1) + " Million" + " - dataIdx: " + dataIndex + ", valueIdx: " + valueIndex
377385
},
378386
containerColor = Color(0xff414141),
@@ -444,7 +452,7 @@ fun RowScope.RowSample3() {
444452
color = Color.White,
445453
fontFamily = ubuntu,
446454
),
447-
contentBuilderFunction = { dataIndex, valueIndex, value ->
455+
valueFormatter = { dataIndex, valueIndex, value ->
448456
value.format(1) + " Million" + " - dataIdx: " + dataIndex + ", valueIdx: " + valueIndex
449457
},
450458
containerColor = Color(0xff414141),

compose-charts/src/commonMain/kotlin/ir/ehsannarmani/compose_charts/ColumnChart.kt

Lines changed: 30 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -45,6 +45,7 @@ import ir.ehsannarmani.compose_charts.extensions.drawGridLines
4545
import ir.ehsannarmani.compose_charts.extensions.spaceBetween
4646
import ir.ehsannarmani.compose_charts.extensions.split
4747
import ir.ehsannarmani.compose_charts.models.AnimationMode
48+
import ir.ehsannarmani.compose_charts.models.BarPopupData
4849
import ir.ehsannarmani.compose_charts.models.BarProperties
4950
import ir.ehsannarmani.compose_charts.models.Bars
5051
import ir.ehsannarmani.compose_charts.models.DividerProperties
@@ -70,8 +71,8 @@ fun ColumnChart(
7071
modifier: Modifier = Modifier,
7172
data: List<Bars>,
7273
barProperties: BarProperties = BarProperties(),
73-
onBarClick: ((Bars.Data, Pair<Int, Int>) -> Unit)? = null,
74-
onBarLongClick: ((Bars.Data, Pair<Int, Int>) -> Unit)? = null,
74+
onBarClick: ((BarPopupData) -> Unit)? = null,
75+
onBarLongClick: ((BarPopupData) -> Unit)? = null,
7576
labelProperties: LabelProperties = LabelProperties(
7677
textStyle = TextStyle.Default,
7778
enabled = true
@@ -116,7 +117,7 @@ fun ColumnChart(
116117
}
117118

118119
val barWithRect = remember {
119-
mutableStateListOf<Triple<Bars.Data, Rect, Pair<Int, Int>>>()
120+
mutableStateListOf<BarPopupData>()
120121
}
121122

122123
val selectedValue = remember {
@@ -191,19 +192,19 @@ fun ColumnChart(
191192
if (popupProperties.enabled) {
192193
detectHorizontalDragGestures { change, dragAmount ->
193194
barWithRect
194-
.lastOrNull { (_, rect, _ ) ->
195-
change.position.x in rect.left..rect.right
195+
.lastOrNull { popupData ->
196+
change.position.x in popupData.rect.left..popupData.rect.right
196197
}
197-
?.let { (bar, rect, indices) ->
198+
?.let { popupData ->
198199
selectedValue.value = SelectedBar(
199-
bar = bar,
200-
rect = rect,
200+
bar = popupData.bar,
201+
rect = popupData.rect,
201202
offset = Offset(
202-
rect.left,
203-
if (bar.value < 0) rect.bottom else rect.top
203+
popupData.rect.left,
204+
if (popupData.bar.value < 0) popupData.rect.bottom else popupData.rect.top
204205
),
205-
dataIndex = indices.first,
206-
valueIndex = indices.second
206+
dataIndex = popupData.dataIndex,
207+
valueIndex = popupData.valueIndex
207208
)
208209
scope.launch {
209210
if (popupAnimation.value != 1f && !popupAnimation.isRunning) {
@@ -222,20 +223,20 @@ fun ColumnChart(
222223
onTap = {
223224
val position = Offset(it.x, it.y)
224225
barWithRect
225-
.lastOrNull { (_, rect, _) ->
226-
rect.contains(position)
226+
.lastOrNull { popupData ->
227+
popupData.rect.contains(position)
227228
}
228-
?.let { (bar, rect, indices) ->
229+
?.let { popupData ->
229230
if (popupProperties.enabled) {
230231
selectedValue.value = SelectedBar(
231-
bar = bar,
232-
rect = rect,
232+
bar = popupData.bar,
233+
rect = popupData.rect,
233234
offset = Offset(
234-
rect.left,
235-
if (bar.value < 0) rect.bottom else rect.top
235+
popupData.rect.left,
236+
if (popupData.bar.value < 0) popupData.rect.bottom else popupData.rect.top
236237
),
237-
dataIndex = indices.first,
238-
valueIndex = indices.second
238+
dataIndex = popupData.dataIndex,
239+
valueIndex = popupData.valueIndex
239240
)
240241
scope.launch {
241242
popupAnimation.snapTo(0f)
@@ -245,17 +246,17 @@ fun ColumnChart(
245246
)
246247
}
247248
}
248-
onBarClick?.invoke(bar, indices)
249+
onBarClick?.invoke(popupData)
249250
}
250251
},
251252
onLongPress = {
252253
val position = Offset(it.x, it.y)
253254
barWithRect
254-
.lastOrNull { (_, rect, indices) ->
255-
rect.contains(position)
255+
.lastOrNull { popupData ->
256+
popupData.rect.contains(position)
256257
}
257-
?.let { (bar, _, indices) ->
258-
onBarLongClick?.invoke(bar, indices)
258+
?.let { popupData ->
259+
onBarLongClick?.invoke(popupData)
259260
}
260261
}
261262
)
@@ -333,8 +334,8 @@ fun ColumnChart(
333334
height = barHeight.absoluteValue.toFloat()
334335
),
335336
)
336-
if (barWithRect.none { it.second == rect }) {
337-
barWithRect.add(Triple(col, rect, Pair(dataIndex, valueIndex)))
337+
if (barWithRect.none { it.rect == rect }) {
338+
barWithRect.add(BarPopupData(col, rect, dataIndex, valueIndex))
338339
}
339340
val path = Path()
340341

@@ -394,7 +395,7 @@ private fun DrawScope.drawPopup(
394395
progress: Float,
395396
) {
396397
val measure = textMeasurer.measure(
397-
properties.contentBuilderFunction(selectedBar.dataIndex, selectedBar.valueIndex, selectedBar.bar.value),
398+
properties.valueFormatter(selectedBar.dataIndex, selectedBar.valueIndex, selectedBar.bar.value),
398399
style = properties.textStyle.copy(
399400
color = properties.textStyle.color.copy(
400401
alpha = 1f * progress

compose-charts/src/commonMain/kotlin/ir/ehsannarmani/compose_charts/LineChart.kt

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,20 +4,23 @@ import androidx.compose.animation.core.Animatable
44
import androidx.compose.animation.core.AnimationVector1D
55
import androidx.compose.animation.core.tween
66
import androidx.compose.foundation.Canvas
7-
import androidx.compose.foundation.gestures.detectDragGestures
87
import androidx.compose.foundation.gestures.detectHorizontalDragGestures
9-
import androidx.compose.foundation.gestures.forEachGesture
108
import androidx.compose.foundation.layout.Arrangement
119
import androidx.compose.foundation.layout.Column
1210
import androidx.compose.foundation.layout.Row
1311
import androidx.compose.foundation.layout.Spacer
1412
import androidx.compose.foundation.layout.fillMaxHeight
1513
import androidx.compose.foundation.layout.fillMaxSize
1614
import androidx.compose.foundation.layout.height
17-
import androidx.compose.foundation.layout.padding
1815
import androidx.compose.foundation.layout.width
1916
import androidx.compose.foundation.text.BasicText
20-
import androidx.compose.runtime.*
17+
import androidx.compose.runtime.Composable
18+
import androidx.compose.runtime.CompositionLocalProvider
19+
import androidx.compose.runtime.LaunchedEffect
20+
import androidx.compose.runtime.mutableFloatStateOf
21+
import androidx.compose.runtime.mutableStateListOf
22+
import androidx.compose.runtime.remember
23+
import androidx.compose.runtime.rememberCoroutineScope
2124
import androidx.compose.ui.Modifier
2225
import androidx.compose.ui.geometry.CornerRadius
2326
import androidx.compose.ui.geometry.Offset
@@ -31,20 +34,18 @@ import androidx.compose.ui.graphics.PathMeasure
3134
import androidx.compose.ui.graphics.SolidColor
3235
import androidx.compose.ui.graphics.drawscope.DrawScope
3336
import androidx.compose.ui.graphics.drawscope.Stroke
34-
import androidx.compose.ui.input.nestedscroll.NestedScrollConnection
35-
import androidx.compose.ui.input.nestedscroll.NestedScrollSource
36-
import androidx.compose.ui.input.nestedscroll.nestedScroll
37-
import androidx.compose.ui.input.pointer.PointerInputChange
38-
import androidx.compose.ui.input.pointer.PointerInputScope
39-
import androidx.compose.ui.input.pointer.consumeAllChanges
4037
import androidx.compose.ui.input.pointer.pointerInput
4138
import androidx.compose.ui.platform.LocalDensity
4239
import androidx.compose.ui.platform.LocalLayoutDirection
4340
import androidx.compose.ui.text.TextMeasurer
4441
import androidx.compose.ui.text.TextStyle
4542
import androidx.compose.ui.text.drawText
4643
import androidx.compose.ui.text.rememberTextMeasurer
47-
import androidx.compose.ui.unit.*
44+
import androidx.compose.ui.unit.Dp
45+
import androidx.compose.ui.unit.LayoutDirection
46+
import androidx.compose.ui.unit.dp
47+
import androidx.compose.ui.unit.sp
48+
import androidx.compose.ui.unit.toSize
4849
import ir.ehsannarmani.compose_charts.components.LabelHelper
4950
import ir.ehsannarmani.compose_charts.extensions.drawGridLines
5051
import ir.ehsannarmani.compose_charts.extensions.line_chart.PathData
@@ -70,7 +71,6 @@ import ir.ehsannarmani.compose_charts.utils.calculateOffset
7071
import kotlinx.coroutines.CoroutineScope
7172
import kotlinx.coroutines.delay
7273
import kotlinx.coroutines.launch
73-
import kotlin.math.abs
7474

7575
private data class Popup(
7676
val properties: PopupProperties,
@@ -562,7 +562,7 @@ private fun DrawScope.drawPopup(
562562
val offset = popup.position
563563
val popupProperties = popup.properties
564564
val measureResult = textMeasurer.measure(
565-
popupProperties.contentBuilderFunction(popup.dataIndex, popup.valueIndex, popup.value),
565+
popupProperties.valueFormatter(popup.dataIndex, popup.valueIndex, popup.value),
566566
style = popupProperties.textStyle.copy(
567567
color = popupProperties.textStyle.color.copy(
568568
alpha = 1f * progress

0 commit comments

Comments
 (0)