Bug 1403596 - Adjust menu buttons position on tabs panel. r=nechen

MozReview-Commit-ID: 3i5rP6YLO0e

--HG--
extra : rebase_source : 3c83ca4eebce7a06e5de1e736ca894e8af070234
extra : source : c16582a1b32007ae27f12d90ebab6173c3f99c5d

mobile/android/app/src/main/res/layout/tabs_panel_default.xml

@@ -43,30 +43,20 @@
                   android:layout_height="match_parent"
                   android:layout_weight="1.0"/>
 
-            <ImageButton android:id="@+id/add_tab"
-                         style="@style/UrlBar.ImageButton"
-                         android:layout_width="@dimen/tabs_panel_button_width"
-                         android:padding="@dimen/browser_toolbar_button_padding"
-                         android:src="@drawable/tab_new"
-                         android:contentDescription="@string/new_tab"
-                         android:background="@drawable/action_bar_button_inverse"/>
+            <org.mozilla.gecko.toolbar.ToolbarRoundButton
+                android:id="@+id/add_tab"
+                style="@style/TabsTray.AddTab"
+                android:background="@drawable/action_bar_button_inverse"
+                android:contentDescription="@string/new_tab"
+                android:src="@drawable/tab_new"/>
 
-            <FrameLayout android:id="@+id/tabs_menu"
-                         style="@style/UrlBar.ImageButton"
-                         android:layout_width="@dimen/tabs_panel_button_width"
-                         android:background="@drawable/action_bar_button_inverse"
-                         android:contentDescription="@string/menu">
-
-                <ImageView
-                        style="@style/UrlBar.ImageButton"
-                        android:layout_width="wrap_content"
-                        android:layout_height="@dimen/browser_toolbar_menu_icon_height"
-                        android:layout_gravity="center"
-                        android:scaleType="centerInside"
-                        android:src="@drawable/menu"
-                        android:tint="@color/tabs_tray_icon_grey"/>
-
-            </FrameLayout>
+            <org.mozilla.gecko.toolbar.ToolbarRoundButton
+                android:id="@+id/tabs_menu"
+                style="@style/TabsTray.Menu"
+                android:background="@drawable/action_bar_button_inverse"
+                android:contentDescription="@string/menu"
+                android:src="@drawable/ic_overflow"
+                android:tint="@color/tabs_tray_icon_grey"/>
 
         </view>
 

mobile/android/app/src/photon/java/org/mozilla/gecko/toolbar/ToolbarRoundButton.java

@@ -6,14 +6,19 @@ package org.mozilla.gecko.toolbar;
 
 import android.content.Context;
 import android.content.res.Resources;
+import android.content.res.TypedArray;
 import android.graphics.Path;
 import android.graphics.RectF;
