Add AboutScreen

This commit is contained in:
vfsfitvnm 2022-06-07 22:11:35 +02:00
parent 2339b2a4da
commit 239489ba30
6 changed files with 194 additions and 10 deletions

View file

@ -19,10 +19,7 @@ import it.vfsfitvnm.route.*
import it.vfsfitvnm.vimusic.R
import it.vfsfitvnm.vimusic.ui.components.TopAppBar
import it.vfsfitvnm.vimusic.ui.components.themed.EnumValueSelectorDialog
import it.vfsfitvnm.vimusic.ui.screens.settings.AppearanceScreen
import it.vfsfitvnm.vimusic.ui.screens.settings.BackupAndRestoreScreen
import it.vfsfitvnm.vimusic.ui.screens.settings.rememberAppearanceRoute
import it.vfsfitvnm.vimusic.ui.screens.settings.rememberBackupAndRestoreRoute
import it.vfsfitvnm.vimusic.ui.screens.settings.*
import it.vfsfitvnm.vimusic.ui.styling.LocalColorPalette
import it.vfsfitvnm.vimusic.ui.styling.LocalTypography
import it.vfsfitvnm.vimusic.utils.medium
@ -36,6 +33,7 @@ fun SettingsScreen() {
val artistRoute = rememberArtistRoute()
val appearanceRoute = rememberAppearanceRoute()
val backupAndRestoreRoute = rememberBackupAndRestoreRoute()
val aboutRoute = rememberAboutRoute()
val scrollState = rememberScrollState()
@ -43,9 +41,9 @@ fun SettingsScreen() {
listenToGlobalEmitter = true,
transitionSpec = {
when (targetState.route) {
appearanceRoute, backupAndRestoreRoute -> leftSlide
appearanceRoute, backupAndRestoreRoute, aboutRoute -> leftSlide
else -> when (initialState.route) {
appearanceRoute, backupAndRestoreRoute -> rightSlide
appearanceRoute, backupAndRestoreRoute, aboutRoute -> rightSlide
else -> fastFade
}
}
@ -71,6 +69,10 @@ fun SettingsScreen() {
BackupAndRestoreScreen()
}
aboutRoute {
AboutScreen()
}
host {
val colorPalette = LocalColorPalette.current
val typography = LocalTypography.current
@ -149,14 +151,12 @@ fun SettingsScreen() {
BasicText(
text = title,
style = typography.s.semiBold,
modifier = Modifier
)
BasicText(
text = description,
style = typography.xs.secondary.medium,
maxLines = 1,
modifier = Modifier
maxLines = 1
)
}
}
@ -177,6 +177,14 @@ fun SettingsScreen() {
description = "Backup and restore the app database",
route = backupAndRestoreRoute
)
Entry(
color = colorPalette.green,
icon = R.drawable.information,
title = "About",
description = "App version and social links",
route = aboutRoute
)
}
}
}

View file

@ -0,0 +1,138 @@
package it.vfsfitvnm.vimusic.ui.screens.settings
import androidx.compose.animation.ExperimentalAnimationApi
import androidx.compose.foundation.*
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.BasicText
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.ColorFilter
import androidx.compose.ui.platform.LocalUriHandler
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.unit.dp
import it.vfsfitvnm.route.RouteHandler
import it.vfsfitvnm.vimusic.BuildConfig
import it.vfsfitvnm.vimusic.R
import it.vfsfitvnm.vimusic.ui.components.TopAppBar
import it.vfsfitvnm.vimusic.ui.screens.ArtistScreen
import it.vfsfitvnm.vimusic.ui.screens.PlaylistOrAlbumScreen
import it.vfsfitvnm.vimusic.ui.screens.rememberArtistRoute
import it.vfsfitvnm.vimusic.ui.screens.rememberPlaylistOrAlbumRoute
import it.vfsfitvnm.vimusic.ui.styling.LocalColorPalette
import it.vfsfitvnm.vimusic.ui.styling.LocalTypography
import it.vfsfitvnm.vimusic.utils.bold
import it.vfsfitvnm.vimusic.utils.secondary
import it.vfsfitvnm.vimusic.utils.semiBold
@ExperimentalAnimationApi
@Composable
fun AboutScreen() {
val albumRoute = rememberPlaylistOrAlbumRoute()
val artistRoute = rememberArtistRoute()
val scrollState = rememberScrollState()
RouteHandler(listenToGlobalEmitter = true) {
albumRoute { browseId ->
PlaylistOrAlbumScreen(
browseId = browseId ?: error("browseId cannot be null")
)
}
artistRoute { browseId ->
ArtistScreen(
browseId = browseId ?: error("browseId cannot be null")
)
}
host {
val colorPalette = LocalColorPalette.current
val typography = LocalTypography.current
val uriHandler = LocalUriHandler.current
Column(
modifier = Modifier
.background(colorPalette.background)
.fillMaxSize()
.verticalScroll(scrollState)
.padding(bottom = 72.dp)
) {
TopAppBar(
modifier = Modifier
.height(52.dp)
) {
Image(
painter = painterResource(R.drawable.chevron_back),
contentDescription = null,
colorFilter = ColorFilter.tint(colorPalette.text),
modifier = Modifier
.clickable(onClick = pop)
.padding(horizontal = 16.dp, vertical = 8.dp)
.size(24.dp)
)
BasicText(
text = "About",
style = typography.m.semiBold
)
Image(
painter = painterResource(R.drawable.logo_github),
contentDescription = null,
colorFilter = ColorFilter.tint(colorPalette.text),
modifier = Modifier
.clickable {
uriHandler.openUri("https://github.com/vfsfitvnm/ViMusic")
}
.padding(horizontal = 16.dp, vertical = 8.dp)
.size(24.dp)
)
}
Column(
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(16.dp),
modifier = Modifier
.padding(all = 32.dp)
.align(Alignment.CenterHorizontally)
) {
Box(
contentAlignment = Alignment.Center,
modifier = Modifier
.background(color = colorPalette.primaryContainer, shape = CircleShape)
.padding(all = 16.dp)
.size(48.dp)
) {
Image(
painter = painterResource(R.drawable.app_icon),
contentDescription = null,
colorFilter = ColorFilter.tint(colorPalette.onPrimaryContainer),
modifier = Modifier
.size(32.dp)
)
}
Row(
horizontalArrangement = Arrangement.spacedBy(8.dp),
verticalAlignment = Alignment.Bottom
) {
BasicText(
text = "ViMusic",
style = typography.l.bold,
modifier = Modifier
.alignByBaseline()
)
BasicText(
text = "v${BuildConfig.VERSION_NAME}",
style = typography.s.bold.secondary,
modifier = Modifier
.alignByBaseline()
)
}
}
}
}
}
}

