Tweak FAB speed dial design

xbmc · Feb 22, 2018 · 1b329e2 · 1b329e2
1 parent 13b8d27
commit 1b329e2
Show file tree

Hide file tree

Showing 8 changed files with 76 additions and 35 deletions.
diff --git a/app/src/main/res/color/fabspeeddial_label.xml b/app/src/main/res/color/fabspeeddial_label.xml
@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="utf-8"?>
+<selector xmlns:android="http://schemas.android.com/apk/res/android">
+    <item android:state_focused="true"
+          android:color="?attr/fabLabelColorFocused" />
+    <item android:state_pressed="true"
+          android:color="?attr/fabLabelColorPressed" />
+    <item android:color="?attr/fabLabelColorNormal" />
+</selector>
diff --git a/app/src/main/res/drawable/rounded_corners_shape.xml b/app/src/main/res/drawable/rounded_corners_shape.xml
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <shape xmlns:android="http://schemas.android.com/apk/res/android">
     <solid android:color="#FFFFFF"/>
-    <corners android:radius="6dp"/>
-    <padding android:left="5dp" android:top="5dp" android:right="5dp" android:bottom="5dp" />
+    <corners android:radius="3dp"/>
+    <padding android:left="8dp" android:top="5dp" android:right="8dp" android:bottom="5dp" />
 </shape>
diff --git a/app/src/main/res/layout/dial_action_button.xml b/app/src/main/res/layout/dial_action_button.xml
@@ -11,8 +11,8 @@
         android:layout_gravity="center_vertical"
         android:layout_marginRight="@dimen/default_padding"
         android:layout_marginEnd="@dimen/default_padding"
-        app:backgroundTint="@color/fabspeeddial"
-        style="@style/TextAppearance.Label"
+        app:backgroundTint="@color/fabspeeddial_label"
+        style="@style/TextAppearance.Label.FAB"
         android:elevation="4dp"/>
     <android.support.design.widget.FloatingActionButton
         android:id="@+id/dial_action_button"

diff --git a/app/src/main/res/layout/fab_speed_dial.xml b/app/src/main/res/layout/fab_speed_dial.xml
@@ -1,31 +1,38 @@
 <?xml version="1.0" encoding="utf-8"?>
 <merge xmlns:android="http://schemas.android.com/apk/res/android"
-       xmlns:app="http://schemas.android.com/apk/res-auto">
-        <org.xbmc.kore.ui.widgets.fabspeeddial.DialActionButton
-            android:id="@+id/play_local"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="end"
-            android:text="@string/play_locally"
-            app:iconFABDial="?attr/iconRemoteDevice"
-            app:fabSize="mini"
-            android:visibility="invisible"
-            />
-        <org.xbmc.kore.ui.widgets.fabspeeddial.DialActionButton
-            android:id="@+id/play_remote"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:layout_gravity="end"
-            android:text="@string/play_on_kodi"
-            app:iconFABDial="?attr/iconTvShows"
-            app:fabSize="mini"
-            android:visibility="invisible"
-            />
-        <android.support.design.widget.FloatingActionButton
-            android:id="@+id/fabspeeddial"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            app:fabSize="normal"
-            android:layout_gravity="end"
-            app:useCompatPadding="true"/>
+    xmlns:app="http://schemas.android.com/apk/res-auto">
+
+    <org.xbmc.kore.ui.widgets.fabspeeddial.DialActionButton
+        android:id="@+id/play_local"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="end"
+        android:layout_marginEnd="@dimen/fab_mini_margin"
+        android:layout_marginRight="@dimen/fab_mini_margin"
+        android:text="@string/play_locally"
+        android:visibility="invisible"
+        app:fabSize="mini"
+        app:iconFABDial="?attr/iconRemoteDevice"/>
+
+    <org.xbmc.kore.ui.widgets.fabspeeddial.DialActionButton
+        android:id="@+id/play_remote"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="end"
+        android:layout_marginEnd="@dimen/fab_mini_margin"
+        android:layout_marginRight="@dimen/fab_mini_margin"
+        android:text="@string/play_on_kodi"
+        android:visibility="invisible"
+        app:fabSize="mini"
+        app:iconFABDial="?attr/iconTvShows"/>
+
+    <android.support.design.widget.FloatingActionButton
+        android:id="@+id/fabspeeddial"
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="end"
+        android:layout_marginEnd="@dimen/fab_normal_margin"
+        android:layout_marginRight="@dimen/fab_normal_margin"
+        app:fabSize="normal"
+        app:useCompatPadding="true" />
 </merge>
