Skip to content

Commit d5061ee

Browse files
feat: use grid layout for module lists on wide screens
1 parent cdec7c9 commit d5061ee

4 files changed

Lines changed: 59 additions & 26 deletions

File tree

app/src/main/java/me/bmax/apatch/ui/screen/APM.kt

Lines changed: 18 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,12 @@ import androidx.compose.foundation.lazy.LazyListState
4040
import androidx.compose.foundation.lazy.items
4141
import androidx.compose.foundation.lazy.itemsIndexed
4242
import androidx.compose.foundation.lazy.rememberLazyListState
43+
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
44+
import androidx.compose.foundation.lazy.grid.GridCells
45+
import androidx.compose.foundation.lazy.grid.GridItemSpan
46+
import androidx.compose.foundation.lazy.grid.LazyGridState
47+
import androidx.compose.foundation.lazy.grid.itemsIndexed as gridItemsIndexed
48+
import androidx.compose.foundation.lazy.grid.rememberLazyGridState
4349
import androidx.compose.foundation.shape.RoundedCornerShape
4450
import androidx.compose.ui.draw.clip
4551
import androidx.compose.material.ExperimentalMaterialApi
@@ -280,7 +286,7 @@ fun APModuleScreen(navigator: DestinationsNavigator) {
280286
}
281287
val hideInstallButton = isSafeMode || hasMagisk
282288

283-
val moduleListState = rememberLazyListState()
289+
val moduleListState = rememberLazyGridState()
284290

