APP-1424 | Playground Support (#3)

app/build.gradle

@@ -4,11 +4,11 @@ plugins {
 }
 
 android {
-    namespace 'com.navi'
+    namespace 'com.uitron.demo'
     compileSdk 32
 
     defaultConfig {
-        applicationId "com.navi"
+        applicationId "com.uitron.demo"
         minSdk 21
         targetSdk 32
         versionCode 1
@@ -63,4 +63,5 @@ dependencies {
     testImplementation "junit:junit:4.13.2"
     androidTestImplementation "androidx.test.ext:junit:1.1.4"
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
+    implementation "androidx.navigation:navigation-compose:$nav_version"
 }

app/src/main/java/com/navi/uitron/MainActivity.kt

@@ -1,23 +0,0 @@
-package com.navi.uitron
-
-import android.os.Bundle
-import androidx.activity.ComponentActivity
-import androidx.activity.compose.setContent
-import com.google.gson.reflect.TypeToken
-import com.navi.uitron.model.UiTronResponse
-import com.navi.uitron.render.UiTronRenderer
-import com.navi.uitron.viewmodel.UiTronViewModel
-
-class MainActivity : ComponentActivity() {
-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        val type = object : TypeToken<UiTronResponse>() {}.type
-        val response = mockApiResponse<UiTronResponse>(this, type, "mock")
-        setContent {
-            UiTronRenderer(
-                response.data,
-                UiTronViewModel()
-            ).Render(composeViews = response.parentComposeView!!)
-        }
-    }
-}

app/src/main/java/com/uitron/demo/MainActivity.kt

@@ -0,0 +1,113 @@
+package com.uitron.demo
+
+import UiTronDemoNavGraph
+import android.os.Bundle
+import androidx.activity.ComponentActivity
+import androidx.activity.compose.setContent
+import androidx.compose.animation.Animatable
+import androidx.compose.animation.core.tween
+import androidx.compose.foundation.Image
+import androidx.compose.foundation.background
+import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.*
+import androidx.compose.foundation.lazy.grid.GridCells
+import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.text.font.FontStyle
+import androidx.compose.ui.text.font.FontWeight
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import androidx.compose.ui.unit.sp
+import androidx.navigation.NavHostController
+import androidx.navigation.compose.rememberNavController
+import com.demo.uitron.theme.PurpleDCD1F4
+import com.uitron.demo.theme.UiTronTheme
+
+class MainActivity : ComponentActivity() {
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+        setContent {
+            UiTronTheme {
+                val navController = rememberNavController()
+                UiTronDemoNavGraph(navController = navController)
+            }
+        }
+    }
+}
+
+@Composable
+fun HomeScreen(navHostController: NavHostController) {
+    Column(modifier = Modifier.fillMaxSize(), horizontalAlignment = Alignment.CenterHorizontally) {
+        Row(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(top = 42.dp),
+            horizontalArrangement = Arrangement.Center,
+            verticalAlignment = Alignment.CenterVertically
+        ) {
+            Image(
+                painter = painterResource(id = R.drawable.ultron),
+                contentDescription = null,
+                modifier = Modifier
+                    .height(40.dp)
+                    .width(40.dp),
+                colorFilter = ColorFilter.tint(color = Color.DarkGray)
+            )
+            Spacer(modifier = Modifier.width(10.dp))
+            Text(
+                text = "UiTron",
+                fontWeight = FontWeight(800),
+                fontStyle = FontStyle.Italic,
+                fontSize = 32.sp
+            )
+        }
+        Text(
+            text = "I had hard-codings, but now I'm free. \nThere are no hard-codings on me...",
+            fontWeight = FontWeight(600),
+            fontStyle = FontStyle.Italic,
+            modifier = Modifier.padding(20.dp)
+        )
+        LazyVerticalGrid(columns = GridCells.Fixed(2), modifier = Modifier.padding(20.dp)) {
+            items(count = 1) {
+                PlaygroundBubble(navHostController)
+            }
+        }
+    }
+}
+
+@Composable
+fun PlaygroundBubble(navHostController: NavHostController) {
+    val color = remember { Animatable(PurpleDCD1F4) }
+    LaunchedEffect(Unit) {
+        color.animateTo(Color.White, animationSpec = tween(1000))
+        color.animateTo(PurpleDCD1F4, animationSpec = tween(1000))
+    }
+    Box(
+        modifier = Modifier
+            .width(60.dp)
+            .height(400.dp)
+            .background(color.value, shape = RoundedCornerShape(16.dp))
+            .clickable {
+                navHostController.navigate("playground")
+            }, contentAlignment = Alignment.Center
+    ) {
+        Text(text = "Playground", fontSize = 22.sp, fontWeight = FontWeight(800))
+    }
+}
+
+@Preview(showBackground = true)
+@Composable
+fun DefaultPreview() {
+    UiTronTheme {
+        HomeScreen(rememberNavController())
+    }
+}

app/src/main/java/com/uitron/demo/MainApplication.kt

@@ -1,6 +1,7 @@
-package com.navi.uitron
+package com.uitron.demo
 
 import android.app.Application
+import com.navi.uitron.UiTronSdkManager
 
 class MainApplication: Application() {
 

app/src/main/java/com/uitron/demo/UiTronDependencyProvider.kt

@@ -1,8 +1,9 @@
-package com.navi.uitron
+package com.uitron.demo
 
 import androidx.compose.ui.text.font.Font
 import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontWeight
+import com.navi.uitron.IUiTronDependencyProvider
 import com.navi.uitron.utils.EMPTY
 import com.navi.uitron.utils.SPACE
 
@@ -50,13 +51,13 @@ class UiTronDependencyProvider : IUiTronDependencyProvider {
 
         IUiTronDependencyProvider.FontWeightEnum.ROBOTO_BOLD.name,
 
-        IUiTronDependencyProvider.FontWeightEnum.TT_MEDIUM.name -> com.navi.R.font.tt_medium
+        IUiTronDependencyProvider.FontWeightEnum.TT_MEDIUM.name -> R.font.tt_medium
 
-        IUiTronDependencyProvider.FontWeightEnum.TT_BOLD.name -> com.navi.R.font.tt_bold
+        IUiTronDependencyProvider.FontWeightEnum.TT_BOLD.name -> R.font.tt_bold
 
-        IUiTronDependencyProvider.FontWeightEnum.TT_SEMI_BOLD.name -> com.navi.R.font.tt_semi_bold
+        IUiTronDependencyProvider.FontWeightEnum.TT_SEMI_BOLD.name -> R.font.tt_semi_bold
 
-        else -> com.navi.R.font.tt_regular
+        else -> R.font.tt_regular
     }
 
     override fun getFontWeight(fontWeight: String?): FontWeight {

app/src/main/java/com/uitron/demo/Utils.kt

@@ -1,13 +1,15 @@
-package com.navi.uitron
+package com.uitron.demo
 
 import android.content.Context
 import com.google.gson.GsonBuilder
 import com.google.gson.JsonObject
 import com.google.gson.JsonParser
+import com.google.gson.reflect.TypeToken
 import com.navi.uitron.deserializer.ComposePropertyDeserializer
 import com.navi.uitron.deserializer.UiTronApiDeserializer
 import com.navi.uitron.deserializer.UiTronDataDeserializer
 import com.navi.uitron.deserializer.UiTronValidationDeserializer
+import com.navi.uitron.model.UiTronResponse
 import com.navi.uitron.model.action.MakeApiAction
 import com.navi.uitron.model.data.UiTronData
 import com.navi.uitron.model.ui.BaseProperty
@@ -16,7 +18,7 @@ import java.lang.reflect.Type
 import java.nio.charset.StandardCharsets
 
 fun <T> mockApiResponse(context: Context, type: Type, jsonKey: String): T {
-    val inputStream = context.resources.openRawResource(com.navi.R.raw.mock)
+    val inputStream = context.resources.openRawResource(R.raw.mock)
     val dataString = String(inputStream.readBytes(), StandardCharsets.UTF_8)
     val jsonElement = (JsonParser.parseString(dataString) as? JsonObject)?.get(jsonKey)
     val customGson =
@@ -28,3 +30,20 @@ fun <T> mockApiResponse(context: Context, type: Type, jsonKey: String): T {
             .create()
     return customGson.fromJson(jsonElement, type)
 }
+
+fun stringToUiTronResponse(rawString: String): UiTronResponse {
+    val jsonElement = (JsonParser.parseString(rawString) as? JsonObject)
+    val type = object : TypeToken<UiTronResponse>() {}.type
+    val customGson = GsonBuilder().registerTypeAdapter(
+        UiTronData::class.java,
+        UiTronDataDeserializer()
+    ).registerTypeAdapter(
+        BaseProperty::class.java,
+        ComposePropertyDeserializer()
+    )
+        .registerTypeAdapter(
+            MakeApiAction::class.java,
+            UiTronApiDeserializer()
+        ).create()
+    return customGson.fromJson(jsonElement, type)
+}

app/src/main/java/com/uitron/demo/navigation/UiTronDemoNavGraph.kt

@@ -0,0 +1,23 @@
+import androidx.compose.runtime.Composable
+import androidx.navigation.NavHostController
+import androidx.navigation.compose.NavHost
+import androidx.navigation.compose.composable
+import com.uitron.demo.HomeScreen
+import com.uitron.demo.playground.PlayGroundScreen
+
+@Composable
+fun UiTronDemoNavGraph(navController: NavHostController) {
+    NavHost(
+        navController = navController,
+        startDestination = "home"
+    ) {
+        composable(route = "home") {
+            HomeScreen(navController)
+        }
+
+        composable(route = "playground") {
+            PlayGroundScreen()
+        }
+    }
+}
+

app/src/main/java/com/uitron/demo/playground/Playground.kt

@@ -0,0 +1,73 @@
+package com.uitron.demo.playground
+
+import androidx.compose.foundation.layout.*
+import androidx.compose.material.OutlinedTextField
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.navi.uitron.model.UiTronResponse
+import com.navi.uitron.render.UiTronRenderer
+import com.uitron.demo.stringToUiTronResponse
+import com.uitron.demo.theme.UiTronTheme
+import com.navi.uitron.viewmodel.UiTronViewModel
+import java.lang.Exception
+
+/**
+ * Copyright © 2021 by Navi Technologies Private Limited
+ * All rights reserved. Strictly confidential
+ */
+@Composable
+fun PlayGroundScreen() {
+    val fieldValue = remember {
+        mutableStateOf(
+            ""
+        )
+    }
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+            .padding(20.dp)
+    ) {
+        OutlinedTextField(
+            value = fieldValue.value, onValueChange = { newValue ->
+                fieldValue.value = newValue
+            }, modifier = Modifier
+                .fillMaxWidth()
+                .height(200.dp)
+        )
+        Spacer(modifier = Modifier.height(20.dp))
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .fillMaxSize()
+        ) {
+            if (fieldValue.value.isEmpty().not()) {
+                val uiTronResponse: UiTronResponse? = try {
+                    stringToUiTronResponse(rawString = fieldValue.value)
+                } catch (e: Exception) {
+                    null
+                }
+                uiTronResponse?.let {
+                    UiTronRenderer(uiTronResponse.data, uiTronViewModel = UiTronViewModel())
+                        .Render(composeViews = uiTronResponse.parentComposeView.orEmpty())
+                } ?: kotlin.run {
+                    Text(text = "Error In Config", color = Color.Red)
+                }
+            }
+        }
+    }
+
+}
+
+@Preview(showBackground = true)
+@Composable
+fun DefaultPreview() {
+    UiTronTheme {
+        PlayGroundScreen()
+    }
+}

app/src/main/java/com/uitron/demo/theme/Color.kt

@@ -0,0 +1,22 @@
+package com.demo.uitron.theme
+
+import androidx.compose.ui.graphics.Color
+
+val Purple200 = Color(0xFFBB86FC)
+val Purple500 = Color(0xFF6200EE)
+val Purple700 = Color(0xFF3700B3)
+val Teal200 = Color(0xFF03DAC5)
+val NaviRed = Color(0xFFFF5732)
+val DividerGray = Color(0x1A000000)
+val NaviBlack = Color(0xFF1A1A1A)
+val NaviGray = Color(0xFFA3A3AB)
+val Purple4B4968 = Color(0xFF4B4968)
+val Green14BC51 = Color(0xFF14BC51)
+val Blue22223D = Color(0xFF22223D)
+val Black191919 = Color(0xFF191919)
+val GrayE3E5E5 = Color(0xFFE3E5E5)
+val RedEF0000 = Color(0xFFEF0000)
+val WhiteF8F8F8 = Color(0xFFF8F8F8)
+val Black444444 = Color(0xFF444444)
+val PurpleDCD1F4 = Color(0xFFDCD1F4)
+

app/src/main/java/com/uitron/demo/theme/Shape.kt

@@ -0,0 +1,11 @@
+package com.uitron.demo.theme
+
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material.Shapes
+import androidx.compose.ui.unit.dp
+
+val Shapes = Shapes(
+    small = RoundedCornerShape(4.dp),
+    medium = RoundedCornerShape(4.dp),
+    large = RoundedCornerShape(0.dp)
+)

app/src/main/java/com/uitron/demo/theme/Theme.kt

@@ -0,0 +1,45 @@
+package com.uitron.demo.theme
+
+import androidx.compose.foundation.isSystemInDarkTheme
+import androidx.compose.material.MaterialTheme
+import androidx.compose.material.darkColors
+import androidx.compose.material.lightColors
+import androidx.compose.runtime.Composable
+import com.demo.uitron.theme.*
+
+private val DarkColorPalette = darkColors(
+    primary = Purple200,
+    primaryVariant = Purple700,
+    secondary = Teal200
+)
+
+private val LightColorPalette = lightColors(
+    primary = Purple500,
+    primaryVariant = Purple700,
+    secondary = Teal200
+
+    /* Other default colors to override
+    background = Color.White,
+    surface = Color.White,
+    onPrimary = Color.White,
+    onSecondary = Color.Black,
+    onBackground = Color.Black,
+    onSurface = Color.Black,
+    */
+)
+
+@Composable
+fun UiTronTheme(darkTheme: Boolean = isSystemInDarkTheme(), content: @Composable () -> Unit) {
+    val colors = if (darkTheme) {
+        DarkColorPalette
+    } else {
+        LightColorPalette
+    }
+
+    MaterialTheme(
+        colors = colors,
+        typography = Typography,
+        shapes = Shapes,
+        content = content
+    )
+}

app/src/main/java/com/uitron/demo/theme/Type.kt

@@ -0,0 +1,16 @@
+package com.uitron.demo.theme
+
+import androidx.compose.material.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(
+    body1 = TextStyle(
+        fontFamily = FontFamily.Default,
+        fontWeight = FontWeight.Normal,
+        fontSize = 16.sp
+    )
+)

build.gradle

@@ -1,5 +1,9 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
-
+buildscript {
+    ext {
+        nav_version = "2.5.3"
+    }
+}
 plugins {
     id 'com.android.application' version '7.3.1' apply false
     id 'com.android.library' version '7.3.1' apply false