Add shadow and improve text quality on widgets (#961)

MozillaReality · Feb 22, 2019 · a7df7c3 · a7df7c3
1 parent 25cacd5
commit a7df7c3
Show file tree

Hide file tree

Showing 6 changed files with 28 additions and 2 deletions.
diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/MenuWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/MenuWidget.java
@@ -7,6 +7,7 @@
 package org.mozilla.vrbrowser.ui.widgets;
 
 import android.content.Context;
+import android.graphics.Color;
 import android.graphics.drawable.Drawable;
 import android.view.LayoutInflater;
 import android.view.MotionEvent;
@@ -158,11 +159,13 @@ public boolean onHover(View view, MotionEvent event) {
                 case MotionEvent.ACTION_HOVER_ENTER:
                     view.setHovered(true);
                     label.setHovered(true);
+                    label.setShadowLayer(label.getShadowRadius(), label.getShadowDx(), label.getShadowDy(), getContext().getColor(R.color.text_shadow_light));
                     image.setHovered(true);
                     return true;
 
                 case MotionEvent.ACTION_HOVER_EXIT:
                     view.setHovered(false);
+                    label.setShadowLayer(label.getShadowRadius(), label.getShadowDx(), label.getShadowDy(), getContext().getColor(R.color.text_shadow));
                     label.setHovered(false);
                     image.setHovered(false);
                     return true;

diff --git a/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/SuggestionsWidget.java b/app/src/common/shared/org/mozilla/vrbrowser/ui/widgets/SuggestionsWidget.java
@@ -345,7 +345,7 @@ public View getView(int position, View convertView, ViewGroup parent) {
                 return false;
 
             View favicon = view.findViewById(R.id.favicon);
-            View title = view.findViewById(R.id.title);
+            TextView title = view.findViewById(R.id.title);
             View url = view.findViewById(R.id.url);
             View delete = view.findViewById(R.id.delete);
             int ev = motionEvent.getActionMasked();
@@ -354,6 +354,7 @@ public View getView(int position, View convertView, ViewGroup parent) {
                     view.setHovered(true);
                     favicon.setHovered(true);
                     title.setHovered(true);
+                    title.setShadowLayer(title.getShadowRadius(), title.getShadowDx(), title.getShadowDy(), getContext().getColor(R.color.text_shadow_light));
                     url.setHovered(true);
                     delete.setHovered(true);
                     return true;
@@ -362,6 +363,7 @@ public View getView(int position, View convertView, ViewGroup parent) {
                     view.setHovered(false);
                     favicon.setHovered(false);
                     title.setHovered(false);
+                    title.setShadowLayer(title.getShadowRadius(), title.getShadowDx(), title.getShadowDy(), getContext().getColor(R.color.text_shadow));
                     url.setHovered(false);
                     delete.setHovered(false);
                     return true;

diff --git a/app/src/main/res/layout/honeycomb_button.xml b/app/src/main/res/layout/honeycomb_button.xml
@@ -36,6 +36,7 @@
             android:fontFamily="sans-serif-light"
             android:gravity="center"
             android:text="Secondary text"
+            android:textStyle="bold"
             android:textSize="@dimen/text_smaller_size" />
     </LinearLayout>
 </merge>
diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
@@ -24,4 +24,6 @@
     <color name="iron">#5d5d5d</color>
     <color name="rhino">#8c898a</color>
     <color name="geranium">#d73e5a</color>
+    <color name="text_shadow">#8F000000</color>
+    <color name="text_shadow_light">#7FFFFFFF</color>
 </resources>
diff --git a/app/src/main/res/values/dimen.xml b/app/src/main/res/values/dimen.xml
@@ -136,7 +136,7 @@
     <dimen name="text_big_size">18sp</dimen>
     <dimen name="text_medium_size">14sp</dimen>
     <dimen name="text_small_size">12sp</dimen>
-    <dimen name="text_smaller_size">10sp</dimen>
+    <dimen name="text_smaller_size">11sp</dimen>
 
     <!-- Popup Window -->
     <item name="url_bar_popup_world_width" format="float" type="dimen">4</item>

diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml
@@ -16,6 +16,21 @@
         <attr name="scrollbarStyle" format="color" />
     </declare-styleable>
 
+
+    <style name="ShadowTextViewStyle" parent="android:Widget.TextView">
+        <item name="android:shadowColor">@color/text_shadow</item>
+        <item name="android:shadowDx">2</item>
+        <item name="android:shadowDy">2</item>
+        <item name="android:shadowRadius">7</item>
+    </style>
+
+    <style name="ShadowLightTextViewStyle" parent="android:Widget.TextView">
+        <item name="android:shadowColor">@color/text_shadow_light</item>
+        <item name="android:shadowDx">2</item>
+        <item name="android:shadowDy">2</item>
+        <item name="android:shadowRadius">4</item>
+    </style>
+
     <style name="radioButtonTheme">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">wrap_content</item>
@@ -278,6 +293,9 @@
         <item name="android:fastScrollOverlayPosition">atThumb</item>
         <item name="android:smoothScrollbar">true</item>
         <item name="android:overScrollMode">ifContentScrolls</item>
+
+        <!-- TextView Style -->
+        <item name="android:textViewStyle">@style/ShadowTextViewStyle</item>
     </style>
 
     <style name="Widget.FastScroll" parent="android:Widget.Material.FastScroll"/>