Bug 975013 - Pad and correctly size show/hide password button. r=rnewman
authorNick Alexander <nalexander@mozilla.com>
Tue, 15 Apr 2014 16:54:21 -0700
changeset 179588 8a3bc080200e450abe794d60d1349528549f93ec
parent 179587 0c7af628c3dbd3b00332437ea77af98cce13633f
child 179589 3b4a911abb02a6459941bb15dc02e902140015de
push id272
push userpvanderbeken@mozilla.com
push dateMon, 05 May 2014 16:31:18 +0000
reviewersrnewman
bugs975013
milestone31.0a1
Bug 975013 - Pad and correctly size show/hide password button. r=rnewman ======== https://github.com/mozilla-services/android-sync/commit/c6509b8ed9500589db26357c55c7ae8292f34f68 Author: Nick Alexander <nalexander@mozilla.com> Bug 975013 - Part 3: Make show/hide password button size not depend on its state. ======== https://github.com/mozilla-services/android-sync/commit/3107ed8bbc49553ceaa1cd22e9225536cbed2080 Author: Nick Alexander <nalexander@mozilla.com> Date: Tue Apr 15 16:42:38 2014 -0700 Bug 975013 - Part 2: Extract FxAccountShowHidePasswordButton style. ======== https://github.com/mozilla-services/android-sync/commit/e012cac483fe6f36a7944a7771f9a7f5cdd036c3 Author: Nick Alexander <nalexander@mozilla.com> Date: Tue Apr 15 16:25:18 2014 -0700 Bug 975013 - Part 1: Add horizontal padding to show/hide password button.
mobile/android/base/resources/layout/fxaccount_email_password_view.xml
mobile/android/base/resources/values/fxaccount_dimens.xml
mobile/android/base/resources/values/fxaccount_styles.xml
--- a/mobile/android/base/resources/layout/fxaccount_email_password_view.xml
+++ b/mobile/android/base/resources/layout/fxaccount_email_password_view.xml
@@ -35,25 +35,51 @@
                 android:layout_width="fill_parent"
                 android:layout_height="wrap_content"
                 android:layout_weight="1"
                 android:background="@drawable/fxaccount_password_background"
                 android:ems="10"
                 android:hint="@string/fxaccount_password_hint"
                 android:inputType="textPassword" />
 
-            <Button
-                android:id="@+id/show_password"
-                style="@android:style/Widget.Button"
+            <!-- For the following, I beg forgiveness. The show/hide button is a
+                 toggle button; its text depends on its state. The text for each
+                 state could be a different length. We want to maintain the
+                 button's width regardless of its state. To achieve this, we
+                 size the actual button to its container, and include two
+                 invisible (but present for layout purposes) buttons, one of
+                 each state. The container wraps the larger of the two dummy
+                 buttons; the actual button sizes to the container; and we're
+                 happy. Be thankful there are not three buttons! -->
+            <FrameLayout
                 android:layout_width="wrap_content"
                 android:layout_height="fill_parent"
                 android:layout_weight="0"
-                android:background="@drawable/fxaccount_password_button_show_background"
-                android:minHeight="0dp"
-                android:padding="0dp"
-                android:text="@string/fxaccount_password_show"
-                android:textColor="@color/fxaccount_input_textColor"
-                android:textSize="20sp" >
-            </Button>
+                android:orientation="horizontal" >
+
+                <Button
+                    android:id="@+id/show_password"
+                    style="@style/FxAccountShowHidePasswordButton"
+                    android:layout_width="fill_parent"
+                    android:layout_height="fill_parent"
+                    android:text="@string/fxaccount_password_show" >
+                </Button>
+
+                <Button
+                    style="@style/FxAccountShowHidePasswordButton"
+                    android:layout_width="wrap_content"
+                    android:layout_height="fill_parent"
+                    android:text="@string/fxaccount_password_show"
+                    android:visibility="invisible" >
+                </Button>
+
+                <Button
+                    style="@style/FxAccountShowHidePasswordButton"
+                    android:layout_width="wrap_content"
+                    android:layout_height="fill_parent"
+                    android:text="@string/fxaccount_password_hide"
+                    android:visibility="invisible" >
+                </Button>
+            </FrameLayout>
         </LinearLayout>
     </LinearLayout>
 
-</merge>
\ No newline at end of file
+</merge>
--- a/mobile/android/base/resources/values/fxaccount_dimens.xml
+++ b/mobile/android/base/resources/values/fxaccount_dimens.xml
@@ -9,15 +9,20 @@
 
   <!-- The amount of horizontal padding that appears inside the email,
        password, etc input fields. -->
   <dimen name="fxaccount_input_padding_horizontal">20dp</dimen>
   <!-- And the amount of vertical padding that appears inside input
        fields. -->
   <dimen name="fxaccount_input_padding_vertical">10dp</dimen>
 
+  <!-- The amount of horizontal padding that appears around the show/hide
+       password button.  Vertical padding is provided by the adjacent input
+       field. -->
+  <dimen name="fxaccount_show_password_padding_horizontal">8dp</dimen>
+
   <!-- Preference fragment padding, bottom -->
   <dimen name="preference_fragment_padding_bottom">0dp</dimen>
   <!-- Preference fragment padding, sides -->
   <dimen name="preference_fragment_padding_side">16dp</dimen>
 
   <integer name="preference_fragment_scrollbarStyle">0x02000000</integer> <!-- outsideOverlay -->
 </resources>
--- a/mobile/android/base/resources/values/fxaccount_styles.xml
+++ b/mobile/android/base/resources/values/fxaccount_styles.xml
@@ -125,9 +125,19 @@
 
     <style name="FxAccountCheckBox">
         <item name="android:layout_width">fill_parent</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:layout_marginBottom">10dp</item>
         <item name="android:textColor">@drawable/fxaccount_checkbox_textcolor</item>
     </style>
 
+    <style name="FxAccountShowHidePasswordButton" parent="@android:style/Widget.Button">
+        <item name="android:background">@drawable/fxaccount_password_button_show_background</item>
+        <item name="android:minHeight">0dp</item>
+        <item name="android:minWidth">0dp</item>
+        <item name="android:paddingLeft">@dimen/fxaccount_show_password_padding_horizontal</item>
+        <item name="android:paddingRight">@dimen/fxaccount_show_password_padding_horizontal</item>
+        <item name="android:textColor">@color/fxaccount_input_textColor</item>
+        <item name="android:textSize">20sp</item>
+    </style>
+
 </resources>
\ No newline at end of file