Implement first demo UI

modules/android/.idea/gradle.xml

@@ -1,5 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
+  <component name="GradleMigrationSettings" migrationVersion="1" />
   <component name="GradleSettings">
     <option name="linkedExternalProjectsSettings">
       <GradleProjectSettings>

modules/android/.idea/misc.xml

@@ -1,5 +1,14 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
+  <component name="DesignSurface">
+    <option name="filePathToZoomLevelMap">
+      <map>
+        <entry key="..\:/Users/Philipp/VSC/light-control/modules/android/app/src/main/res/layout/activity_main.xml" value="0.55" />
+        <entry key="..\:/Users/Philipp/VSC/light-control/modules/android/app/src/main/res/layout/fragment_light_control.xml" value="0.55" />
+        <entry key="..\:/Users/Philipp/VSC/light-control/modules/android/app/src/main/res/layout/light_control_fragment.xml" value="0.55" />
+      </map>
+    </option>
+  </component>
   <component name="ProjectRootManager" version="2" languageLevel="JDK_11" default="true" project-jdk-name="1.8" project-jdk-type="JavaSDK">
     <output url="file://$PROJECT_DIR$/build/classes" />
   </component>

modules/android/app/build.gradle

@@ -1,6 +1,7 @@
 plugins {
     id 'com.android.application'
     id 'org.jetbrains.kotlin.android'
+    id 'androidx.navigation.safeargs.kotlin'
 }
 
 android {
@@ -29,15 +30,21 @@ android {
     kotlinOptions {
         jvmTarget = '1.8'
     }
+    buildFeatures {
+        dataBinding = true
+    }
 }
 
 dependencies {
-
     implementation 'androidx.core:core-ktx:1.7.0'
     implementation 'androidx.appcompat:appcompat:1.4.1'
     implementation 'com.google.android.material:material:1.5.0'
     implementation 'androidx.constraintlayout:constraintlayout:2.1.3'
+    implementation 'androidx.legacy:legacy-support-v4:1.0.0'
+    implementation 'androidx.lifecycle:lifecycle-livedata-ktx:2.4.1'
+    implementation 'androidx.lifecycle:lifecycle-viewmodel-ktx:2.4.1'
     testImplementation 'junit:junit:4.13.2'
     androidTestImplementation 'androidx.test.ext:junit:1.1.3'
     androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'
-}
+    implementation "androidx.navigation:navigation-fragment-ktx:2.4.2"
+    implementation "androidx.navigation:navigation-ui-ktx:2.4.2"}

modules/android/app/src/main/java/com/ghoscht/heliox/LightControlFragment.kt

@@ -0,0 +1,35 @@
+package com.ghoscht.heliox
+
+import android.os.Bundle
+import androidx.fragment.app.Fragment
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.databinding.DataBindingUtil
+import androidx.fragment.app.viewModels
+import com.ghoscht.heliox.databinding.FragmentLightControlBinding
+
+/**
+ * A simple [Fragment] subclass.
+ * Use the [LightControlFragment.newInstance] factory method to
+ * create an instance of this fragment.
+ */
+class LightControlFragment : Fragment() {
+    private val viewModel: LightControlViewModel by viewModels()
+    private lateinit var binding: FragmentLightControlBinding
+
+    override fun onCreateView(
+        inflater: LayoutInflater, container: ViewGroup?,
+        savedInstanceState: Bundle?
+    ): View? {
+        // Inflate the layout for this fragment
+        binding = DataBindingUtil.inflate(inflater, R.layout.fragment_light_control, container, false)
+        return binding.root
+    }
+
+    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
+        binding.viewModel = viewModel
+        binding.lifecycleOwner = viewLifecycleOwner
+        super.onViewCreated(view, savedInstanceState)
+    }
+}

modules/android/app/src/main/java/com/ghoscht/heliox/LightControlViewModel.kt

@@ -0,0 +1,27 @@
+package com.ghoscht.heliox
+
+import androidx.lifecycle.LiveData
+import androidx.lifecycle.MutableLiveData
+import androidx.lifecycle.ViewModel
+
+class LightControlViewModel : ViewModel() {
+    private val _status = MutableLiveData<String>("0,0,0,0")
+    public val status: LiveData<String>
+        get() = _status
+
+    public fun turnOn(){
+        _status.postValue("255,255,255,255")
+    }
+    public fun turnOff(){
+        _status.postValue("0,0,0,0")
+    }
+    public fun toggle(){
+        _status.postValue("420,0,0,0")
+    }
+    public fun inc(){
+
+    }
+    public fun dec(){
+
+    }
+}

