Skip to content

Commit 717a29b

Browse files
id-rootid-root
authored
Refactor TransferOverlay layout and interaction
Refactor TransferOverlay to improve layout and interaction. Added clickable background and adjusted progress indicators.
1 parent 7f858fc commit 717a29b

1 file changed

Lines changed: 93 additions & 76 deletions

File tree

‎android/app/src/main/java/com/synapse/lantransfer/ui/components/TransferOverlay.kt‎

Lines changed: 93 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ package com.synapse.lantransfer.ui.components
33
import androidx.compose.animation.core.*
44
import androidx.compose.foundation.background
55
import androidx.compose.foundation.border
6+
import androidx.compose.foundation.clickable
7+
import androidx.compose.foundation.interaction.MutableInteractionSource
68
import androidx.compose.foundation.layout.*
79
import androidx.compose.foundation.shape.RoundedCornerShape
810
import androidx.compose.material.icons.Icons
@@ -11,8 +13,10 @@ import androidx.compose.material3.*
1113
import androidx.compose.runtime.*
1214
import androidx.compose.ui.Alignment
1315
import androidx.compose.ui.Modifier
16+
import androidx.compose.ui.draw.blur
1417
import androidx.compose.ui.draw.clip
1518
import androidx.compose.ui.graphics.Brush
19+
import androidx.compose.ui.graphics.Color
1620
import androidx.compose.ui.graphics.StrokeCap
1721
import androidx.compose.ui.unit.dp
1822
import com.synapse.lantransfer.ui.theme.*
@@ -38,99 +42,112 @@ fun TransferOverlay(
3842

3943
val shape = RoundedCornerShape(24.dp)
4044

45+
// Full screen overlay that dims and blurs background
4146
Box(
4247
modifier = modifier
43-
.fillMaxWidth()
44-
.padding(16.dp),
48+
.fillMaxSize()
49+
.background(Color.Black.copy(alpha = 0.5f))
50+
.clickable(
51+
interactionSource = remember { MutableInteractionSource() },
52+
indication = null
53+
) { /* Consume clicks to prevent background interaction */ },
4554
contentAlignment = Alignment.BottomCenter
4655
) {
47-
Column(
56+
Box(
4857
modifier = Modifier
4958
.fillMaxWidth()
50-
.clip(shape)
51-
.background(
52-
brush = Brush.verticalGradient(
53-
colors = listOf(BgElevatedSolid, BgCardSolid)
54-
)
55-
)
56-
.border(1.dp, GlassBorder, shape)
57-
.padding(20.dp),
58-
verticalArrangement = Arrangement.spacedBy(16.dp)
59+
.windowInsetsPadding(WindowInsets.navigationBars)
60+
.padding(16.dp),
61+
contentAlignment = Alignment.BottomCenter
5962
) {
60-
// Header
61-
Row(
62-
modifier = Modifier.fillMaxWidth(),
63-
horizontalArrangement = Arrangement.SpaceBetween,
64-
verticalAlignment = Alignment.CenterVertically
63+
Column(
64+
modifier = Modifier
65+
.fillMaxWidth()
66+
.clip(shape)
67+
.background(
68+
brush = Brush.verticalGradient(
69+
colors = listOf(BgElevatedSolid, BgCardSolid)
70+
)
71+
)
72+
.border(1.dp, GlassBorder, shape)
73+
.padding(20.dp),
74+
verticalArrangement = Arrangement.spacedBy(16.dp)
6575
) {
66-
Column {
67-
Text(
68-
text = "Transferring...",
69-
style = SynapseTypography.displaySmall,
70-
color = TextPrimary
76+
// Header
77+
Row(
78+
modifier = Modifier.fillMaxWidth(),
79+
horizontalArrangement = Arrangement.SpaceBetween,
80+
verticalAlignment = Alignment.CenterVertically
81+
) {
82+
Column {
83+
Text(
84+
text = "Transferring...",
85+
style = SynapseTypography.displaySmall,
86+
color = TextPrimary
87+
)
88+
Text(
89+
text = fileName,
90+
style = SynapseTypography.bodyMedium,
91+
color = TextSecondary,
92+
maxLines = 1
93+
)
94+
}
95+
IconButton(onClick = onCancel) {
96+
Icon(
97+
imageVector = Icons.Rounded.Close,
98+
contentDescription = "Cancel",
99+
tint = TextMuted
100+
)
101+
}
102+
}
103+
104+
// Circular progress
105+
Box(
106+
modifier = Modifier.fillMaxWidth(),
107+
contentAlignment = Alignment.Center
108+
) {
109+
CircularProgressIndicator(
110+
progress = { animatedProgress },
111+
modifier = Modifier.size(80.dp),
112+
color = Accent1,
113+
trackColor = AccentSubtle,
114+
strokeWidth = 6.dp,
115+
strokeCap = StrokeCap.Round
71116
)
72117
Text(
73-
text = fileName,
74-
style = SynapseTypography.bodyMedium,
75-
color = TextSecondary,
76-
maxLines = 1
77-
)
78-
}
79-
IconButton(onClick = onCancel) {
80-
Icon(
81-
imageVector = Icons.Rounded.Close,
82-
contentDescription = "Cancel",
83-
tint = TextMuted
118+
text = "${(animatedProgress * 100).toInt()}%",
119+
style = SynapseTypography.titleLarge,
120+
color = Accent1
84121
)
85122
}
86-
}
87123

88-
// Circular progress
89-
Box(
90-
modifier = Modifier.fillMaxWidth(),
91-
contentAlignment = Alignment.Center
92-
) {
93-
CircularProgressIndicator(
124+
// Linear progress
125+
LinearProgressIndicator(
94126
progress = { animatedProgress },
95-
modifier = Modifier.size(80.dp),
127+
modifier = Modifier
128+
.fillMaxWidth()
129+
.height(6.dp)
130+
.clip(RoundedCornerShape(3.dp)),
96131
color = Accent1,
97-
trackColor = AccentSubtle,
98-
strokeWidth = 6.dp,
99-
strokeCap = StrokeCap.Round
100-
)
101-
Text(
102-
text = "${(animatedProgress * 100).toInt()}%",
103-
style = SynapseTypography.titleLarge,
104-
color = Accent1
132+
trackColor = AccentSubtle
105133
)
106-
}
107-
108-
// Linear progress
109-
LinearProgressIndicator(
110-
progress = { animatedProgress },
111-
modifier = Modifier
112-
.fillMaxWidth()
113-
.height(6.dp)
114-
.clip(RoundedCornerShape(3.dp)),
115-
color = Accent1,
116-
trackColor = AccentSubtle
117-
)
118134

119-
// Stats row
120-
Row(
121-
modifier = Modifier.fillMaxWidth(),
122-
horizontalArrangement = Arrangement.SpaceBetween
123-
) {
124-
Text(
125-
text = "$transferredBytes / $totalBytes",
126-
style = SynapseTypography.labelSmall,
127-
color = TextMuted
128-
)
129-
Text(
130-
text = speed,
131-
style = SynapseTypography.labelSmall,
132-
color = Accent1
133-
)
135+
// Stats row
136+
Row(
137+
modifier = Modifier.fillMaxWidth(),
138+
horizontalArrangement = Arrangement.SpaceBetween
139+
) {
140+
Text(
141+
text = "$transferredBytes / $totalBytes",
142+
style = SynapseTypography.labelSmall,
143+
color = TextMuted
144+
)
145+
Text(
146+
text = speed,
147+
style = SynapseTypography.labelSmall,
148+
color = Accent1
149+
)
150+
}
134151
}
135152
}
136153
}

0 commit comments

Comments
 (0)