diff --git a/app/src/main/res/values/attr.xml b/app/src/main/res/values/attr.xml
@@ -34,6 +34,12 @@
     <attr name="fabColorFocused" format="reference|color" />
     <attr name="fabColorPressed" format="reference|color" />
 
+    <attr name="fabLabelColorNormal" format="reference|color" />
+    <attr name="fabLabelColorFocused" format="reference|color" />
+    <attr name="fabLabelColorPressed" format="reference|color" />
+
+    <attr name="fabLabelTextColor" format="reference|color" />
+
     <attr name="colorinProgress" format="reference|color" />
     <attr name="colorFinished" format="reference|color" />
 

diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
@@ -137,4 +137,7 @@
     <dimen name="now_playing_panel_height">64dp</dimen>
     <dimen name="now_playing_panel_art_width">48dp</dimen>
 
+    <dimen name="fab_normal_margin">8dp</dimen>
+    <dimen name="fab_mini_margin">16dp</dimen>
+
 </resources>
diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
@@ -334,9 +334,14 @@
     </style>
 
     <style name="TextAppearance.Label">
+        <item name="android:textColor">?attr/textColorOverPrimary</item>
+        <item name="android:textStyle">bold</item>
+    </style>
+
+    <style name="TextAppearance.Label.FAB">
         <item name="android:background">@drawable/rounded_corners_shape</item>
         <item name="android:colorBackground">@drawable/rounded_corners_shape</item>
-        <item name="android:textColor">?attr/textColorOverPrimary</item>
+        <item name="android:textColor">?attr/fabLabelTextColor</item>
         <item name="android:textStyle">bold</item>
     </style>
 

diff --git a/app/src/main/res/values/themes.xml b/app/src/main/res/values/themes.xml
@@ -63,6 +63,12 @@
         <item name="fabColorPressed">?attr/colorPrimaryDark</item>
         <item name="fabColorFocused">@color/estuary_default_light</item>
 
+        <item name="fabLabelColorNormal">?attr/colorPrimary</item>
+        <item name="fabLabelColorPressed">?attr/colorPrimaryDark</item>
+        <item name="fabLabelColorFocused">@color/estuary_default_light</item>
+
+        <item name="fabLabelTextColor">@color/white</item>
+
         <item name="colorinProgress">@color/yellow_800</item>
         <item name="colorFinished">@color/green_600</item>
 
@@ -189,10 +195,16 @@
         <item name="textColorOverPrimary">@color/white</item>
         <item name="buttonColorOverPrimary">@color/white</item>
 
-        <item name="fabColorNormal">@color/accent_default</item>
-        <item name="fabColorPressed">@color/accent_default_dark</item>
+        <item name="fabColorNormal">?attr/colorPrimary</item>
+        <item name="fabColorPressed">?attr/colorPrimaryDark</item>
         <item name="fabColorFocused">@color/accent_default_light</item>
 
+        <item name="fabLabelColorNormal">?attr/colorPrimary</item>
+        <item name="fabLabelColorPressed">?attr/colorPrimaryDark</item>
+        <item name="fabLabelColorFocused">@color/accent_default_light</item>
+
+        <item name="fabLabelTextColor">@color/white</item>
+
         <item name="colorinProgress">@color/yellow_800</item>
         <item name="colorFinished">@color/light_green_600</item>