Skip to content

Commit 9a1983c

Browse files
sds100sds100
committed
fix: truncate various chips and breadcrumbs
1 parent acddde8 commit 9a1983c

5 files changed

Lines changed: 240 additions & 184 deletions

File tree

‎app/src/main/java/io/github/sds100/keymapper/groups/DeleteGroupDialog.kt‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import androidx.compose.material3.TextButton
77
import androidx.compose.runtime.Composable
88
import androidx.compose.ui.Modifier
99
import androidx.compose.ui.res.stringResource
10+
import androidx.compose.ui.text.style.TextOverflow
1011
import io.github.sds100.keymapper.R
1112

1213
@Composable
@@ -23,8 +24,10 @@ fun DeleteGroupDialog(
2324
Text(
2425
stringResource(
2526
R.string.home_key_maps_delete_group_dialog_title,
26-
groupName.take(50),
27+
groupName,
2728
),
29+
maxLines = 3,
30+
overflow = TextOverflow.Ellipsis,
2831
)
2932
},
3033
text = {

‎app/src/main/java/io/github/sds100/keymapper/groups/GroupBreadcrumbRow.kt‎

Lines changed: 45 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,12 @@
11
package io.github.sds100.keymapper.groups
22

3+
import androidx.compose.foundation.horizontalScroll
4+
import androidx.compose.foundation.layout.BoxWithConstraints
35
import androidx.compose.foundation.layout.Row
6+
import androidx.compose.foundation.layout.fillMaxWidth
47
import androidx.compose.foundation.layout.padding
8+
import androidx.compose.foundation.layout.widthIn
9+
import androidx.compose.foundation.rememberScrollState
510
import androidx.compose.material.icons.Icons
611
import androidx.compose.material.icons.automirrored.rounded.KeyboardArrowRight
712
import androidx.compose.material3.Icon
@@ -12,9 +17,12 @@ import androidx.compose.material3.Surface
1217
import androidx.compose.material3.Text
1318
import androidx.compose.runtime.Composable
1419
import androidx.compose.runtime.CompositionLocalProvider
20+
import androidx.compose.runtime.LaunchedEffect
1521
import androidx.compose.ui.Modifier
1622
import androidx.compose.ui.graphics.Color
23+
import androidx.compose.ui.platform.LocalDensity
1724
import androidx.compose.ui.res.stringResource
25+
import androidx.compose.ui.text.style.TextOverflow
1826
import androidx.compose.ui.unit.dp
1927
import io.github.sds100.keymapper.R
2028

@@ -25,28 +33,47 @@ fun GroupBreadcrumbRow(
2533
onGroupClick: (String?) -> Unit,
2634
enabled: Boolean = true,
2735
) {
28-
Row(modifier = modifier) {
29-
val color = LocalContentColor.current.copy(alpha = 0.7f)
30-
Breadcrumb(
31-
text = stringResource(R.string.home_groups_breadcrumb_home),
32-
onClick = { onGroupClick(null) },
33-
color = color,
34-
enabled = enabled,
35-
)
36+
val scrollState = rememberScrollState()
37+
38+
LaunchedEffect(groups) {
39+
scrollState.animateScrollTo(scrollState.maxValue)
40+
}
3641

37-
for ((index, group) in groups.withIndex()) {
38-
Icon(imageVector = Icons.AutoMirrored.Rounded.KeyboardArrowRight, null, tint = color)
42+
BoxWithConstraints(modifier = modifier) {
43+
val maxCrumbWidth = constraints.maxWidth / 3
44+
Row(
45+
modifier = Modifier
46+
.fillMaxWidth()
47+
.horizontalScroll(scrollState),
3948

49+
) {
50+
val color = LocalContentColor.current.copy(alpha = 0.7f)
4051
Breadcrumb(
41-
text = group.name,
42-
onClick = { onGroupClick(group.uid) },
43-
color = if (index == groups.lastIndex) {
44-
LocalContentColor.current
45-
} else {
46-
color
47-
},
52+
text = stringResource(R.string.home_groups_breadcrumb_home),
53+
onClick = { onGroupClick(null) },
54+
color = color,
4855
enabled = enabled,
4956
)
57+
58+
for ((index, group) in groups.withIndex()) {
59+
Icon(
60+
imageVector = Icons.AutoMirrored.Rounded.KeyboardArrowRight,
61+
null,
62+
tint = color,
63+
)
64+
65+
Breadcrumb(
66+
modifier = Modifier.widthIn(max = LocalDensity.current.run { maxCrumbWidth.toDp() }),
67+
text = group.name,
68+
onClick = { onGroupClick(group.uid) },
69+
color = if (index == groups.lastIndex) {
70+
LocalContentColor.current
71+
} else {
72+
color
73+
},
74+
enabled = enabled,
75+
)
76+
}
5077
}
5178
}
5279
}
@@ -75,6 +102,7 @@ private fun Breadcrumb(
75102
style = MaterialTheme.typography.labelMedium,
76103
color = color,
77104
maxLines = 1,
105+
overflow = TextOverflow.Ellipsis,
78106
)
79107
}
80108
}

‎app/src/main/java/io/github/sds100/keymapper/groups/GroupConstraintRow.kt‎

Lines changed: 90 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,15 @@ package io.github.sds100.keymapper.groups
22

33
import androidx.compose.foundation.BorderStroke
44
import androidx.compose.foundation.layout.Arrangement
5+
import androidx.compose.foundation.layout.BoxWithConstraints
56
import androidx.compose.foundation.layout.FlowRow
67
import androidx.compose.foundation.layout.Row
78
import androidx.compose.foundation.layout.Spacer
89
import androidx.compose.foundation.layout.heightIn
910
import androidx.compose.foundation.layout.padding
1011
import androidx.compose.foundation.layout.size
1112
import androidx.compose.foundation.layout.width
13+
import androidx.compose.foundation.layout.widthIn
1214
import androidx.compose.foundation.rememberScrollState
1315
import androidx.compose.foundation.verticalScroll
1416
import androidx.compose.material.icons.Icons
@@ -29,8 +31,10 @@ import androidx.compose.ui.Alignment
2931
import androidx.compose.ui.Modifier
3032
import androidx.compose.ui.graphics.Color
3133
import androidx.compose.ui.platform.LocalContext
34+
import androidx.compose.ui.platform.LocalDensity
3235
import androidx.compose.ui.res.pluralStringResource
3336
import androidx.compose.ui.res.stringResource
37+
import androidx.compose.ui.text.style.TextOverflow
3438
import androidx.compose.ui.tooling.preview.Preview
3539
import androidx.compose.ui.unit.dp
3640
import com.google.accompanist.drawablepainter.rememberDrawablePainter
@@ -54,88 +58,96 @@ fun GroupConstraintRow(
5458
onFixConstraintClick: (Error) -> Unit = {},
5559
enabled: Boolean = true,
5660
) {
57-
FlowRow(
58-
modifier.verticalScroll(rememberScrollState()),
59-
verticalArrangement = Arrangement.spacedBy(8.dp),
60-
horizontalArrangement = Arrangement.spacedBy(8.dp),
61-
itemVerticalAlignment = Alignment.CenterVertically,
62-
) {
63-
NewConstraintButton(
64-
onClick = onNewConstraintClick,
65-
showText = constraints.isEmpty(),
66-
enabled = enabled,
67-
)
61+
BoxWithConstraints(modifier = modifier) {
62+
val maxChipWidth = LocalDensity.current.run {
63+
(this@BoxWithConstraints.constraints.maxWidth / 2).toDp()
64+
}
65+
66+
FlowRow(
67+
Modifier.verticalScroll(rememberScrollState()),
68+
verticalArrangement = Arrangement.spacedBy(8.dp),
69+
horizontalArrangement = Arrangement.spacedBy(8.dp),
70+
itemVerticalAlignment = Alignment.CenterVertically,
71+
) {
72+
NewConstraintButton(
73+
onClick = onNewConstraintClick,
74+
showText = constraints.isEmpty(),
75+
enabled = enabled,
76+
)
6877

69-
for ((index, constraint) in constraints.withIndex()) {
70-
when (constraint) {
71-
is ComposeChipModel.Normal ->
72-
CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
73-
ConstraintButton(
74-
text = constraint.text,
75-
onRemoveClick = { onRemoveConstraintClick(constraint.id) },
76-
// Only allow clicking on error chips
77-
enabled = enabled,
78-
icon = {
79-
if (constraint.icon is ComposeIconInfo.Vector) {
80-
Icon(
81-
modifier = Modifier
82-
.size(24.dp)
83-
.padding(end = 8.dp),
84-
imageVector = constraint.icon.imageVector,
85-
contentDescription = null,
86-
)
87-
} else if (constraint.icon is ComposeIconInfo.Drawable) {
88-
Icon(
89-
modifier = Modifier
90-
.size(24.dp)
91-
.padding(end = 8.dp),
92-
painter = rememberDrawablePainter(constraint.icon.drawable),
93-
contentDescription = null,
94-
tint = Color.Unspecified,
95-
)
96-
}
97-
},
78+
for ((index, constraint) in constraints.withIndex()) {
79+
when (constraint) {
80+
is ComposeChipModel.Normal ->
81+
CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onSurface) {
82+
ConstraintButton(
83+
modifier = Modifier.widthIn(max = maxChipWidth),
84+
text = constraint.text,
85+
onRemoveClick = { onRemoveConstraintClick(constraint.id) },
86+
// Only allow clicking on error chips
87+
enabled = enabled,
88+
icon = {
89+
if (constraint.icon is ComposeIconInfo.Vector) {
90+
Icon(
91+
modifier = Modifier
92+
.size(24.dp)
93+
.padding(end = 8.dp),
94+
imageVector = constraint.icon.imageVector,
95+
contentDescription = null,
96+
)
97+
} else if (constraint.icon is ComposeIconInfo.Drawable) {
98+
Icon(
99+
modifier = Modifier
100+
.size(24.dp)
101+
.padding(end = 8.dp),
102+
painter = rememberDrawablePainter(constraint.icon.drawable),
103+
contentDescription = null,
104+
tint = Color.Unspecified,
105+
)
106+
}
107+
},
108+
)
109+
}
110+
111+
is ComposeChipModel.Error ->
112+
CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onErrorContainer) {
113+
ConstraintErrorButton(
114+
modifier = Modifier.widthIn(max = maxChipWidth),
115+
text = constraint.text,
116+
onClick = { onFixConstraintClick(constraint.error) },
117+
onRemoveClick = { onRemoveConstraintClick(constraint.id) },
118+
// Only allow clicking on error chips
119+
enabled = enabled,
120+
)
121+
}
122+
}
123+
124+
if (index < constraints.lastIndex) {
125+
when (mode) {
126+
ConstraintMode.AND -> Text(
127+
text = stringResource(R.string.constraint_mode_and),
128+
style = MaterialTheme.typography.labelMedium,
98129
)
99-
}
100130

101-
is ComposeChipModel.Error ->
102-
CompositionLocalProvider(LocalContentColor provides MaterialTheme.colorScheme.onErrorContainer) {
103-
ConstraintErrorButton(
104-
text = constraint.text,
105-
onClick = { onFixConstraintClick(constraint.error) },
106-
onRemoveClick = { onRemoveConstraintClick(constraint.id) },
107-
// Only allow clicking on error chips
108-
enabled = enabled,
131+
ConstraintMode.OR -> Text(
132+
text = stringResource(R.string.constraint_mode_or),
133+
style = MaterialTheme.typography.labelMedium,
109134
)
110135
}
111-
}
112-
113-
if (index < constraints.lastIndex) {
114-
when (mode) {
115-
ConstraintMode.AND -> Text(
116-
text = stringResource(R.string.constraint_mode_and),
117-
style = MaterialTheme.typography.labelMedium,
118-
)
119-
120-
ConstraintMode.OR -> Text(
121-
text = stringResource(R.string.constraint_mode_or),
122-
style = MaterialTheme.typography.labelMedium,
123-
)
124136
}
125137
}
126-
}
127138

128-
if (parentConstraintCount > 0) {
129-
Text(
130-
modifier = Modifier
131-
.padding(horizontal = 8.dp),
132-
text = pluralStringResource(
133-
R.plurals.home_groups_inherited_constraints,
134-
parentConstraintCount,
135-
parentConstraintCount,
136-
),
137-
style = MaterialTheme.typography.labelMedium,
138-
)
139+
if (parentConstraintCount > 0) {
140+
Text(
141+
modifier = Modifier
142+
.padding(horizontal = 8.dp),
143+
text = pluralStringResource(
144+
R.plurals.home_groups_inherited_constraints,
145+
parentConstraintCount,
146+
parentConstraintCount,
147+
),
148+
style = MaterialTheme.typography.labelMedium,
149+
)
150+
}
139151
}
140152
}
141153
}
@@ -205,9 +217,11 @@ private fun ConstraintButton(
205217
icon()
206218

207219
Text(
220+
modifier = Modifier.weight(1f, fill = false),
208221
text = text,
209222
maxLines = 1,
210223
style = MaterialTheme.typography.titleSmall,
224+
overflow = TextOverflow.Ellipsis,
211225
)
212226

213227
Spacer(modifier = Modifier.width(4.dp))
@@ -260,9 +274,11 @@ private fun ConstraintErrorButton(
260274
)
261275

262276
Text(
277+
modifier = Modifier.weight(1f, fill = false),
263278
text = text,
264279
maxLines = 1,
265280
style = MaterialTheme.typography.titleSmall,
281+
overflow = TextOverflow.Ellipsis,
266282
)
267283

268284
Spacer(modifier = Modifier.width(4.dp))

0 commit comments

Comments
 (0)