285291
var searchQuery by remember { mutableStateOf("") }
286292
val filteredModuleList = remember(viewModel.moduleList, searchQuery) {
@@ -559,7 +565,7 @@ private fun ModuleList(
559565
simpleListBottomBar: Boolean,
560566
checkStrongBiometric: suspend () -> Boolean,
561567
modifier: Modifier = Modifier,
562-
state: LazyListState,
568+
state: LazyGridState,
563569
onInstallModule: (Uri) -> Unit,
564570
onClickModule: (id: String, name: String, hasWebUi: Boolean) -> Unit,
565571
snackBarHost: SnackbarHostState,
@@ -723,10 +729,15 @@ private fun ModuleList(
723729
state = pullToRefreshState,
724730
indicator = { PullToRefreshDefaults.LoadingIndicator(state = pullToRefreshState, isRefreshing = viewModel.isRefreshing, modifier = Modifier.align(Alignment.TopCenter)) }
725731
) {
726-
LazyColumn(
732+
val configuration = LocalConfiguration.current
733+
val isWideScreen = configuration.screenWidthDp >= 600
734+
735+
LazyVerticalGrid(
736+
columns = GridCells.Fixed(if (isWideScreen) 2 else 1),
727737
modifier = Modifier.fillMaxSize(),
728738
state = state,
729739
verticalArrangement = Arrangement.spacedBy(16.dp),
740+
horizontalArrangement = Arrangement.spacedBy(16.dp),
730741
contentPadding = remember {
731742
PaddingValues(
732743
start = 16.dp,
@@ -738,7 +749,7 @@ private fun ModuleList(
738749
) {
739750
// Warning Banner
740751
if (showMountWarning) {
741-
item {
752+
item(span = { GridItemSpan(maxLineSpan) }) {
742753
Surface(
743754
modifier = Modifier.fillMaxWidth(),
744755
color = MaterialTheme.colorScheme.errorContainer.copy(alpha = 0.3f),
@@ -805,9 +816,9 @@ private fun ModuleList(
805816

806817
when {
807818
modules.isEmpty() -> {
808-
item {
819+
item(span = { GridItemSpan(maxLineSpan) }) {
809820
Box(
810-
modifier = Modifier.fillParentMaxSize(),
821+
modifier = Modifier.fillMaxSize(),
811822
contentAlignment = Alignment.Center
812823
) {
813824
Text(
@@ -818,7 +829,7 @@ private fun ModuleList(
818829
}
819830

820831
else -> {
821-
itemsIndexed(modules, key = { _, module -> module.id }) { index, module ->
832+
gridItemsIndexed(modules, key = { _, module -> module.id }) { index, module ->
822833
var isChecked by rememberSaveable(module) { mutableStateOf(module.enabled) }
823834
val scope = rememberCoroutineScope()
824835
val updatedModule = viewModel.getCachedUpdate(module.id)
@@ -881,8 +892,6 @@ private fun ModuleList(
881892
onClick = { clickedModule ->
882893
onClickModule(clickedModule.id, clickedModule.name, clickedModule.hasWebUi)
883894
})
884-
// fix last item shadow incomplete in LazyColumn
885-
Spacer(Modifier.height(1.dp))
886895
}
887896
}
888897
}

app/src/main/java/me/bmax/apatch/ui/screen/KPM.kt

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,12 @@ import androidx.compose.foundation.lazy.LazyListState
3535
import androidx.compose.foundation.lazy.items
3636
import androidx.compose.foundation.lazy.itemsIndexed
3737
import androidx.compose.foundation.lazy.rememberLazyListState
38+
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
39+
import androidx.compose.foundation.lazy.grid.GridCells
40+
import androidx.compose.foundation.lazy.grid.GridItemSpan
41+
import androidx.compose.foundation.lazy.grid.LazyGridState
42+
import androidx.compose.foundation.lazy.grid.itemsIndexed as gridItemsIndexed
43+
import androidx.compose.foundation.lazy.grid.rememberLazyGridState
3844
import androidx.compose.foundation.shape.RoundedCornerShape
3945
import androidx.compose.foundation.text.KeyboardOptions
4046
import androidx.compose.foundation.text.KeyboardActions
@@ -240,7 +246,7 @@ fun KPModuleScreen(navigator: DestinationsNavigator) {
240246
}
241247
}
242248

243-
val kpModuleListState = rememberLazyListState()
249+
val kpModuleListState = rememberLazyGridState()
244250

245251
var searchQuery by remember { mutableStateOf("") }
246252
val filteredModuleList = remember(viewModel.moduleList, searchQuery) {
@@ -657,7 +663,7 @@ private fun KPModuleList(
657663
viewModel: KPModuleViewModel,
658664
moduleList: List<KPModel.KPMInfo>,
659665
modifier: Modifier = Modifier,
660-
state: LazyListState,
666+
state: LazyGridState,
661667
showMoreModuleInfo: Boolean,
662668
foldSystemModule: Boolean,
663669
simpleListBottomBar: Boolean,
@@ -709,10 +715,15 @@ private fun KPModuleList(
709715
state = pullToRefreshState,
710716
indicator = { PullToRefreshDefaults.LoadingIndicator(state = pullToRefreshState, isRefreshing = viewModel.isRefreshing, modifier = Modifier.align(Alignment.TopCenter)) }
711717
) {
712-
LazyColumn(
718+
val configuration = LocalConfiguration.current
719+
val isWideScreen = configuration.screenWidthDp >= 600
720+
721+
LazyVerticalGrid(
722+
columns = GridCells.Fixed(if (isWideScreen) 2 else 1),
713723
modifier = Modifier.fillMaxSize(),
714724
state = state,
715725
verticalArrangement = Arrangement.spacedBy(16.dp),
726+
horizontalArrangement = Arrangement.spacedBy(16.dp),
716727
contentPadding = remember {
717728
PaddingValues(
718729
start = 16.dp,
@@ -724,9 +735,9 @@ private fun KPModuleList(
724735
) {
725736
when {
726737
moduleList.isEmpty() -> {
727-
item {
738+
item(span = { GridItemSpan(maxLineSpan) }) {
728739
Box(
729-
modifier = Modifier.fillParentMaxSize(),
740+
modifier = Modifier.fillMaxSize(),
730741
contentAlignment = Alignment.Center
731742
) {
732743
Text(
@@ -737,7 +748,7 @@ private fun KPModuleList(
737748
}
738749

739750
else -> {
740-
itemsIndexed(moduleList, key = { _, module -> module.name }) { index, module ->
751+
gridItemsIndexed(moduleList, key = { _, module -> module.name }) { index, module ->
741752
val scope = rememberCoroutineScope()
742753
KPModuleItem(
743754
module,
@@ -760,9 +771,6 @@ private fun KPModuleList(
760771
expandedModuleId = if (expandedModuleId == module.name) null else module.name
761772
}
762773
)
763-
764-
// fix last item shadow incomplete in LazyColumn
765-
Spacer(Modifier.height(1.dp))
766774
}
767775
}
768776
}

app/src/main/java/me/bmax/apatch/ui/screen/OnlineKPMScreen.kt

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ import android.widget.Toast
55
import androidx.compose.foundation.clickable
66
import androidx.compose.foundation.layout.*
77
import androidx.compose.foundation.lazy.LazyColumn
8-
import androidx.compose.foundation.lazy.items
8+
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
9+
import androidx.compose.foundation.lazy.grid.GridCells
10+
import androidx.compose.foundation.lazy.grid.items as gridItems
911
import androidx.compose.foundation.shape.RoundedCornerShape
1012
import androidx.compose.material.icons.Icons
1113
import androidx.compose.material.icons.automirrored.filled.ArrowBack
@@ -17,6 +19,7 @@ import androidx.compose.runtime.*
1719
import androidx.compose.ui.Alignment
1820
import androidx.compose.ui.Modifier
1921
import androidx.compose.ui.graphics.Color
22+
import androidx.compose.ui.platform.LocalConfiguration
2023
import androidx.compose.ui.platform.LocalContext
2124
import androidx.compose.ui.res.stringResource
2225
import androidx.compose.ui.text.font.FontWeight
@@ -121,12 +124,17 @@ fun OnlineKPMScreen(navigator: DestinationsNavigator) {
121124
}
122125
}
123126
} else {
124-
LazyColumn(
127+
val configuration = LocalConfiguration.current
128+
val isWideScreen = configuration.screenWidthDp >= 600
129+
130+
LazyVerticalGrid(
131+
columns = GridCells.Fixed(if (isWideScreen) 2 else 1),
125132
modifier = Modifier.fillMaxSize(),
126133
contentPadding = PaddingValues(16.dp),
127-
verticalArrangement = Arrangement.spacedBy(8.dp)
134+
verticalArrangement = Arrangement.spacedBy(8.dp),
135+
horizontalArrangement = Arrangement.spacedBy(8.dp)
128136
) {
129-
items(viewModel.modules) { module ->
137+
gridItems(viewModel.modules) { module ->
130138
OnlineKPMItem(module, context)
131139
}
132140
}

app/src/main/java/me/bmax/apatch/ui/screen/OnlineModuleScreen.kt

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import android.content.Context
44
import android.widget.Toast
55
import androidx.compose.foundation.layout.*
66
import androidx.compose.foundation.lazy.LazyColumn
7-
import androidx.compose.foundation.lazy.items
7+
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
8+
import androidx.compose.foundation.lazy.grid.GridCells
9+
import androidx.compose.foundation.lazy.grid.items as gridItems
810
import androidx.compose.foundation.shape.RoundedCornerShape
911
import androidx.compose.material.icons.Icons
1012
import androidx.compose.material.icons.automirrored.filled.ArrowBack
@@ -16,6 +18,7 @@ import androidx.compose.runtime.*
1618
import androidx.compose.ui.Alignment
1719
import androidx.compose.ui.Modifier
1820
import androidx.compose.ui.graphics.Color
21+
import androidx.compose.ui.platform.LocalConfiguration
1922
import androidx.compose.ui.platform.LocalContext
2023
import androidx.compose.ui.res.stringResource
2124
import androidx.compose.ui.text.font.FontWeight
@@ -122,12 +125,17 @@ fun OnlineModuleScreen(navigator: DestinationsNavigator) {
122125
}
123126
}
124127
} else {
125-
LazyColumn(
128+
val configuration = LocalConfiguration.current
129+
val isWideScreen = configuration.screenWidthDp >= 600
130+
131+
LazyVerticalGrid(
132+
columns = GridCells.Fixed(if (isWideScreen) 2 else 1),
126133
modifier = Modifier.fillMaxSize(),
127134
contentPadding = PaddingValues(16.dp),
128-
verticalArrangement = Arrangement.spacedBy(8.dp)
135+
verticalArrangement = Arrangement.spacedBy(8.dp),
136+
horizontalArrangement = Arrangement.spacedBy(8.dp)
129137
) {
130-
items(viewModel.modules) { module ->
138+
gridItems(viewModel.modules) { module ->
131139
OnlineModuleItem(module, context)
132140
}
133141
}

0 commit comments

Comments
 (0)