Add about page.

app/src/main/java/me/zobrist/tichucounter/MainActivity.kt

@@ -24,13 +24,14 @@ import kotlinx.coroutines.CoroutineScope
 import kotlinx.coroutines.launch
 import me.zobrist.tichucounter.domain.*
 import me.zobrist.tichucounter.ui.AppTheme
-import me.zobrist.tichucounter.ui.layout.DrawerContent
 import me.zobrist.tichucounter.ui.MainViewModel
-import me.zobrist.tichucounter.ui.layout.TopBar
+import me.zobrist.tichucounter.ui.about.AboutView
 import me.zobrist.tichucounter.ui.composables.DropDownMenu
 import me.zobrist.tichucounter.ui.counter.*
 import me.zobrist.tichucounter.ui.history.HistoryList
 import me.zobrist.tichucounter.ui.history.HistoryViewModel
+import me.zobrist.tichucounter.ui.layout.DrawerContent
+import me.zobrist.tichucounter.ui.layout.TopBar
 import me.zobrist.tichucounter.ui.settings.SettingsView
 import me.zobrist.tichucounter.ui.settings.SettingsViewModel
 import javax.inject.Inject
@@ -95,9 +96,22 @@ class MainActivity : AppCompatActivity(), ISettingsChangeListener {
         val navController = rememberNavController()
 
         val items = listOf(
-            DrawerItem(Route.COUNTER, Icons.Outlined.Calculate, stringResource(R.string.menu_counter)),
+            DrawerItem(
+                Route.COUNTER,
+                Icons.Outlined.Calculate,
+                stringResource(R.string.menu_counter)
+            ),
             DrawerItem(Route.HISTORY, Icons.Outlined.List, stringResource(R.string.menu_history)),
-            DrawerItem(Route.SETTINGS, Icons.Outlined.Settings, stringResource(R.string.menu_settings))
+            DrawerItem(
+                Route.SETTINGS,
+                Icons.Outlined.Settings,
+                stringResource(R.string.menu_settings)
+            ),
+            DrawerItem(
+                Route.ABOUT,
+                Icons.Outlined.Info,
+                stringResource(R.string.menu_about)
+            )
         )
 
         val navBackStackEntry by navController.currentBackStackEntryAsState()
@@ -207,6 +221,13 @@ class MainActivity : AppCompatActivity(), ISettingsChangeListener {
 
                     SettingsView(settingsViewModel)
                 }
+
+                composable(Route.ABOUT) {
+                    topBarState =
+                        TopBarState(title = stringResource(R.string.menu_about)) { scope.launch { drawerState.open() } }
+
+                    AboutView()
+                }
             }
         }
     }

app/src/main/java/me/zobrist/tichucounter/domain/Route.kt

@@ -1,3 +1,3 @@
 package me.zobrist.tichucounter.domain
 
-enum class Route { COUNTER, HISTORY, SETTINGS }
+enum class Route { COUNTER, HISTORY, SETTINGS, ABOUT }

app/src/main/java/me/zobrist/tichucounter/ui/about/AboutView.kt

@@ -0,0 +1,57 @@
+package me.zobrist.tichucounter.ui.about
+
+import android.content.res.Configuration
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Surface
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment.Companion.Top
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import me.zobrist.tichucounter.BuildConfig
+import me.zobrist.tichucounter.R
+import me.zobrist.tichucounter.ui.AppTheme
+
+
+@Composable
+fun AboutView() {
+    Row(Modifier.padding(20.dp)) {
+        Image(
+            modifier = Modifier
+                .height(80.dp)
+                .padding(end = 10.dp)
+                .align(Top),
+            painter = painterResource(R.drawable.app_logo),
+            contentDescription = null,
+            contentScale = ContentScale.Fit
+        )
+
+        Column {
+            Text(
+                text = stringResource(id = R.string.app_name),
+                style = MaterialTheme.typography.headlineMedium
+            )
+            Text(text = "V" + BuildConfig.VERSION_NAME)
+        }
+    }
+}
+
+@Preview(name = "Light Mode")
+@Preview(name = "Dark Mode", uiMode = Configuration.UI_MODE_NIGHT_YES, showBackground = true)
+@Composable
+fun AboutViewPreview() {
+    AppTheme() {
+        Surface {
+            AboutView()
+        }
+    }
+}

app/src/main/java/me/zobrist/tichucounter/ui/layout/DrawerContent.kt

@@ -1,8 +1,6 @@
 package me.zobrist.tichucounter.ui.layout
 
 import android.content.res.Configuration
-import androidx.compose.foundation.Image
-
 import androidx.compose.foundation.layout.*
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.*
@@ -10,11 +8,9 @@ import androidx.compose.material.icons.outlined.*
 import androidx.compose.material3.*
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
-import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import me.zobrist.tichucounter.BuildConfig
 import me.zobrist.tichucounter.R
 import me.zobrist.tichucounter.domain.*
 import me.zobrist.tichucounter.ui.AppTheme
@@ -30,7 +26,11 @@ fun DrawerContent(
 
     ModalDrawerSheet {
 
-        Text(modifier = Modifier.padding(start = 10.dp, top = 10.dp), text = stringResource(R.string.app_name), style = MaterialTheme.typography.headlineSmall)
+        Text(
+            modifier = Modifier.padding(start = 10.dp, top = 10.dp),
+            text = stringResource(R.string.app_name),
+            style = MaterialTheme.typography.headlineSmall
+        )
         Divider(modifier = Modifier.padding(10.dp))
 
         drawerItems.forEach { screen ->

app/src/main/res/values/strings.xml

@@ -25,4 +25,5 @@
     <string name="active">Current Game</string>
     <string name="inactive">Old Games</string>
     <string name="menu_counter">Counter</string>
+    <string name="menu_about">About</string>
 </resources>