Port tunnel creation UI from Viscerion

Signed-off-by: Jason A. Donenfeld <Jason@zx2c4.com>

9 files changed, 95 insertions, 93 deletions

diff --git a/app/src/main/res/drawable/fab_label_background.xml b/app/src/main/res/drawable/fab_label_background.xml
deleted file mode 100644
index 92c42569..00000000
--- a/app/src/main/res/drawable/fab_label_background.xml
+++ /dev/null
@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<shape xmlns:android="http://schemas.android.com/apk/res/android">
-    <corners android:radius="4dp" />
-    <padding
-        android:bottom="4dp"
-        android:left="8dp"
-        android:right="8dp"
-        android:top="4dp" />
-    <solid android:color="@color/fab_label_background_color" />
-</shape>
diff --git a/app/src/main/res/layout/add_tunnels_bottom_sheet.xml b/app/src/main/res/layout/add_tunnels_bottom_sheet.xml
new file mode 100644
index 00000000..62f168b1
--- /dev/null
+++ b/app/src/main/res/layout/add_tunnels_bottom_sheet.xml
@@ -0,0 +1,73 @@
+<?xml version="1.0" encoding="utf-8"?>
+<androidx.constraintlayout.widget.ConstraintLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    android:id="@+id/root"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingTop="@dimen/bottom_sheet_top_padding">
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_empty"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_empty"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_edit"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintBottom_toTopOf="@+id/create_from_file"
+        app:layout_constraintTop_toTopOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_from_file"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_from_file"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_open_white"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintTop_toBottomOf="@+id/create_empty"
+        app:layout_constraintBottom_toTopOf="@+id/create_from_qrcode"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+    <com.google.android.material.button.MaterialButton
+        android:id="@+id/create_from_qrcode"
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/bottom_sheet_item_height"
+        android:layout_marginLeft="@dimen/normal_margin"
+        android:layout_marginRight="@dimen/normal_margin"
+        android:layout_marginStart="@dimen/normal_margin"
+        android:layout_marginEnd="@dimen/normal_margin"
+        android:text="@string/create_from_qr_code"
+        android:textAlignment="viewStart"
+        android:textColor="?attr/colorOnSurface"
+        app:icon="@drawable/ic_action_scan_qr_code_white"
+        app:iconPadding="@dimen/bottom_sheet_icon_padding"
+        app:iconTint="?attr/colorSecondary"
+        app:layout_constraintTop_toBottomOf="@+id/create_from_file"
+        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintEnd_toEndOf="parent"
+        app:layout_constraintStart_toStartOf="parent"
+        app:rippleColor="?attr/colorSecondary"
+        style="@style/Widget.MaterialComponents.Button.TextButton.Icon"/>
+
+</androidx.constraintlayout.widget.ConstraintLayout>
diff --git a/app/src/main/res/layout/tunnel_list_fragment.xml b/app/src/main/res/layout/tunnel_list_fragment.xml
index 4189fa5f..c4247019 100644
--- a/app/src/main/res/layout/tunnel_list_fragment.xml
+++ b/app/src/main/res/layout/tunnel_list_fragment.xml
@@ -65,44 +65,14 @@
                 android:text="@string/tunnel_list_placeholder"
                 android:textSize="20sp" />
         </LinearLayout>
-
-        <com.wireguard.android.widget.fab.FloatingActionsMenu
-            android:id="@+id/create_menu"
+        <com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
+            style="@style/Widget.MaterialComponents.ExtendedFloatingActionButton.Icon"
+            android:id="@+id/create_fab"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:layout_gravity="bottom|end"
             android:layout_margin="@dimen/fab_margin"
-            android:clipChildren="false"
-            app:fab_labelStyle="@style/fab_label"
-            app:fab_labelsPosition="@integer/label_position"
-            app:layout_behavior="com.wireguard.android.widget.fab.FloatingActionButtonBehavior">
+            app:icon="@drawable/ic_action_add_white" />
 
-            <com.wireguard.android.widget.fab.LabeledFloatingActionButton
-                android:id="@+id/create_from_file"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:onClick="@{fragment::onRequestImportConfig}"
-                app:fabSize="mini"
-                app:fab_title="@string/create_from_file"
-                app:srcCompat="@drawable/ic_action_open_white" />
-
-            <com.wireguard.android.widget.fab.LabeledFloatingActionButton
-                android:id="@+id/create_from_qrcode"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:onClick="@{fragment::onRequestScanQRCode}"
-                app:fabSize="mini"
-                app:fab_title="@string/create_from_qr_code"
-                app:srcCompat="@drawable/ic_action_scan_qr_code_white" />
-
-            <com.wireguard.android.widget.fab.LabeledFloatingActionButton
-                android:id="@+id/create_empty"
-                android:layout_width="wrap_content"
-                android:layout_height="wrap_content"
-                android:onClick="@{fragment::onRequestCreateConfig}"
-                app:fabSize="mini"
-                app:fab_title="@string/create_empty"
-                app:srcCompat="@drawable/ic_action_edit_white" />
-        </com.wireguard.android.widget.fab.FloatingActionsMenu>
     </androidx.coordinatorlayout.widget.CoordinatorLayout>
 </layout>