View file

@ -17,3 +17,10 @@ fun rememberBackupAndRestoreRoute(): Route0 {
Route0("BackupAndRestoreRoute")
}
}
@Composable
fun rememberAboutRoute(): Route0 {
return remember {
Route0("AboutRoute")
}
}

View file

@ -37,7 +37,7 @@ val DarkColorPalette = ColorPalette(
darkGray = Color(0xFF838383),
blue = Color(0xff507fdd),
red = Color(0xffbf4040),
green = Color(0xff7fbf40),
green = Color(0xff82b154),
orange = Color(0xffe9a033),
primaryContainer = Color(0xff4046bf),

View file

@ -0,0 +1,22 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="512"
android:viewportHeight="512">
<path
android:pathData="M196,220l64,0l0,172"
android:strokeLineJoin="round"
android:strokeWidth="40"
android:fillColor="#00000000"
android:strokeColor="#000"
android:strokeLineCap="round"/>
<path
android:pathData="M187,396L325,396"
android:strokeWidth="40"
android:fillColor="#00000000"
android:strokeColor="#000"
android:strokeLineCap="round"/>
<path
android:fillColor="#FF000000"
android:pathData="M256,160a32,32 0,1 1,32 -32A32,32 0,0 1,256 160Z"/>
</vector>

View file

@ -0,0 +1,9 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="24dp"
android:height="24dp"
android:viewportWidth="512"
android:viewportHeight="512">
<path
android:fillColor="#FF000000"
android:pathData="M256,32C132.3,32 32,134.9 32,261.7c0,101.5 64.2,187.5 153.2,217.9a17.56,17.56 0,0 0,3.8 0.4c8.3,0 11.5,-6.1 11.5,-11.4 0,-5.5 -0.2,-19.9 -0.3,-39.1a102.4,102.4 0,0 1,-22.6 2.7c-43.1,0 -52.9,-33.5 -52.9,-33.5 -10.2,-26.5 -24.9,-33.6 -24.9,-33.6 -19.5,-13.7 -0.1,-14.1 1.4,-14.1h0.1c22.5,2 34.3,23.8 34.3,23.8 11.2,19.6 26.2,25.1 39.6,25.1a63,63 0,0 0,25.6 -6c2,-14.8 7.8,-24.9 14.2,-30.7 -49.7,-5.8 -102,-25.5 -102,-113.5 0,-25.1 8.7,-45.6 23,-61.6 -2.3,-5.8 -10,-29.2 2.2,-60.8a18.64,18.64 0,0 1,5 -0.5c8.1,0 26.4,3.1 56.6,24.1a208.21,208.21 0,0 1,112.2 0c30.2,-21 48.5,-24.1 56.6,-24.1a18.64,18.64 0,0 1,5 0.5c12.2,31.6 4.5,55 2.2,60.8 14.3,16.1 23,36.6 23,61.6 0,88.2 -52.4,107.6 -102.3,113.3 8,7.1 15.2,21.1 15.2,42.5 0,30.7 -0.3,55.5 -0.3,63 0,5.4 3.1,11.5 11.4,11.5a19.35,19.35 0,0 0,4 -0.4C415.9,449.2 480,363.1 480,261.7 480,134.9 379.7,32 256,32Z"/>
</vector>