avior/Neo-Store
1
0
Fork 0
mirror of https://github.com/Aviortheking/Neo-Store.git synced 2025-06-09 17:29:55 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update: Break Header into a TopBar and an AppInfo block

Browse Source
This commit is contained in:
machiav3lli 2022-05-29 03:27:10 +02:00
parent 9b725c32a9
commit b235265219
1 changed files with 122 additions and 72 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

144
src/main/kotlin/com/looker/droidify/ui/compose/pages/app_detail/components/Header.kt
View File

@ -1,79 +1,102 @@
package com.looker.droidify.ui.compose.pages.app_detail.components package com.looker.droidify.ui.compose.pages.app_detail.components
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.foundation.clickable import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.layout.* import androidx.compose.foundation.combinedClickable
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.layout.Arrangement
import androidx.compose.material3.* import androidx.compose.foundation.layout.Box
import androidx.compose.runtime.* import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
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.layout.wrapContentHeight
import androidx.compose.material3.LinearProgressIndicator
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Shapes
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip import androidx.compose.ui.draw.clip
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import com.looker.droidify.R import com.looker.droidify.R
import com.looker.droidify.ui.compose.components.InstallButton import com.looker.droidify.entity.Cancelable
import com.looker.droidify.ui.compose.utils.* import com.looker.droidify.entity.Install
import com.looker.droidify.entity.PackageState
import com.looker.droidify.ui.compose.components.MainActionButton
import com.looker.droidify.ui.compose.components.SecondaryActionButton
import com.looker.droidify.ui.compose.utils.NetworkImage
import com.looker.droidify.utility.extension.text.formatSize import com.looker.droidify.utility.extension.text.formatSize
@Composable @Composable
fun Header( fun AppInfoHeader(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
icon: String?,
appName: String,
packageName: String,
versionCode: String, versionCode: String,
appSize: String, appSize: String,
appDev: String appDev: String,
state: PackageState? = Install,
secondaryAction: PackageState? = null,
onSource: () -> Unit = { },
onSourceLong: () -> Unit = { },
onAction: () -> Unit = { },
onSecondaryAction: () -> Unit = { }
) { ) {
Surface( Surface(
modifier = modifier.fillMaxWidth(), modifier = modifier.fillMaxWidth(),
shape = MaterialTheme.shapes.large shape = MaterialTheme.shapes.large
) { ) {
Column( Column(
modifier = Modifier.padding(8.dp),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.SpaceEvenly verticalArrangement = Arrangement.spacedBy(8.dp)
) { ) {
HeaderTitle(
modifier = Modifier.fillMaxWidth(),
icon = icon,
appName = appName,
packageName = packageName
)
HeaderExtra( HeaderExtra(
versionCode = versionCode, versionCode = versionCode,
appSize = appSize, appSize = appSize,
appDev = appDev appDev = appDev,
onSource = onSource,
onSourceLong = onSourceLong
) )
var buttonState by remember { mutableStateOf<ButtonStates>(Connecting) } Row(
horizontalArrangement = Arrangement.spacedBy(8.dp)
AnimatedVisibility(visible = buttonState is Cancelable) { ) {
DownloadProgress(modifier = Modifier.padding(horizontal = 12.dp), totalSize = 69420) SecondaryActionButton(packageState = secondaryAction, onClick = {
} onSecondaryAction()
})
InstallButton(buttonState = buttonState) { MainActionButton(
buttonState = when (it) { modifier = Modifier.weight(1f),
Connecting -> Download packageState = state ?: Install,
Download -> Downloading onClick = {
Downloading -> Install onAction()
Install -> Installing })
Installing -> Launch
Launch -> Connecting
}
} }
} }
} }
} }
@Composable @Composable
fun HeaderTitle( fun TopBarHeader(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
icon: String? = null, icon: String? = null,
appName: String, appName: String,
packageName: String, packageName: String,
state: PackageState? = Install,
actions: @Composable () -> Unit = {} actions: @Composable () -> Unit = {}
) { ) {
Surface(
modifier = modifier
.padding(start = 8.dp, top = 8.dp, end = 8.dp, bottom = 0.dp)
.fillMaxWidth(),
shape = MaterialTheme.shapes.large
) {
Column {
Row( Row(
modifier = modifier.padding(16.dp), modifier = modifier.padding(16.dp),
horizontalArrangement = Arrangement.Start, horizontalArrangement = Arrangement.Start,
@ -93,6 +116,16 @@ fun HeaderTitle(
} }
Box { actions() } Box { actions() }
} }
AnimatedVisibility(visible = state is Cancelable) {
DownloadProgress(
modifier = Modifier.padding(horizontal = 12.dp),
totalSize = 69420,
isIndeterminate = if (state is Cancelable) state.isIndeterminate else true
)
}
}
}
} }
@Composable @Composable
@ -100,12 +133,15 @@ fun HeaderExtra(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
versionCode: String, versionCode: String,
appSize: String, appSize: String,
appDev: String appDev: String,
onSource: () -> Unit,
onSourceLong: () -> Unit
) { ) {
Row( Row(
modifier = modifier modifier = modifier
.fillMaxWidth() .fillMaxWidth()
.wrapContentHeight() .wrapContentHeight(),
horizontalArrangement = Arrangement.spacedBy(8.dp)
) { ) {
HeaderExtrasCard( HeaderExtrasCard(
modifier = Modifier.weight(1f), modifier = Modifier.weight(1f),
@ -120,32 +156,36 @@ fun HeaderExtra(
HeaderExtrasCard( HeaderExtrasCard(
modifier = Modifier.weight(1f), modifier = Modifier.weight(1f),
title = stringResource(id = R.string.source_code), title = stringResource(id = R.string.source_code),
text = appDev text = appDev,
onClick = onSource,
onLongClick = onSourceLong
) )
} }
} }
@OptIn(ExperimentalFoundationApi::class)
@Composable @Composable
fun HeaderExtrasCard( fun HeaderExtrasCard(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
extra: @Composable () -> Unit = {}, extra: @Composable () -> Unit = {},
title: String, title: String,
text: String, text: String,
onClick: () -> Unit = {} onClick: () -> Unit = {},
onLongClick: () -> Unit = {}
) { ) {
Surface( Surface(
modifier = modifier modifier = modifier
.clip(RoundedCornerShape(50)) .clip(MaterialTheme.shapes.medium)
.clickable { onClick() } .combinedClickable(onClick = onClick, onLongClick = onLongClick)
.padding(16.dp) .padding(12.dp)
) { ) {
Column( Column(
verticalArrangement = Arrangement.SpaceEvenly, verticalArrangement = Arrangement.SpaceEvenly,
horizontalAlignment = Alignment.CenterHorizontally horizontalAlignment = Alignment.CenterHorizontally
) { ) {
extra() extra()
Text(text = title, style = MaterialTheme.typography.labelLarge) Text(text = title, style = MaterialTheme.typography.labelLarge, maxLines = 1)
Text(text = text, style = MaterialTheme.typography.bodyMedium) Text(text = text, style = MaterialTheme.typography.bodyMedium, maxLines = 1)
} }
} }
} }
@ -154,14 +194,23 @@ fun HeaderExtrasCard(
fun DownloadProgress( fun DownloadProgress(
modifier: Modifier = Modifier, modifier: Modifier = Modifier,
downloading: Float = 0f, downloading: Float = 0f,
totalSize: Long totalSize: Long,
isIndeterminate: Boolean
) { ) {
Column( Column(
modifier = modifier.fillMaxWidth(), modifier = modifier.fillMaxWidth(),
horizontalAlignment = Alignment.Start horizontalAlignment = Alignment.Start
) { ) {
if (isIndeterminate) {
LinearProgressIndicator(
modifier = Modifier
.fillMaxWidth()
.clip(Shapes.Full),
)
} else {
Text( Text(
text = totalSize.times(downloading).toLong().formatSize() + "/" + totalSize.formatSize() text = totalSize.times(downloading).toLong()
.formatSize() + "/" + totalSize.formatSize()
) )
Spacer(modifier = Modifier.height(8.dp)) Spacer(modifier = Modifier.height(8.dp))
LinearProgressIndicator( LinearProgressIndicator(
@ -172,3 +221,4 @@ fun DownloadProgress(
) )
} }
} }
}