From 15ec6971bd8629b5c795e046f468e4bc1abb2ee1 Mon Sep 17 00:00:00 2001 From: Alex Lockwood Date: Sun, 20 Oct 2024 11:03:10 -0400 Subject: [PATCH] cleanup multiplatform --- .../twentyfortyeight/ui/GameTopAppBar.kt | 12 ----- .../twentyfortyeight/ui/GameUi.kt | 48 +++++++++++------ .../twentyfortyeight/ui/GameTopAppBar.ios.kt | 53 ------------------- .../twentyfortyeight/ui/GameUi.ios.kt | 4 ++ .../ui/GameTopAppBar.nonIos.kt | 25 --------- .../twentyfortyeight/ui/GameUi.nonIos.kt | 5 ++ 6 files changed, 40 insertions(+), 107 deletions(-) delete mode 100644 composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.kt delete mode 100644 composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.ios.kt delete mode 100644 composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.nonIos.kt create mode 100644 composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.nonIos.kt diff --git a/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.kt b/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.kt deleted file mode 100644 index 0c0fd02..0000000 --- a/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.kt +++ /dev/null @@ -1,12 +0,0 @@ -package com.alexjlockwood.twentyfortyeight.ui - -import androidx.compose.runtime.Composable -import androidx.compose.ui.graphics.Color - -@Composable -expect fun GameTopAppBar( - title: @Composable () -> Unit, - contentColor: Color, - backgroundColor: Color, - actions: @Composable () -> Unit, -) diff --git a/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.kt b/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.kt index 53ba912..f5ada16 100644 --- a/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.kt +++ b/composeApp/src/commonMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.kt @@ -6,11 +6,13 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Add +import androidx.compose.material3.CenterAlignedTopAppBar +import androidx.compose.material3.ExperimentalMaterial3Api import androidx.compose.material3.Icon import androidx.compose.material3.IconButton -import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Scaffold import androidx.compose.material3.Text +import androidx.compose.material3.TopAppBar import androidx.compose.runtime.Composable import androidx.compose.runtime.LaunchedEffect import androidx.compose.runtime.getValue @@ -21,7 +23,6 @@ import androidx.compose.runtime.setValue import androidx.compose.ui.Modifier import androidx.compose.ui.focus.FocusRequester import androidx.compose.ui.focus.focusRequester -import androidx.compose.ui.graphics.Color import androidx.compose.ui.input.key.Key import androidx.compose.ui.input.key.KeyEvent import androidx.compose.ui.input.key.KeyEventType @@ -40,6 +41,7 @@ import kotlin.math.atan2 /** * Renders the 2048 game's home screen UI. */ +@OptIn(ExperimentalMaterial3Api::class) @Composable fun GameUi( gridTileMovements: List, @@ -79,16 +81,23 @@ fun GameUi( .focusRequester(focusRequester) .focusable(), topBar = { - GameTopAppBar( - title = { Text("2048") }, - contentColor = Color.White, - backgroundColor = MaterialTheme.colorScheme.secondary, - actions = { - IconButton(onClick = { shouldShowNewGameDialog = true }) { - Icon(Icons.Filled.Add, contentDescription = null) - } - }, - ) + val title = @Composable { Text("2048") } + val actions = @Composable { + IconButton(onClick = { shouldShowNewGameDialog = true }) { + Icon(Icons.Filled.Add, contentDescription = null) + } + } + if (shouldCenterAlignTopAppBar()) { + CenterAlignedTopAppBar( + title = title, + actions = { actions() }, + ) + } else { + TopAppBar( + title = title, + actions = { actions() }, + ) + } }, ) { innerPadding -> GameLayout( @@ -166,11 +175,11 @@ private fun TextLabel( } private val KeyEvent.direction: Direction? - get() = when { - key == Key.DirectionUp || key == Key.W -> Direction.NORTH - key == Key.DirectionLeft || key == Key.A -> Direction.WEST - key == Key.DirectionDown || key == Key.S -> Direction.SOUTH - key == Key.DirectionRight || key == Key.D -> Direction.EAST + get() = when (key) { + Key.DirectionUp, Key.W -> Direction.NORTH + Key.DirectionLeft, Key.A -> Direction.WEST + Key.DirectionDown, Key.S -> Direction.SOUTH + Key.DirectionRight, Key.D -> Direction.EAST else -> null } @@ -178,3 +187,8 @@ private val KeyEvent.direction: Direction? * Returns true if the platform should support moves via touch gestures. */ internal expect fun shouldDetectSwipes(): Boolean + +/** + * Returns true if the top app bar should be center aligned. + */ +internal expect fun shouldCenterAlignTopAppBar(): Boolean diff --git a/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.ios.kt b/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.ios.kt deleted file mode 100644 index bb37811..0000000 --- a/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.ios.kt +++ /dev/null @@ -1,53 +0,0 @@ -package com.alexjlockwood.twentyfortyeight.ui - -import androidx.compose.material3.CenterAlignedTopAppBar -import androidx.compose.material3.ExperimentalMaterial3Api -import androidx.compose.material3.Text -import androidx.compose.runtime.Composable -import androidx.compose.ui.graphics.Color - -@OptIn(ExperimentalMaterial3Api::class) -@Composable -actual fun GameTopAppBar( - title: @Composable () -> Unit, - contentColor: Color, - backgroundColor: Color, - actions: @Composable () -> Unit, -) { - CenterAlignedTopAppBar( - title = { Text("2048") }, -// colors = TopAppBarDefaults.centerAlignedTopAppBarColors( -// titleContentColor = contentColor, -// actionIconContentColor = contentColor, -// ), - actions = { actions() }, - ) - - // Custom app bar to ensure the title is center aligned on iOS. -// Surface( -// color = backgroundColor, -// contentColor = contentColor, -// ) { -// Box( -// Modifier -// .fillMaxWidth() -// .windowInsetsPadding(AppBarDefaults.topAppBarWindowInsets) -// .padding(AppBarDefaults.ContentPadding) -// .height(56.dp), -// ) { -// Box(Modifier.align(Alignment.Center)) { -// ProvideTextStyle(value = MaterialTheme.typography.h6) { -// CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) { -// title() -// } -// } -// } -// -// Box(Modifier.align(Alignment.CenterEnd)) { -// CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.medium) { -// actions() -// } -// } -// } -// } -} diff --git a/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.ios.kt b/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.ios.kt index 2a454eb..0d13f64 100644 --- a/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.ios.kt +++ b/composeApp/src/iosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.ios.kt @@ -3,3 +3,7 @@ package com.alexjlockwood.twentyfortyeight.ui internal actual fun shouldDetectSwipes(): Boolean { return true } + +internal actual fun shouldCenterAlignTopAppBar(): Boolean { + return true +} diff --git a/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.nonIos.kt b/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.nonIos.kt deleted file mode 100644 index 2b341fd..0000000 --- a/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameTopAppBar.nonIos.kt +++ /dev/null @@ -1,25 +0,0 @@ -package com.alexjlockwood.twentyfortyeight.ui - -import androidx.compose.material3.ExperimentalMaterial3Api -import androidx.compose.material3.TopAppBar -import androidx.compose.runtime.Composable -import androidx.compose.ui.graphics.Color - -@OptIn(ExperimentalMaterial3Api::class) -@Composable -actual fun GameTopAppBar( - title: @Composable () -> Unit, - contentColor: Color, - backgroundColor: Color, - actions: @Composable () -> Unit, -) { - TopAppBar( - title = title, -// colors = TopAppBarDefaults.topAppBarColors( -// containerColor = backgroundColor, -// titleContentColor = contentColor, -// actionIconContentColor = contentColor, -// ), - actions = { actions() }, - ) -} diff --git a/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.nonIos.kt b/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.nonIos.kt new file mode 100644 index 0000000..0784233 --- /dev/null +++ b/composeApp/src/nonIosMain/kotlin/com/alexjlockwood/twentyfortyeight/ui/GameUi.nonIos.kt @@ -0,0 +1,5 @@ +package com.alexjlockwood.twentyfortyeight.ui + +internal actual fun shouldCenterAlignTopAppBar(): Boolean { + return false +}