modules/android/app/src/main/res/layout/activity_main.xml

@@ -1,18 +1,15 @@
 <?xml version="1.0" encoding="utf-8"?>
-<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context=".MainActivity">
-
+    <androidx.fragment.app.FragmentContainerView
-    <TextView
+        android:id="@+id/nav_host_fragment"
-        android:layout_width="wrap_content"
+        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="match_parent"
-        android:text="Hello World!"
+        android:name="androidx.navigation.fragment.NavHostFragment"
-        app:layout_constraintBottom_toBottomOf="parent"
+        app:defaultNavHost="true"
-        app:layout_constraintLeft_toLeftOf="parent"
+        app:navGraph="@navigation/nav_graph" />
-        app:layout_constraintRight_toRightOf="parent"
+</FrameLayout>
-        app:layout_constraintTop_toTopOf="parent" />
-
-</androidx.constraintlayout.widget.ConstraintLayout>

modules/android/app/src/main/res/layout/fragment_light_control.xml

@@ -0,0 +1,88 @@
+<?xml version="1.0" encoding="utf-8"?>
+<layout xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools">
+
+    <data>
+        <variable
+            name="viewModel"
+            type="com.ghoscht.heliox.LightControlViewModel" />
+    </data>
+
+    <androidx.constraintlayout.widget.ConstraintLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        tools:context=".LightControlFragment">
+
+        <TextView
+            android:id="@+id/status_display"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_margin="24dp"
+            android:layout_marginStart="8dp"
+            android:layout_marginTop="56dp"
+            android:text="@{viewModel.status}"
+            android:textAlignment="center"
+            android:textAppearance="@style/TextAppearance.MaterialComponents.Headline6"
+            android:textSize="24sp"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toTopOf="parent"
+            tools:text="255,255,255,255" />
+
+        <Button
+            android:id="@+id/on_button"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="48dp"
+            android:layout_marginEnd="8dp"
+            android:text="@string/on"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/status_display"
+            android:onClick="@{()->viewModel.turnOn()}"/>
+
+        <Button
+            android:id="@+id/off_btn"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="8dp"
+            android:layout_marginTop="48dp"
+            android:text="@string/off"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/status_display"
+            android:onClick="@{()->viewModel.turnOff()}" />
+
+        <Button
+            android:id="@+id/toggle_btn"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="48dp"
+            android:onClick="@{()->viewModel.toggle()}"
+            android:text="@string/toggle"
+            app:layout_constraintEnd_toStartOf="@+id/on_button"
+            app:layout_constraintStart_toEndOf="@+id/off_btn"
+            app:layout_constraintTop_toBottomOf="@+id/status_display" />
+
+        <Button
+            android:id="@+id/inc_btn"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="20dp"
+            android:layout_marginEnd="8dp"
+            android:onClick="@{()->viewModel.inc()}"
+            android:text="@string/inc"
+            app:layout_constraintEnd_toEndOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/on_button" />
+
+        <Button
+            android:id="@+id/dec_btn"
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:layout_marginStart="8dp"
+            android:layout_marginTop="20dp"
+            android:onClick="@{()->viewModel.dec()}"
+            android:text="@string/dec"
+            app:layout_constraintStart_toStartOf="parent"
+            app:layout_constraintTop_toBottomOf="@+id/off_btn" />
+
+    </androidx.constraintlayout.widget.ConstraintLayout>
+</layout>

modules/android/app/src/main/res/navigation/nav_graph.xml

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<navigation xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:id="@+id/nav_graph.xml"
+    app:startDestination="@id/lightControlFragment">
+
+    <fragment
+        android:id="@+id/lightControlFragment"
+        android:name="com.ghoscht.heliox.LightControlFragment"
+        android:label="fragment_light_control"
+        tools:layout="@layout/fragment_light_control" />
+</navigation>

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

@@ -1,3 +1,9 @@
 <resources>
     <string name="app_name">Heliox</string>
+    <string name="on">ON</string>
+    <string name="off">OFF</string>
+    <string name="toggle">TOGGLE</string>
+    <string name="inc">INC</string>
+    <string name="dec">DEC</string>
+    <string name="status">%d, %d, %d, %d</string>
 </resources>

modules/android/build.gradle

@@ -3,6 +3,7 @@ plugins {
     id 'com.android.application' version '7.1.2' apply false
     id 'com.android.library' version '7.1.2' apply false
     id 'org.jetbrains.kotlin.android' version '1.6.20' apply false
+    id 'androidx.navigation.safeargs.kotlin' version '2.4.2' apply false
 }
 
 task clean(type: Delete) {