added a button to clear (#238)

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

@@ -7,12 +7,18 @@
 
 package com.uitron.demo.playground
 
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.wrapContentHeight
+import androidx.compose.foundation.layout.wrapContentWidth
+import androidx.compose.material.Button
 import androidx.compose.material.OutlinedTextField
 import androidx.compose.material.Text
 import androidx.compose.material.TextFieldDefaults
@@ -21,30 +27,60 @@ 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.res.stringResource
 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.navi.uitron.viewmodel.UiTronViewModel
+import com.uitron.demo.R
 import com.uitron.demo.stringToUiTronResponse
 import com.uitron.demo.theme.UiTronTheme
 
 @Composable
 fun PlaygroundScreen() {
     val fieldValue = remember { mutableStateOf("") }
-    Column(modifier = Modifier.fillMaxSize().padding(20.dp)) {
+    Column(
+        modifier = Modifier
+            .fillMaxSize()
+    ) {
         OutlinedTextField(
             value = fieldValue.value,
             onValueChange = { newValue -> fieldValue.value = newValue },
-            modifier = Modifier.fillMaxWidth().height(200.dp),
+            modifier = Modifier
+                .fillMaxWidth()
+                .height(200.dp)
+                .background(Color.White)
+                .padding(20.dp),
             colors =
-                TextFieldDefaults.outlinedTextFieldColors(
-                    focusedBorderColor = Color.Black,
-                    unfocusedBorderColor = Color.Black
-                )
+            TextFieldDefaults.outlinedTextFieldColors(
+                focusedBorderColor = Color.Black,
+                unfocusedBorderColor = Color.Black
+            )
         )
+        Row(
+            horizontalArrangement = Arrangement.Center,
+            modifier = Modifier
+                .fillMaxWidth()
+                .wrapContentHeight()
+        ) {
+            Button(
+                onClick = {
+                    fieldValue.value = ""
+                },
+                modifier = Modifier
+                    .wrapContentHeight()
+                    .wrapContentWidth(),
+            ) {
+                Text(text = stringResource(id = R.string.clear))
+            }
+        }
         Spacer(modifier = Modifier.height(20.dp))
-        Column(modifier = Modifier.fillMaxWidth().fillMaxSize()) {
+        Column(
+            modifier = Modifier
+                .fillMaxWidth()
+                .wrapContentHeight()
+        ) {
             if (fieldValue.value.isEmpty().not()) {
                 var errorMessage = "Error In Config"
                 val uiTronResponse: UiTronResponse? =
@@ -58,9 +94,16 @@ fun PlaygroundScreen() {
                     UiTronRenderer(uiTronResponse.data, uiTronViewModel = UiTronViewModel())
                         .Render(composeViews = uiTronResponse.parentComposeView.orEmpty())
                 }
-                    ?: kotlin.run { Text(text = errorMessage, color = Color.Red) }
+                    ?: kotlin.run {
+                        Text(
+                            text = errorMessage,
+                            color = Color.Red,
+                            modifier = Modifier.padding(start = 20.dp, end = 20.dp)
+                        )
+                    }
             }
         }
+
     }
 }
 

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

@@ -7,4 +7,5 @@
     <string name="copy_widget_config">Copy widget config</string>
     <string name="share_widget_config">Share widget config</string>
     <string name="search">Search</string>
+    <string name="clear">CLEAR</string>
 </resources>