Flutter model, UI and Logger (#108)

.gitignore

@@ -53,3 +53,8 @@ app.*.map.json
 
 # Old project
 /app
+
+# doit related
+.doit.db.bak
+.doit.db.dat
+.doit.db.dir

README.md

@@ -26,6 +26,10 @@ Architecture:
 
 * **Agent** – [Agent architecture description](/docs/architecture_agent.md)
 
+Automation:
+
+* **doit automation** - [Description of application automation (doit)](/docs/automation.md)
+
 Tests:
 
 * **Unit testing** - [Unit testing description](/docs/unit_tests.md)

android/app/src/main/AndroidManifest.xml

@@ -1,8 +1,8 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android">
     <application
-        android:label="roc_droid"
+        android:label="Roc Droid"
         android:name="${applicationName}"
-        android:icon="@mipmap/ic_launcher">
+        android:icon="@mipmap/launcher_icon">
         <activity
             android:name=".MainActivity"
             android:exported="true"

android/app/src/main/res/drawable-v21/launch_background.xml

@@ -1,12 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Modify this file to customize your launch splash screen -->
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:drawable="?android:colorBackground" />
-
-    <!-- You can insert your own image assets here -->
-    <!-- <item>
-        <bitmap
-            android:gravity="center"
-            android:src="@mipmap/launch_image" />
-    </item> -->
+    <item>
+        <bitmap android:gravity="fill" android:src="@drawable/background"/>
+    </item>
+    <item>
+        <bitmap android:gravity="center" android:src="@drawable/splash"/>
+    </item>
 </layer-list>

android/app/src/main/res/drawable/launch_background.xml

@@ -1,12 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
-<!-- Modify this file to customize your launch splash screen -->
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
-    <item android:drawable="@android:color/white" />
-
-    <!-- You can insert your own image assets here -->
-    <!-- <item>
-        <bitmap
-            android:gravity="center"
-            android:src="@mipmap/launch_image" />
-    </item> -->
+    <item>
+        <bitmap android:gravity="fill" android:src="@drawable/background"/>
+    </item>
+    <item>
+        <bitmap android:gravity="center" android:src="@drawable/splash"/>
+    </item>
 </layer-list>

android/app/src/main/res/values-night-v31/styles.xml

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is on -->
+    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
+        <item name="android:forceDarkAllowed">false</item>
+        <item name="android:windowFullscreen">false</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">false</item>
+        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
+        <item name="android:windowSplashScreenBackground">#FFFFFF</item>
+        <item name="android:windowSplashScreenAnimatedIcon">@drawable/android12splash</item>
+    </style>
+    <!-- Theme applied to the Android Window as soon as the process has started.
+         This theme determines the color of the Android Window while your
+         Flutter UI initializes, as well as behind your Flutter UI while its
+         running.
+         
+         This Theme is only used starting with V2 of Flutter's Android embedding. -->
+    <style name="NormalTheme" parent="@android:style/Theme.Black.NoTitleBar">
+        <item name="android:windowBackground">?android:colorBackground</item>
+    </style>
+</resources>

android/app/src/main/res/values-night/styles.xml

@@ -5,6 +5,10 @@
         <!-- Show a splash screen on the activity. Automatically removed when
              the Flutter engine draws its first frame -->
         <item name="android:windowBackground">@drawable/launch_background</item>
+        <item name="android:forceDarkAllowed">false</item>
+        <item name="android:windowFullscreen">false</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">false</item>
+        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
     </style>
     <!-- Theme applied to the Android Window as soon as the process has started.
          This theme determines the color of the Android Window while your

android/app/src/main/res/values-v31/styles.xml

@@ -0,0 +1,21 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <!-- Theme applied to the Android Window while the process is starting when the OS's Dark Mode setting is off -->
+    <style name="LaunchTheme" parent="@android:style/Theme.Light.NoTitleBar">
+        <item name="android:forceDarkAllowed">false</item>
+        <item name="android:windowFullscreen">false</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">false</item>
+        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
+        <item name="android:windowSplashScreenBackground">#FFFFFF</item>
+        <item name="android:windowSplashScreenAnimatedIcon">@drawable/android12splash</item>
+    </style>
+    <!-- Theme applied to the Android Window as soon as the process has started.
+         This theme determines the color of the Android Window while your
+         Flutter UI initializes, as well as behind your Flutter UI while its
+         running.
+         
+         This Theme is only used starting with V2 of Flutter's Android embedding. -->
+    <style name="NormalTheme" parent="@android:style/Theme.Light.NoTitleBar">
+        <item name="android:windowBackground">?android:colorBackground</item>
+    </style>
+</resources>

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

@@ -5,6 +5,10 @@
         <!-- Show a splash screen on the activity. Automatically removed when
              the Flutter engine draws its first frame -->
         <item name="android:windowBackground">@drawable/launch_background</item>
+        <item name="android:forceDarkAllowed">false</item>
+        <item name="android:windowFullscreen">false</item>
+        <item name="android:windowDrawsSystemBarBackgrounds">false</item>
+        <item name="android:windowLayoutInDisplayCutoutMode">shortEdges</item>
     </style>
     <!-- Theme applied to the Android Window as soon as the process has started.
          This theme determines the color of the Android Window while your

devtools_options.yaml

@@ -0,0 +1,3 @@
+description: This file stores settings for Dart & Flutter DevTools.
+documentation: https://docs.flutter.dev/tools/devtools/extensions#configure-extension-enablement-states
+extensions:

docs/architecture_model.md

@@ -19,6 +19,18 @@ Description of the model tree:
 
 * The `ModelRoot` class itself is derived from two base classes: `Receiver` and `Sender`, both highlighted in red.
 
+  * The red classes contain `@observable`, `@computed` fields and `@action` methods provided in the `Mobx` package.
+
   * Receiver implementation: [Receiver](/lib/src/model/receiver.dart)
 
+    * The Receiver has its own automatically generated code for the correct operation of `Mobx`: [receiver.g.dart](/lib/src/model/receiver.g.dart)
+
   * Sender implementation: [Sender](/lib/src/model/sender.dart)
+
+    * The Sender has its own automatically generated code for the correct operation of `Mobx`: [sender.g.dart](/lib/src/model/sender.g.dart)
+
+* The `Logger` class is managed by the Flutter `logger` package and is highlighted in yellow.
+
+* The `CaptureSourceType` enumerator control the type of capture source and is colored gray.
+
+  * enum implementation: [CaptureSourceType](/lib/src/model/capture_source_type.dart)

docs/architecture_ui.md

@@ -20,7 +20,7 @@ Widgets can be categorized into the following types:
 
     * `Screen`: This widget corresponds to the entire screen.
 
-    * `Page`: This widget represents a page within the screen. Switching between pages is done via the lower tab bar.
+    * `Page`: This widget represents a page within the screen. Switching between pages is done via the lower tab bar or AppBar.
 
     * `Fragment`: This widget represents a smaller fragment of the UI, such as a separate block or item in a list.
 
@@ -42,7 +42,7 @@ Widgets can be categorized into the following types:
 
     * `Component`: Not tied to specific data—it receives data from above and does not interact with models. It is responsible for implementing a specific representation, such as styles and responses to clicks.
 
-    > **Note:** In our code, custom component classes are prefixed with `roc` to distinguish them from standard components. Other types of widgets do not have a special prefix.
+    > **Note:** In our code, custom component classes are prefixed with `roc` to distinguish them from standard components or created as private widgets inside of a parent classes starting with `_` and without `roc`. Other types of widgets do not have a special prefix.
 
     > **Note:** In some frameworks, an entity similar to a fragment is called a `widget`. We use the term `fragment` for clarity (like in Android SDK).
 
@@ -70,18 +70,40 @@ Designations:
 
   * roc-droid classes:
 
-    * [ReceiverPage](/lib/src/ui/receiver_page.dart)
+    * [ReceiverPage](/lib/src/ui/pages/receiver_page.dart)
 
-    * [SenderPage](/lib/src/ui/sender_page.dart)
+    * [SenderPage](/lib/src/ui/pages/sender_page.dart)
+
+    * [AboutPage](/lib/src/ui/pages/about_page.dart)
 
 * **Yellow:** Fragment-level widgets (`Content Layer`)
 
-  * Classes:
+  * roc-droid classes:
+
+    * [RocBottomNavigationBar](/lib/src/ui/fragments/roc_bottom_navigation_bar.dart)
 
-    * [MessagePopup](/lib/src/ui/fragments/message_popup.dart)
+* **Gray:** Native Flutter `Widget` class (`Representation Layer`)
 
-    * [SettingsPane](/lib/src/ui/fragments/settings_pane.dart)
-
-    * [SourceSelector](/lib/src/ui/fragments/source_selector.dart)
+* **Blue:** Custom Roc `Widget` class (`Representation Layer`)
+
+    * Location: `/lib/src/ui/components`
+
+    * Functionality:
+
+      * Representing Widgets that provide certain data to the user.
+
+        * [RocChip](/lib/src/ui/components/roc_chip.dart)
+
+        * [RocTextRow](/lib/src/ui/components/roc_text_row.dart)
+
+      * Representing Widgets that provide the user with the ability to enter certain data.
+
+        * [RocDropdownButton](/lib/src/ui/components/roc_dropdown_button.dart)
+
+        * [RocStatefulButton](/lib/src/ui/components/roc_stateful_button.dart)
+
+      * Representing Widgets that control specific view representations.
+
+        * [RocPageView](/lib/src/ui/components/roc_page_view.dart)
 
-* **Gray:** Native Flutter class (`Representation Layer`)
+        * [RocScrollView](/lib/src/ui/components/roc_scroll_view.dart)

docs/automation.md

@@ -0,0 +1,60 @@
+# Description of application automation (doit)
+
+> **Note:** All commands are called from the root directory (using terminal).
+
+**Table of contents:**
+
+- [Description of application automation (doit)](#description-of-application-automation-doit)
+  - [Starting dart models code generation](#starting-dart-models-code-generation)
+  - [Starting application icons generation](#starting-application-icons-generation)
+  - [Starting application splash screen generation](#starting-application-splash-screen-generation)
+
+## Starting dart models code generation
+
+Code generation is based on the Flutter `build_runner` package.
+
+Code generation is initiated by the following command:
+
+```
+doit gen
+```
+
+The code is generated into special `Store` files with the extension `.g.dart` and is used by the `Mobx` package.
+
+Code generated files (avoid any manual manipulation!):
+
+* Receiver generated code: [receiver.g.dart](/lib/src/model/receiver.g.dart)
+
+* Sender generated code: [sender.g.dart](/lib/src/model/sender.g.dart)
+
+## Starting application icons generation
+
+Icons generation is based on the Flutter `flutter_launcher_icons` package.
+
+Icons generation is initiated by the following command:
+
+```
+doit icons
+```
+
+Icon generation settings are configured in the `pubspec.yaml` file in the `flutter_launcher_icons` section.
+
+The assets for generating icons are defined in the `pubspec.yaml` file in the `assets` section.
+
+All assets are located in the corresponding `assets` folder in the root directory.
+
+## Starting application splash screen generation
+
+Splash screen generation is based on the Flutter `flutter_native_splash` package.
+
+Splash screen generation is initiated by the following command:
+
+```
+doit splash
+```
+
+Splash screen generation settings are configured in the `pubspec.yaml` file in the `flutter_native_splash` section.
+
+The assets for generating splash screen are defined in the `pubspec.yaml` file in the `assets` section.
+
+All assets are located in the corresponding `assets` folder in the root directory.