+import android.graphics.drawable.Drawable;
+import android.support.v4.content.ContextCompat;
 import android.util.AttributeSet;
 
 import org.mozilla.gecko.R;
 
 class ToolbarRoundButton extends ShapedButton {
 
+    private Drawable mBackgroundDrawable;
+
     public ToolbarRoundButton(Context context) {
         this(context, null);
     }
@@ -25,6 +30,14 @@ class ToolbarRoundButton extends ShapedButton {
     public ToolbarRoundButton(Context context, AttributeSet attrs, int defStyle) {
         super(context, attrs, defStyle);
 
+        final TypedArray a = context.obtainStyledAttributes(attrs, new int[] { android.R.attr.background });
+        mBackgroundDrawable = a.getDrawable(0);
+        if (mBackgroundDrawable == null) {
+            // Use default value if no background specified.
+            mBackgroundDrawable = ContextCompat.getDrawable(context, R.drawable.url_bar_action_button);
+        }
+        a.recycle();
+
         setPrivateMode(false);
     }
 
@@ -45,11 +58,11 @@ class ToolbarRoundButton extends ShapedButton {
 
     @Override
     public void onLightweightThemeChanged() {
-        setBackgroundResource(R.drawable.url_bar_action_button);
+        setBackground(mBackgroundDrawable);
     }
 
     @Override
     public void onLightweightThemeReset() {
-        setBackgroundResource(R.drawable.url_bar_action_button);
+        setBackground(mBackgroundDrawable);
     }
 }

mobile/android/app/src/photon/res/layout/browser_toolbar.xml

@@ -42,13 +42,15 @@
     <org.mozilla.gecko.toolbar.ToolbarRoundButton
         android:id="@+id/menu"
         style="@style/UrlBar.Menu"
+        android:background="@drawable/url_bar_action_button"
         android:contentDescription="@string/menu"
         android:src="@drawable/ic_overflow"/>
 
     <org.mozilla.gecko.toolbar.ToolbarRoundButton
         android:id="@+id/tabs"
         style="@style/UrlBar.Tabs"
-        android:layout_alignWithParentIfMissing="true"/>
+        android:layout_alignWithParentIfMissing="true"
+        android:background="@drawable/url_bar_action_button"/>
 
     <org.mozilla.gecko.toolbar.TabCounter
         android:id="@+id/tabs_counter"

mobile/android/app/src/photon/res/values-large-v17/styles.xml

@@ -88,4 +88,12 @@
         <item name="android:paddingEnd">@dimen/browser_toolbar_site_security_margin_end</item>
     </style>
 
+    <style name="TabsTray.AddTab" parent="TabsTray.V17.AddTab"/>
+    <style name="TabsTray.V17.AddTab" parent="TabsTray.Base.AddTab"/>
+
+    <style name="TabsTray.Menu" parent="TabsTray.V17.Menu"/>
+    <style name="TabsTray.V17.Menu" parent="TabsTray.Base.Menu">
+        <item name="android:layout_marginEnd">6dp</item>
+    </style>
+
 </resources>

mobile/android/app/src/photon/res/values-large/styles.xml

@@ -207,4 +207,12 @@
         <item name="android:paddingRight">@dimen/browser_toolbar_site_security_margin_end</item>
     </style>
 
+    <style name="TabsTray.AddTab" parent="TabsTray.V15.AddTab"/>
+    <style name="TabsTray.V15.AddTab" parent="TabsTray.Base.AddTab"/>
+
+    <style name="TabsTray.Menu" parent="TabsTray.V15.Menu"/>
+    <style name="TabsTray.V15.Menu" parent="TabsTray.Base.Menu">
+        <item name="android:layout_marginRight">6dp</item>
+    </style>
+
 </resources>

mobile/android/app/src/photon/res/values-v17/styles.xml

@@ -77,6 +77,14 @@
         <item name="android:layout_marginRight">-3dp</item>
     </style>
 
+    <style name="TabsTray.AddTab" parent="TabsTray.V17.AddTab" />
+    <style name="TabsTray.V17.AddTab" parent="TabsTray.Base.AddTab">
+        <item name="android:layout_marginEnd">-3dp</item>
+    </style>
+
+    <style name="TabsTray.Menu" parent="TabsTray.V17.Menu" />
+    <style name="TabsTray.V17.Menu" parent="TabsTray.Base.Menu"/>
+
     <style name="TabStrip.Favicon" parent="TabStrip.V17.Favicon"/>
     <style name="TabStrip.V17.Favicon" parent="TabStrip.Base.Favicon">
         <item name="android:layout_marginStart">12dp</item>

mobile/android/app/src/photon/res/values/dimens.xml

@@ -29,7 +29,6 @@
     <dimen name="browser_toolbar_height_flipper">@dimen/browser_toolbar_height</dimen>
     <dimen name="browser_toolbar_button_padding">12dp</dimen>
     <dimen name="browser_toolbar_icon_width">48dp</dimen>
-    <dimen name="browser_toolbar_menu_icon_height">16dp</dimen>
     <dimen name="browser_toolbar_menu_radius">2dp</dimen>
 
     <dimen name="browser_toolbar_url_height">32dp</dimen>

mobile/android/app/src/photon/res/values/styles.xml

@@ -923,6 +923,20 @@
         <item name="android:layout_marginRight">-3dp</item>
     </style>
 
+    <style name="TabsTray.AddTab" parent="TabsTray.V15.AddTab"/>
+    <style name="TabsTray.V15.AddTab" parent="TabsTray.Base.AddTab">
+        <item name="android:layout_marginRight">-3dp</item>
+    </style>
+    <style name="TabsTray.Base.AddTab" parent="UrlBar.ImageButton">
+        <item name="drawableTintList">@null</item>
+    </style>
+
+    <style name="TabsTray.Menu" parent="TabsTray.V15.Menu"/>
+    <style name="TabsTray.V15.Menu" parent="TabsTray.Base.Menu"/>
+    <style name="TabsTray.Base.Menu" parent="UrlBar.ImageButton">
+        <item name="drawableTintList">@null</item>
+    </style>
+
     <!-- TabStrip -->
     <style name="TabStrip"/>