Skip to content

Commit c452510

Browse files
obviyusobviyus
committed
style(android): sharpen voice mode surfaces
1 parent 955909c commit c452510

1 file changed

Lines changed: 24 additions & 24 deletions

File tree

‎apps/android/app/src/main/java/ai/openclaw/app/ui/VoiceScreen.kt‎

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -161,7 +161,7 @@ fun VoiceScreen(
161161
.fillMaxSize()
162162
.imePadding()
163163
.padding(horizontal = 20.dp, vertical = 8.dp),
164-
verticalArrangement = Arrangement.spacedBy(8.dp),
164+
verticalArrangement = Arrangement.spacedBy(10.dp),
165165
) {
166166
VoiceHeader(
167167
statusText = if (voiceActive || !gatewayReady) activeStatus else "Your voice command center.",
@@ -371,12 +371,12 @@ private fun TalkSessionScreen(
371371
.fillMaxSize()
372372
.imePadding()
373373
.padding(horizontal = 20.dp, vertical = 8.dp),
374-
verticalArrangement = Arrangement.spacedBy(11.dp),
374+
verticalArrangement = Arrangement.spacedBy(10.dp),
375375
) {
376376
Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.CenterVertically) {
377377
VoicePlainIconButton(icon = Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back to voice", onClick = onEndTalk)
378378
Column(modifier = Modifier.weight(1f), horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy(3.dp)) {
379-
Text(text = "Realtime Talk", style = ClawTheme.type.title.copy(fontSize = 14.sp, lineHeight = 17.sp), color = ClawTheme.colors.text)
379+
Text(text = "Realtime Talk", style = ClawTheme.type.title.copy(fontSize = 16.sp, lineHeight = 20.sp), color = ClawTheme.colors.text)
380380
Row(verticalAlignment = Alignment.CenterVertically, horizontalArrangement = Arrangement.spacedBy(5.dp)) {
381381
Box(modifier = Modifier.size(4.5.dp).clip(CircleShape).background(if (speaking || listening) ClawTheme.colors.success else ClawTheme.colors.textSubtle))
382382
Text(
@@ -397,8 +397,8 @@ private fun TalkSessionScreen(
397397
}
398398

399399
Surface(
400-
modifier = Modifier.fillMaxWidth().height(58.dp),
401-
shape = RoundedCornerShape(ClawTheme.radii.pill),
400+
modifier = Modifier.fillMaxWidth().height(52.dp),
401+
shape = RoundedCornerShape(ClawTheme.radii.panel),
402402
color = ClawTheme.colors.canvas,
403403
border = BorderStroke(1.dp, ClawTheme.colors.borderStrong),
404404
) {
@@ -429,7 +429,7 @@ private fun TalkTranscript(
429429
entries: List<VoiceConversationEntry>,
430430
modifier: Modifier = Modifier,
431431
) {
432-
LazyColumn(modifier = modifier.fillMaxWidth(), verticalArrangement = Arrangement.spacedBy(7.dp)) {
432+
LazyColumn(modifier = modifier.fillMaxWidth(), verticalArrangement = Arrangement.spacedBy(8.dp)) {
433433
if (entries.isEmpty()) {
434434
item {
435435
TalkTranscriptCard(label = "OpenClaw", text = "Listening for your next turn.", muted = true)
@@ -458,7 +458,7 @@ private fun TalkTranscriptCard(
458458
color = ClawTheme.colors.surface,
459459
border = BorderStroke(1.dp, ClawTheme.colors.border),
460460
) {
461-
Column(modifier = Modifier.padding(horizontal = 10.dp, vertical = 8.dp), verticalArrangement = Arrangement.spacedBy(5.dp)) {
461+
Column(modifier = Modifier.padding(horizontal = 14.dp, vertical = 9.dp), verticalArrangement = Arrangement.spacedBy(5.dp)) {
462462
Text(text = label, style = ClawTheme.type.section, color = ClawTheme.colors.text)
463463
Text(text = text, style = ClawTheme.type.body, color = if (muted) ClawTheme.colors.textMuted else ClawTheme.colors.text)
464464
}
@@ -476,7 +476,7 @@ private fun TalkControl(
476476
Surface(
477477
onClick = onClick,
478478
modifier = Modifier.size(ClawTheme.spacing.touchTarget),
479-
shape = CircleShape,
479+
shape = RoundedCornerShape(ClawTheme.radii.button),
480480
color = if (primary) ClawTheme.colors.primary else ClawTheme.colors.canvas,
481481
contentColor = if (primary) ClawTheme.colors.primaryText else ClawTheme.colors.text,
482482
border = BorderStroke(1.dp, if (primary) ClawTheme.colors.primary else ClawTheme.colors.border),
@@ -592,7 +592,7 @@ private fun VoiceHero(
592592
onStartDictation: () -> Unit,
593593
onConnectGateway: () -> Unit,
594594
) {
595-
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy(10.dp)) {
595+
Column(horizontalAlignment = Alignment.CenterHorizontally, verticalArrangement = Arrangement.spacedBy(9.dp)) {
596596
VoiceOrb(
597597
active = micEnabled || talkModeEnabled,
598598
listening = talkModeListening || voiceCaptureMode == VoiceCaptureMode.ManualMic,
@@ -639,7 +639,7 @@ private fun VoiceHero(
639639
}
640640
}
641641

642-
ClawPanel(contentPadding = PaddingValues(horizontal = 0.dp, vertical = 0.dp)) {
642+
ClawPanel(contentPadding = PaddingValues(horizontal = 14.dp, vertical = 4.dp)) {
643643
VoiceModeRow(
644644
title = if (talkModeEnabled) "End Talk" else "Realtime Talk",
645645
subtitle =
@@ -696,19 +696,19 @@ private fun VoiceModeRow(
696696
) {
697697
Surface(onClick = onClick, enabled = enabled, color = Color.Transparent, contentColor = ClawTheme.colors.text) {
698698
Row(
699-
modifier = Modifier.fillMaxWidth().heightIn(min = 60.dp).padding(horizontal = 10.dp, vertical = 6.dp),
699+
modifier = Modifier.fillMaxWidth().heightIn(min = 54.dp).padding(horizontal = 0.dp, vertical = 7.dp),
700700
verticalAlignment = Alignment.CenterVertically,
701701
horizontalArrangement = Arrangement.spacedBy(10.dp),
702702
) {
703703
Surface(
704-
modifier = Modifier.size(34.dp),
705-
shape = CircleShape,
704+
modifier = Modifier.size(30.dp),
705+
shape = RoundedCornerShape(ClawTheme.radii.control),
706706
color = if (enabled) ClawTheme.colors.surface else ClawTheme.colors.canvas,
707707
contentColor = if (enabled) ClawTheme.colors.text else ClawTheme.colors.textSubtle,
708708
border = BorderStroke(1.dp, ClawTheme.colors.border),
709709
) {
710710
Box(contentAlignment = Alignment.Center) {
711-
Icon(imageVector = icon, contentDescription = null, modifier = Modifier.size(16.dp))
711+
Icon(imageVector = icon, contentDescription = null, modifier = Modifier.size(15.dp))
712712
}
713713
}
714714
Column(modifier = Modifier.weight(1f), verticalArrangement = Arrangement.spacedBy(2.dp)) {
@@ -719,7 +719,7 @@ private fun VoiceModeRow(
719719
Icon(
720720
imageVector = Icons.AutoMirrored.Filled.KeyboardArrowRight,
721721
contentDescription = null,
722-
modifier = Modifier.size(21.dp),
722+
modifier = Modifier.size(18.dp),
723723
tint = ClawTheme.colors.textMuted,
724724
)
725725
}
@@ -738,19 +738,19 @@ private fun VoiceProviderCard(gatewayStatus: String) {
738738
border = BorderStroke(1.dp, ClawTheme.colors.border),
739739
) {
740740
Row(
741-
modifier = Modifier.fillMaxWidth().padding(horizontal = 12.dp, vertical = 9.dp),
741+
modifier = Modifier.fillMaxWidth().padding(horizontal = 14.dp, vertical = 9.dp),
742742
verticalAlignment = Alignment.CenterVertically,
743743
horizontalArrangement = Arrangement.spacedBy(10.dp),
744744
) {
745745
Surface(
746-
modifier = Modifier.size(34.dp),
747-
shape = CircleShape,
746+
modifier = Modifier.size(30.dp),
747+
shape = RoundedCornerShape(ClawTheme.radii.control),
748748
color = ClawTheme.colors.canvas,
749749
contentColor = ClawTheme.colors.text,
750750
border = BorderStroke(1.dp, ClawTheme.colors.borderStrong),
751751
) {
752752
Box(contentAlignment = Alignment.Center) {
753-
Icon(imageVector = Icons.Default.GraphicEq, contentDescription = null, modifier = Modifier.size(17.dp))
753+
Icon(imageVector = Icons.Default.GraphicEq, contentDescription = null, modifier = Modifier.size(15.dp))
754754
}
755755
}
756756
Column(modifier = Modifier.weight(1f), verticalArrangement = Arrangement.spacedBy(2.dp)) {
@@ -780,7 +780,7 @@ private fun VoicePrimaryAction(
780780
Surface(
781781
onClick = onClick,
782782
modifier = Modifier.fillMaxWidth().height(ClawTheme.spacing.touchTarget),
783-
shape = RoundedCornerShape(ClawTheme.radii.pill),
783+
shape = RoundedCornerShape(ClawTheme.radii.button),
784784
color = ClawTheme.colors.primary,
785785
contentColor = ClawTheme.colors.primaryText,
786786
) {
@@ -802,7 +802,7 @@ private fun VoiceOrb(
802802
speaking: Boolean,
803803
) {
804804
Surface(
805-
modifier = Modifier.size(132.dp),
805+
modifier = Modifier.size(112.dp),
806806
shape = CircleShape,
807807
color = if (active) ClawTheme.colors.surfacePressed else ClawTheme.colors.surface,
808808
border = BorderStroke(1.dp, if (active) ClawTheme.colors.borderStrong else ClawTheme.colors.border),
@@ -817,7 +817,7 @@ private fun VoiceOrb(
817817
else -> Icons.Default.Mic
818818
},
819819
contentDescription = null,
820-
modifier = Modifier.size(38.dp),
820+
modifier = Modifier.size(32.dp),
821821
tint = ClawTheme.colors.text,
822822
)
823823
Waveform(active = active)
@@ -875,7 +875,7 @@ private fun VoiceTranscript(
875875
item {
876876
Column(verticalArrangement = Arrangement.spacedBy(8.dp)) {
877877
Text(text = "Live transcript", style = ClawTheme.type.caption, color = ClawTheme.colors.textSubtle)
878-
ClawPanel(contentPadding = PaddingValues(horizontal = 10.dp, vertical = 9.dp)) {
878+
ClawPanel(contentPadding = PaddingValues(horizontal = 14.dp, vertical = 9.dp)) {
879879
Column(verticalArrangement = Arrangement.spacedBy(4.dp)) {
880880
Text(text = "No transcript yet", style = ClawTheme.type.section, color = ClawTheme.colors.text)
881881
Text(
@@ -902,7 +902,7 @@ private fun VoiceTurnCard(entry: VoiceConversationEntry) {
902902
contentColor = ClawTheme.colors.text,
903903
border = BorderStroke(1.dp, if (entry.isStreaming) ClawTheme.colors.borderStrong else ClawTheme.colors.border),
904904
) {
905-
Column(modifier = Modifier.padding(horizontal = 10.dp, vertical = 8.dp), verticalArrangement = Arrangement.spacedBy(5.dp)) {
905+
Column(modifier = Modifier.padding(horizontal = 14.dp, vertical = 9.dp), verticalArrangement = Arrangement.spacedBy(5.dp)) {
906906
Text(
907907
text = if (isUser) "You" else "OpenClaw",
908908
style = ClawTheme.type.caption.copy(fontSize = 12.5.sp, lineHeight = 16.sp, fontWeight = FontWeight.SemiBold),

0 commit comments

Comments
 (0)