mirror of
https://github.com/meshtastic/Meshtastic-Android.git
synced 2026-04-20 22:23:37 +00:00
Make overflows on Connections bar nice, and add previews (#2615)
This commit is contained in:
DaneEvans
GitHub
parent
7a109a747e
commit
3076f457b5
1 changed files with 138 additions and 4 deletions
|
|
@ -33,6 +33,7 @@ import androidx.compose.foundation.layout.fillMaxSize
|
|||
import androidx.compose.foundation.layout.fillMaxWidth
|
||||
import androidx.compose.foundation.layout.height
|
||||
import androidx.compose.foundation.layout.padding
|
||||
import androidx.compose.foundation.layout.size
|
||||
import androidx.compose.foundation.layout.width
|
||||
import androidx.compose.foundation.rememberScrollState
|
||||
import androidx.compose.foundation.selection.selectable
|
||||
|
|
@ -71,6 +72,8 @@ import androidx.compose.ui.platform.LocalContext
|
|||
import androidx.compose.ui.res.stringResource
|
||||
import androidx.compose.ui.semantics.Role
|
||||
import androidx.compose.ui.text.style.TextAlign
|
||||
import androidx.compose.ui.text.style.TextOverflow
|
||||
import androidx.compose.ui.tooling.preview.Preview
|
||||
import androidx.compose.ui.unit.dp
|
||||
import androidx.compose.ui.unit.sp
|
||||
import androidx.compose.ui.window.Dialog
|
||||
|
|
@ -324,9 +327,19 @@ fun ConnectionsScreen(
|
|||
Icon(
|
||||
imageVector = Icons.Default.Bluetooth,
|
||||
contentDescription = stringResource(id = R.string.bluetooth),
|
||||
modifier = Modifier.padding(end = 8.dp), // Add padding to separate icon from text
|
||||
)
|
||||
},
|
||||
label = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.bluetooth),
|
||||
modifier = Modifier.padding(top = 2.dp),
|
||||
maxLines = 1,
|
||||
softWrap = true,
|
||||
textAlign = TextAlign.Center,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
},
|
||||
label = { Text(text = stringResource(id = R.string.bluetooth)) },
|
||||
)
|
||||
SegmentedButton(
|
||||
shape = SegmentedButtonDefaults.itemShape(DeviceType.TCP.ordinal, DeviceType.entries.size),
|
||||
|
|
@ -336,18 +349,41 @@ fun ConnectionsScreen(
|
|||
Icon(
|
||||
imageVector = Icons.Default.Wifi,
|
||||
contentDescription = stringResource(id = R.string.network),
|
||||
modifier = Modifier.padding(end = 8.dp), // Add padding to separate icon from text
|
||||
)
|
||||
},
|
||||
label = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.network),
|
||||
modifier = Modifier.padding(top = 2.dp),
|
||||
maxLines = 1,
|
||||
softWrap = true,
|
||||
textAlign = TextAlign.Center,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
},
|
||||
label = { Text(text = stringResource(id = R.string.network)) },
|
||||
)
|
||||
SegmentedButton(
|
||||
shape = SegmentedButtonDefaults.itemShape(DeviceType.USB.ordinal, DeviceType.entries.size),
|
||||
onClick = { selectedDeviceType = DeviceType.USB },
|
||||
selected = (selectedDeviceType == DeviceType.USB),
|
||||
icon = {
|
||||
Icon(imageVector = Icons.Default.Usb, contentDescription = stringResource(id = R.string.serial))
|
||||
Icon(
|
||||
imageVector = Icons.Default.Usb,
|
||||
contentDescription = stringResource(id = R.string.serial),
|
||||
modifier = Modifier.padding(end = 8.dp), // Add padding to separate icon from text
|
||||
)
|
||||
},
|
||||
label = {
|
||||
Text(
|
||||
text = stringResource(id = R.string.serial),
|
||||
modifier = Modifier.padding(top = 2.dp),
|
||||
maxLines = 1,
|
||||
softWrap = true,
|
||||
textAlign = TextAlign.Center,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
},
|
||||
label = { Text(text = stringResource(id = R.string.serial)) },
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -590,3 +626,101 @@ private enum class DeviceType {
|
|||
}
|
||||
|
||||
private const val SCAN_PERIOD: Long = 10000 // 10 seconds
|
||||
|
||||
@Preview(showBackground = true)
|
||||
@Composable
|
||||
private fun PreviewConnectionsSegmentedBar() {
|
||||
MaterialTheme {
|
||||
Column {
|
||||
// Preview with a long string
|
||||
var selectedDeviceTypeLong by remember { mutableStateOf(DeviceType.USB) }
|
||||
SingleChoiceSegmentedButtonRow(modifier = Modifier.fillMaxWidth()) {
|
||||
DeviceType.entries.forEach { deviceType ->
|
||||
SegmentedButton(
|
||||
shape = SegmentedButtonDefaults.itemShape(deviceType.ordinal, DeviceType.entries.size),
|
||||
onClick = { selectedDeviceTypeLong = deviceType },
|
||||
selected = (selectedDeviceTypeLong == deviceType),
|
||||
icon = {
|
||||
Icon(
|
||||
imageVector =
|
||||
when (deviceType) {
|
||||
DeviceType.BLE -> Icons.Default.Bluetooth
|
||||
DeviceType.TCP -> Icons.Default.Wifi
|
||||
DeviceType.USB -> Icons.Default.Usb
|
||||
},
|
||||
contentDescription = stringResource(id = R.string.bluetooth), // Placeholder
|
||||
modifier = Modifier.size(24.dp),
|
||||
)
|
||||
},
|
||||
label = {
|
||||
Text(
|
||||
text =
|
||||
when (deviceType) {
|
||||
DeviceType.BLE -> stringResource(id = R.string.bluetooth)
|
||||
DeviceType.TCP -> stringResource(id = R.string.network)
|
||||
// DeviceType.USB -> stringResource(id =
|
||||
// R.string.serial)
|
||||
DeviceType.USB -> "Some outrageously long translation string that will happen"
|
||||
},
|
||||
modifier = Modifier.padding(top = 2.dp),
|
||||
maxLines = 1,
|
||||
softWrap = true,
|
||||
textAlign = TextAlign.Center,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
},
|
||||
)
|
||||
}
|
||||
}
|
||||
Spacer(modifier = Modifier.height(16.dp)) // Add some spacing for the second preview
|
||||
// Preview with normal length strings
|
||||
ConnectionsSegmentedBarInternal(initialSelection = DeviceType.BLE)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@Composable
|
||||
private fun ConnectionsSegmentedBarInternal(initialSelection: DeviceType) {
|
||||
var selectedDeviceType by remember { mutableStateOf(initialSelection) }
|
||||
SingleChoiceSegmentedButtonRow(modifier = Modifier.fillMaxWidth()) {
|
||||
DeviceType.entries.forEach { deviceType ->
|
||||
SegmentedButton(
|
||||
shape = SegmentedButtonDefaults.itemShape(deviceType.ordinal, DeviceType.entries.size),
|
||||
onClick = { selectedDeviceType = deviceType },
|
||||
selected = (selectedDeviceType == deviceType),
|
||||
icon = {
|
||||
Icon(
|
||||
imageVector =
|
||||
when (deviceType) {
|
||||
DeviceType.BLE -> Icons.Default.Bluetooth
|
||||
DeviceType.TCP -> Icons.Default.Wifi
|
||||
DeviceType.USB -> Icons.Default.Usb
|
||||
},
|
||||
contentDescription =
|
||||
when (deviceType) {
|
||||
DeviceType.BLE -> stringResource(id = R.string.bluetooth)
|
||||
DeviceType.TCP -> stringResource(id = R.string.network)
|
||||
DeviceType.USB -> stringResource(id = R.string.serial)
|
||||
},
|
||||
modifier = Modifier.size(24.dp),
|
||||
)
|
||||
},
|
||||
label = {
|
||||
Text(
|
||||
text =
|
||||
when (deviceType) {
|
||||
DeviceType.BLE -> stringResource(id = R.string.bluetooth)
|
||||
DeviceType.TCP -> stringResource(id = R.string.network)
|
||||
DeviceType.USB -> stringResource(id = R.string.serial)
|
||||
},
|
||||
modifier = Modifier.padding(top = 2.dp),
|
||||
maxLines = 1,
|
||||
softWrap = true,
|
||||
textAlign = TextAlign.Center,
|
||||
overflow = TextOverflow.Ellipsis,
|
||||
)
|
||||
},
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue