mnalis/apps-android-commons
1
0
Fork 0
mirror of https://github.com/commons-app/apps-android-commons.git synced 2025-10-27 12:53:55 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Add selection count indicator in top bar and refactor

Browse source
This commit is contained in:
Rohit Verma 2024-10-13 14:07:02 +05:30
parent 1a86883ec0
commit ca30bf18bf
2 changed files with 56 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

29
app/src/main/java/fr/free/nrw/commons/customselector/ui/components/CustomSelectorTopBar.kt
View file

@ -2,8 +2,12 @@ package fr.free.nrw.commons.customselector.ui.components
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.rounded.KeyboardArrowLeft
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.ElevatedCard
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
@ -14,6 +18,8 @@ import androidx.compose.material3.TopAppBar
import androidx.compose.runtime.Composable
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.semantics.contentDescription
import androidx.compose.ui.semantics.semantics
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.PreviewLightDark
import androidx.compose.ui.unit.dp
@ -28,7 +34,9 @@ fun CustomSelectorTopBar(
onNavigateBack: ()-> Unit,
modifier: Modifier = Modifier,
secondaryText: String? = null,
selectionCount: Int = 0,
showNavigationIcon: Boolean = true,
showSelectionCount: Boolean = false,
showAlertIcon: Boolean = false,
onAlertAction: ()-> Unit = { },
) {
@ -38,7 +46,6 @@ fun CustomSelectorTopBar(
Text(
text = primaryText,
style = MaterialTheme.typography.titleMedium.copy(fontSize = 18.sp),
color = MaterialTheme.colorScheme.primary,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
@ -73,6 +80,23 @@ fun CustomSelectorTopBar(
)
}
}
if(showSelectionCount) {
ElevatedCard(
colors = CardDefaults.elevatedCardColors(
containerColor = MaterialTheme.colorScheme.primary
),
shape = CircleShape,
modifier = Modifier.semantics { contentDescription = "$selectionCount Selected" }
.padding(end = 8.dp)
) {
Text(
text = "$selectionCount",
modifier = Modifier.padding(horizontal = 16.dp, vertical = 8.dp),
style = MaterialTheme.typography.labelMedium
)
}
}
}
)
}
@ -86,7 +110,8 @@ private fun CustomSelectorTopBarPreview() {
primaryText = "My Folder",
secondaryText = "10 images",
onNavigateBack = { },
showAlertIcon = true
showAlertIcon = true,
selectionCount = 1
)
}
}

59
app/src/main/java/fr/free/nrw/commons/customselector/ui/components/PartialStorageAccessDialog.kt
View file

@ -21,37 +21,34 @@ import fr.free.nrw.commons.ui.theme.CommonsTheme
@Composable
fun PartialStorageAccessDialog(
isVisible: Boolean,
onManage: ()-> Unit,
onManageAction: () -> Unit,
modifier: Modifier = Modifier
) {
if(isVisible) {
Card(
modifier = modifier,
colors = CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.secondaryContainer
),
shape = RoundedCornerShape(12.dp)
Card(
modifier = modifier,
colors = CardDefaults.cardColors(
containerColor = MaterialTheme.colorScheme.secondaryContainer
),
shape = RoundedCornerShape(12.dp)
) {
Row(
modifier = Modifier
.padding(vertical = 8.dp, horizontal = 16.dp)
.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(4.dp),
verticalAlignment = Alignment.CenterVertically
) {
Row(
modifier = Modifier
.padding(vertical = 8.dp, horizontal = 16.dp)
.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(4.dp),
verticalAlignment = Alignment.CenterVertically
Text(
text = "You've given access to a selected number of photos",
style = MaterialTheme.typography.bodyMedium,
modifier = Modifier.weight(1f)
)
Button(
onClick = onManageAction,
shape = RoundedCornerShape(8.dp),
contentPadding = PaddingValues(horizontal = 16.dp)
) {
Text(
text = "You've given access to a selected number of photos",
style = MaterialTheme.typography.bodyMedium,
modifier = Modifier.weight(1f)
)
Button(
onClick = onManage,
shape = RoundedCornerShape(8.dp),
contentPadding = PaddingValues(horizontal = 16.dp)
) {
Text(text = "Manage", style = MaterialTheme.typography.labelMedium)
}
Text(text = "Manage", style = MaterialTheme.typography.labelMedium)
}
}
}
@ -62,9 +59,11 @@ fun PartialStorageAccessDialog(
fun PartialStorageAccessIndicatorPreview() {
CommonsTheme {
Surface {
PartialStorageAccessDialog(isVisible = true, onManage = {}, modifier = Modifier
.padding(8.dp)
.fillMaxWidth()
PartialStorageAccessDialog(
onManageAction = {},
modifier = Modifier
.padding(8.dp)
.fillMaxWidth()
)
}
}