diff --git a/app/src/main/res/values-ldrtl/fab.xml b/app/src/main/res/values-ldrtl/fab.xml
deleted file mode 100644
index f612440c..00000000
--- a/app/src/main/res/values-ldrtl/fab.xml
+++ /dev/null
@@ -1,4 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<resources>
-    <integer name="label_position">1</integer>
-</resources>
\ No newline at end of file
diff --git a/app/src/main/res/values-night/colors.xml b/app/src/main/res/values-night/colors.xml
index db267d97..314142d9 100644
--- a/app/src/main/res/values-night/colors.xml
+++ b/app/src/main/res/values-night/colors.xml
@@ -1,9 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
-    <!-- TODO(msf): remove these 2 hard-coded colors and replace with theme colors -->
-    <color name="fab_label_text_color">#000000</color>
-    <color name="fab_label_background_color">#bbbbbb</color>
-
     <!-- Base palette -->
     <color name="primary_color">#ff212121</color>
     <color name="primary_light_color">#ff484848</color>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
index 9105fb22..06bcd143 100644
--- a/app/src/main/res/values/colors.xml
+++ b/app/src/main/res/values/colors.xml
@@ -1,9 +1,5 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources xmlns:tools="http://schemas.android.com/tools">
-    <!-- TODO(msf): remove these 2 hard-coded colors and replace with theme colors -->
-    <color name="fab_label_text_color">#ffffff</color>
-    <color name="fab_label_background_color">#444444</color>
-
     <!-- Base palette -->
     <color name="primary_color">#ffffffff</color>
     <color name="primary_light_color">#ffffffff</color>
diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
index 92be463c..c6abf8eb 100644
--- a/app/src/main/res/values/dimens.xml
+++ b/app/src/main/res/values/dimens.xml
@@ -1,4 +1,9 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
     <dimen name="fab_margin">16dp</dimen>
-</resources>
\ No newline at end of file
+    <dimen name="extra_margin">12dp</dimen>
+    <dimen name="bottom_sheet_item_height">56dp</dimen>
+    <dimen name="normal_margin">8dp</dimen>
+    <dimen name="bottom_sheet_top_padding">8dp</dimen>
+    <dimen name="bottom_sheet_icon_padding">16dp</dimen>
+</resources>
diff --git a/app/src/main/res/values/fab.xml b/app/src/main/res/values/fab.xml
deleted file mode 100644
index 8fbdc724..00000000
--- a/app/src/main/res/values/fab.xml
+++ /dev/null
@@ -1,31 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<resources>
-    <item name="fab_expand_menu_button" type="id" />
-    <item name="fab_label" type="id" />
-
-    <dimen name="fab_shadow_offset">3dp</dimen>
-    <dimen name="fab_shadow_radius">9dp</dimen>
-
-    <dimen name="fab_stroke_width">1dp</dimen>
-
-    <dimen name="fab_actions_spacing">24dp</dimen>
-    <dimen name="fab_labels_margin">8dp</dimen>
-
-    <declare-styleable name="LabeledFloatingActionButton">
-        <attr name="fab_title" format="string" />
-    </declare-styleable>
-    <declare-styleable name="FloatingActionsMenu">
-        <attr name="fab_labelStyle" format="reference" />
-        <attr name="fab_labelsPosition" format="enum">
-            <enum name="left" value="0" />
-            <enum name="right" value="1" />
-        </attr>
-        <attr name="fab_expandDirection" format="enum">
-            <enum name="up" value="0" />
-            <enum name="down" value="1" />
-            <enum name="left" value="2" />
-            <enum name="right" value="3" />
-        </attr>
-    </declare-styleable>
-    <integer name="label_position">0</integer>
-</resources>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
index 9f55fd3e..f5af8bce 100644
--- a/app/src/main/res/values/styles.xml
+++ b/app/src/main/res/values/styles.xml
@@ -28,6 +28,18 @@
         <item name="android:windowBackground">?attr/colorBackground</item>
     </style>
 
+    <style name="BottomSheetDialogTheme" parent="ThemeOverlay.MaterialComponents.BottomSheetDialog">
+        <item name="android:windowIsFloating">false</item>
+        <item name="android:navigationBarColor">?attr/colorBackground</item>
+        <item name="android:statusBarColor">@android:color/transparent</item>
+        <item name="android:windowTranslucentNavigation">false</item>
+        <item name="android:windowIsTranslucent">false</item>
+        <item name="android:backgroundDimEnabled">true</item>
+        <item name="android:backgroundDimAmount">0.5</item>
+        <item name="android:windowTranslucentStatus">false</item>
+        <item name="android:colorBackground">@android:color/transparent</item>
+    </style>
+
     <style name="NoBackgroundTheme" parent="AppTheme">
         <item name="android:windowIsTranslucent">true</item>
         <item name="android:windowContentOverlay">@null</item>
@@ -41,9 +53,4 @@
         <item name="android:windowExitAnimation">@android:anim/fade_out</item>
     </style>
 
-    <style name="fab_label" parent="TextAppearance.AppCompat.Inverse">
-        <item name="android:background">@drawable/fab_label_background</item>
-        <item name="android:textColor">@color/fab_label_text_color</item>
-    </style>
-
 </resources>