Add compose to project. display history with compose.

app/build.gradle

@@ -26,13 +26,16 @@ android {
 
     defaultConfig {
         applicationId "me.zobrist.tichucounter"
-        minSdkVersion 16
+        minSdkVersion 21
         targetSdkVersion 33
         versionCode versionProperties["versionCode"].toInteger()
         versionName "1.1.0Beta1"
         resConfigs("de", "en")
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
         multiDexEnabled true
+        vectorDrawables {
+            useSupportLibrary true
+        }
     }
     signingConfigs {
         create("release") {
@@ -53,6 +56,11 @@ android {
 
     buildFeatures {
         viewBinding = true
+        compose = true
+    }
+
+    composeOptions {
+        kotlinCompilerExtensionVersion = "1.3.2"
     }
 
     compileOptions {
@@ -63,6 +71,11 @@ android {
         jvmTarget = '1.8'
     }
     namespace 'me.zobrist.tichucounter'
+    packagingOptions {
+        resources {
+            excludes += '/META-INF/{AL2.0,LGPL2.1}'
+        }
+    }
 }
 
 dependencies {
@@ -70,7 +83,7 @@ dependencies {
     implementation "org.jetbrains.kotlin:kotlin-stdlib:$kotlin_version"
     implementation 'androidx.core:core-ktx:1.9.0'
     implementation 'androidx.appcompat:appcompat:1.6.0-rc01'
-    implementation 'com.google.android.material:material:1.7.0'
+    implementation "androidx.compose.material3:material3:1.0.1"
     implementation 'com.google.android.play:core-ktx:1.8.1'
     implementation 'com.google.android.play:core-ktx:1.8.1'
     implementation 'com.google.code.gson:gson:2.8.9'
@@ -83,10 +96,18 @@ dependencies {
     implementation 'androidx.fragment:fragment-ktx:1.5.5'
     implementation 'androidx.preference:preference-ktx:1.2.0'
     implementation 'androidx.recyclerview:recyclerview:1.2.1'
+    implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.3.1'
+    implementation 'androidx.activity:activity-compose:1.3.1'
+    implementation "androidx.compose.ui:ui:$compose_version"
+    implementation "androidx.compose.ui:ui-tooling-preview:$compose_version"
+    implementation "androidx.compose.runtime:runtime-livedata:$compose_version"
     testImplementation 'junit:junit:4.13.2'
     androidTestImplementation 'androidx.test.ext:junit:1.1.5'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
     implementation "com.google.dagger:hilt-android:2.44"
+    androidTestImplementation "androidx.compose.ui:ui-test-junit4:$compose_version"
+    debugImplementation "androidx.compose.ui:ui-tooling:$compose_version"
+    debugImplementation "androidx.compose.ui:ui-test-manifest:$compose_version"
     kapt "com.google.dagger:hilt-compiler:2.44"
     implementation("androidx.room:room-runtime:2.4.3")
     annotationProcessor("androidx.room:room-compiler:2.4.3")

app/src/main/AndroidManifest.xml

@@ -12,12 +12,16 @@
         android:roundIcon="@mipmap/ic_launcher_round"
         android:supportsRtl="true"
         android:theme="@style/AppTheme">
-
         <activity
             android:name=".MainActivity"
-            android:exported="true"
+            android:exported="false"
-            android:theme="@style/AppTheme.NoActionBar"
+            android:label="@string/title_activity_main"
+            android:theme="@style/AppTheme"
             android:windowSoftInputMode="adjustPan">
+            <meta-data
+                android:name="android.app.lib_name"
+                android:value="" />
+
             <intent-filter>
                 <action android:name="android.intent.action.MAIN" />
 

app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryFragment.kt

@@ -4,13 +4,28 @@ import android.os.Bundle
 import android.view.LayoutInflater
 import android.view.View
 import android.view.ViewGroup
+import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material3.Card
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.livedata.observeAsState
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.ComposeView
+import androidx.compose.ui.platform.ViewCompositionStrategy
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
 import androidx.fragment.app.Fragment
 import androidx.fragment.app.activityViewModels
-import androidx.recyclerview.widget.GridLayoutManager
-import androidx.recyclerview.widget.LinearLayoutManager
-import androidx.recyclerview.widget.RecyclerView
 import dagger.hilt.android.AndroidEntryPoint
-import me.zobrist.tichucounter.R
+import me.zobrist.tichucounter.data.GameAndScore
+
 
 /**
  * A fragment representing a list of Items.
@@ -20,49 +35,56 @@ class HistoryFragment : Fragment() {
 
     private val viewModel: HistoryFragmentViewModel by activityViewModels()
     
-    private var columnCount = 1
-
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-
-        arguments?.let {
-            columnCount = it.getInt(ARG_COLUMN_COUNT)
-        }
-    }
 
     override fun onCreateView(
-        inflater: LayoutInflater, container: ViewGroup?,
+        inflater: LayoutInflater,
+        container: ViewGroup?,
         savedInstanceState: Bundle?
-    ): View? {
+    ): View {
-        val view = inflater.inflate(R.layout.fragment_history_list, container, false)
+        return ComposeView(requireContext()).apply {
-
+            // Dispose of the Composition when the view's LifecycleOwner
-        // Set the adapter
+            // is destroyed
-        if (view is RecyclerView) {
+            setViewCompositionStrategy(ViewCompositionStrategy.DisposeOnViewTreeLifecycleDestroyed)
-            with(view) {
+            setContent {
-                layoutManager = when {
+                MaterialTheme {
-                    columnCount <= 1 -> LinearLayoutManager(context)
+                    // In Compose world
-                    else -> GridLayoutManager(context, columnCount)
+                    Text("Hello Compose!")
-                }
+                    HistoryList(viewModel)
-
-                viewModel.gameAndHistory.observe(viewLifecycleOwner) {
-                    adapter = MyGameRecyclerViewAdapter(it)
                 }
             }
         }
-        return view
     }
 
 
-    companion object {
+    @Composable
+    fun HistoryList(viewModel: HistoryFragmentViewModel) {
+        val games = viewModel.gameAndHistory.observeAsState().value
 
-        const val ARG_COLUMN_COUNT = "1"
+        LazyColumn {
-
+            if(games != null)
-        @JvmStatic
+            {
-        fun newInstance(columnCount: Int) =
+                items(games) {
-            HistoryFragment().apply {
+                    HistoryListItem(it)
-                arguments = Bundle().apply {
-                    putInt(ARG_COLUMN_COUNT, columnCount)
                 }
             }
+        }
+    }
+
+    @Composable
+    fun HistoryListItem(game: GameAndScore){
+        Card() {
+            Row(
+                verticalAlignment = Alignment.CenterVertically,
+                modifier = Modifier.padding(horizontal = 15.dp, vertical = 10.dp)
+            ){
+                Text( text = game.nameA + " - " + game.nameB)
+                Column(
+                    modifier = Modifier.padding(start = 10.dp)
+                ){
+                    Text(text = game.scoreA.toString() + ":" + game.scoreB, fontSize = 22.sp)
+                    Text(text = game.modified.toString(), fontSize = 18.sp)
+                }
+            }
+        }
     }
 }

app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryFragmentCompose.kt

@@ -0,0 +1,13 @@
+package me.zobrist.tichucounter.ui.history
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.items
+import androidx.compose.material3.Card
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import me.zobrist.tichucounter.data.GameAndScore
+

app/src/main/java/me/zobrist/tichucounter/ui/history/HistoryFragmentViewModel.kt

@@ -1,5 +1,6 @@
 package me.zobrist.tichucounter.ui.history
 
+import androidx.compose.runtime.State
 import androidx.lifecycle.LiveData
 import androidx.lifecycle.MutableLiveData
 import androidx.lifecycle.ViewModel

app/src/main/java/me/zobrist/tichucounter/ui/history/ui/theme/Color.kt

@@ -0,0 +1,11 @@
+package me.zobrist.tichucounter.ui.history.ui.theme
+
+import androidx.compose.ui.graphics.Color
+
+val Purple80 = Color(0xFFD0BCFF)
+val PurpleGrey80 = Color(0xFFCCC2DC)
+val Pink80 = Color(0xFFEFB8C8)
+
+val Purple40 = Color(0xFF6650a4)
+val PurpleGrey40 = Color(0xFF625b71)
+val Pink40 = Color(0xFF7D5260)

app/src/main/java/me/zobrist/tichucounter/ui/history/ui/theme/Theme.kt

@@ -0,0 +1,68 @@
+package me.zobrist.tichucounter.ui.history.ui.theme
+
+import android.app.Activity
+import android.os.Build
+import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.darkColorScheme
+import androidx.compose.material3.dynamicDarkColorScheme
+import androidx.compose.material3.dynamicLightColorScheme
+import androidx.compose.material3.lightColorScheme
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.SideEffect
+import androidx.compose.ui.graphics.toArgb
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalView
+import androidx.core.view.ViewCompat
+
+private val DarkColorScheme = darkColorScheme(
+    primary = Purple80,
+    secondary = PurpleGrey80,
+    tertiary = Pink80
+)
+
+private val LightColorScheme = lightColorScheme(
+    primary = Purple40,
+    secondary = PurpleGrey40,
+    tertiary = Pink40
+
+    /* Other default colors to override
+    background = Color(0xFFFFFBFE),
+    surface = Color(0xFFFFFBFE),
+    onPrimary = Color.White,
+    onSecondary = Color.White,
+    onTertiary = Color.White,
+    onBackground = Color(0xFF1C1B1F),
+    onSurface = Color(0xFF1C1B1F),
+    */
+)
+
+@Composable
+fun TichuCounterTheme(
+    darkTheme: Boolean = isSystemInDarkTheme(),
+    // Dynamic color is available on Android 12+
+    dynamicColor: Boolean = true,
+    content: @Composable () -> Unit
+) {
+    val colorScheme = when {
+        dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
+            val context = LocalContext.current
+            if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
+        }
+        darkTheme -> DarkColorScheme
+        else -> LightColorScheme
+    }
+    val view = LocalView.current
+    if (!view.isInEditMode) {
+        SideEffect {
+            (view.context as Activity).window.statusBarColor = colorScheme.primary.toArgb()
+            ViewCompat.getWindowInsetsController(view)?.isAppearanceLightStatusBars = darkTheme
+        }
+    }
+
+    MaterialTheme(
+        colorScheme = colorScheme,
+        typography = Typography,
+        content = content
+    )
+}

app/src/main/java/me/zobrist/tichucounter/ui/history/ui/theme/Type.kt

@@ -0,0 +1,34 @@
+package me.zobrist.tichucounter.ui.history.ui.theme
+
+import androidx.compose.material3.Typography
+import androidx.compose.ui.text.TextStyle
+import androidx.compose.ui.text.font.FontFamily
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.unit.sp
+
+// Set of Material typography styles to start with
+val Typography = Typography(
+    bodyLarge = TextStyle(
+        fontFamily = FontFamily.Default,
+        fontWeight = FontWeight.Normal,
+        fontSize = 16.sp,
+        lineHeight = 24.sp,
+        letterSpacing = 0.5.sp
+    )
+    /* Other default text styles to override
+    titleLarge = TextStyle(
+        fontFamily = FontFamily.Default,
+        fontWeight = FontWeight.Normal,
+        fontSize = 22.sp,
+        lineHeight = 28.sp,
+        letterSpacing = 0.sp
+    ),
+    labelSmall = TextStyle(
+        fontFamily = FontFamily.Default,
+        fontWeight = FontWeight.Medium,
+        fontSize = 11.sp,
+        lineHeight = 16.sp,
+        letterSpacing = 0.5.sp
+    )
+    */
+)

app/src/main/res/drawable/ic_baseline_add_24.xml

@@ -5,6 +5,6 @@
     android:viewportWidth="24"
     android:viewportHeight="24">
     <path
-        android:fillColor="@color/colorPrimary"
+        android:fillColor="@color/primaryColor"
         android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z" />
 </vector>

app/src/main/res/drawable/ic_baseline_undo_24.xml

@@ -6,6 +6,6 @@
     android:viewportWidth="24"
     android:viewportHeight="24">
     <path
-        android:fillColor="@color/colorPrimary"
+        android:fillColor="@color/primaryColor"
         android:pathData="M12.5,8c-2.65,0 -5.05,0.99 -6.9,2.6L2,7v9h9l-3.62,-3.62c1.39,-1.16 3.16,-1.88 5.12,-1.88 3.54,0 6.55,2.31 7.6,5.5l2.37,-0.78C21.08,11.03 17.15,8 12.5,8z" />
 </vector>

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

@@ -1,6 +1,12 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="colorPrimary">@color/ic_launcher_background</color>
+    <color name="primaryColor">#d50000</color>
-    <color name="colorPrimaryDark">#830000</color>
+    <color name="primaryLightColor">#ff5131</color>
-    <color name="colorAccent">#F57F17</color>
+    <color name="primaryDarkColor">#9b0000</color>
+    <color name="secondaryColor">#ffccbc</color>
+    <color name="secondaryLightColor">#ffffee</color>
+    <color name="secondaryDarkColor">#cb9b8c</color>
+    <color name="primaryTextColor">#ffffff</color>
+    <color name="secondaryTextColor">#000000</color>
+
 </resources>

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

@@ -1,4 +1,4 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <color name="ic_launcher_background">#DC0E00</color>
+    <color name="ic_launcher_background">@color/primaryColor</color>
 </resources>

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

@@ -30,4 +30,5 @@
     <string name="activate">Activate</string>
     <string name="delete">Delete</string>
     <string name="submit">Submit</string>
+    <string name="title_activity_main">MainActivity</string>
 </resources>

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

@@ -1,11 +1,3 @@
 <resources>
-    <!-- Base application theme. -->
-    <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
-        <!-- Customize your theme here. -->
-        <item name="colorPrimary">@color/colorPrimary</item>
-        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
-        <item name="colorAccent">@color/colorAccent</item>
-
-    </style>
 
 </resources>

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

@@ -1,11 +1,14 @@
 <resources>
 
-    <style name="AppTheme.NoActionBar">
+    <style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">
-        <item name="windowActionBar">false</item>
+        <!-- Customize your theme here. -->
-        <item name="windowNoTitle">true</item>
+        <item name="colorPrimary">@color/primaryColor</item>
+        <item name="colorPrimaryDark">@color/primaryDarkColor</item>
+        <item name="colorAccent">@color/secondaryColor</item>
+
     </style>
 
-    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
+    <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar" />
 
-    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
+    <style name="AppTheme.PopupOverlay" parent="ThemeOverlay.MaterialComponents.Light" />
 </resources>

build.gradle

@@ -1,5 +1,8 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 buildscript {
+    ext {
+        compose_version = '1.1.1'
+    }
     ext.kotlin_version = "1.7.20"
     repositories {
         google()