From f3e01995a10884107dd09dd6d87e6714798ea672 Mon Sep 17 00:00:00 2001
From: Phillip Hsu <philliphsu@outlook.com>
Date: Tue, 6 Sep 2016 18:08:02 -0700
Subject: [PATCH] Fix layout of EditTimerActivity. Create landscape layout.

---
 .../clock2/edittimer/EditTimerActivity.java   |   6 +-
 .../res/layout-land/activity_edit_timer.xml   | 176 ++++++++++++++++++
 app/src/main/res/layout-land/item_timer.xml   |   2 +-
 .../main/res/layout/activity_edit_timer.xml   | 134 ++++++++-----
 .../main/res/layout/content_numpad_timer.xml  |  12 --
 app/src/main/res/layout/item_timer.xml        |   2 +-
 app/src/main/res/values-v21/styles_timer.xml  |   6 +
 app/src/main/res/values/dimens.xml            |   3 +
 app/src/main/res/values/styles_timer.xml      |  26 ++-
 9 files changed, 300 insertions(+), 67 deletions(-)
 create mode 100644 app/src/main/res/layout-land/activity_edit_timer.xml
 delete mode 100644 app/src/main/res/layout/content_numpad_timer.xml
 create mode 100644 app/src/main/res/values-v21/styles_timer.xml

diff --git a/app/src/main/java/com/philliphsu/clock2/edittimer/EditTimerActivity.java b/app/src/main/java/com/philliphsu/clock2/edittimer/EditTimerActivity.java
index d5e9a63..d06a55d 100644
--- a/app/src/main/java/com/philliphsu/clock2/edittimer/EditTimerActivity.java
+++ b/app/src/main/java/com/philliphsu/clock2/edittimer/EditTimerActivity.java
@@ -28,7 +28,7 @@ public class EditTimerActivity extends BaseActivity {
     public static final String EXTRA_LABEL = "com.philliphsu.clock2.edittimer.extra.LABEL";
     public static final String EXTRA_START_TIMER = "com.philliphsu.clock2.edittimer.extra.START_TIMER";
 
-    @Bind(R.id.appbar) ViewGroup mAppBar;
+    @Bind(R.id.edit_fields_layout) ViewGroup mEditFieldsLayout;
     @Bind(R.id.label) TextView mLabel;
     @Bind(R.id.hour) EditText mHour;
     @Bind(R.id.minute) EditText mMinute;
@@ -100,7 +100,7 @@ public class EditTimerActivity extends BaseActivity {
     @OnClick(R.id.backspace)
     void backspace() {
         if (mFocusGrabber.isFocused()) {
-            mAppBar.focusSearch(mFocusGrabber, View.FOCUS_LEFT).requestFocus();
+            mEditFieldsLayout.focusSearch(mFocusGrabber, View.FOCUS_LEFT).requestFocus();
         }
         EditText field = getFocusedField();
         if (field == null)
@@ -167,7 +167,7 @@ public class EditTimerActivity extends BaseActivity {
     }
 
     private EditText getFocusedField() {
-        return (EditText) mAppBar.findFocus();
+        return (EditText) mEditFieldsLayout.findFocus();
     }
 
 //    private void updateStartButtonVisibility() {
diff --git a/app/src/main/res/layout-land/activity_edit_timer.xml b/app/src/main/res/layout-land/activity_edit_timer.xml
new file mode 100644
index 0000000..b76a5c8
--- /dev/null
+++ b/app/src/main/res/layout-land/activity_edit_timer.xml
@@ -0,0 +1,176 @@
+<?xml version="1.0" encoding="utf-8"?>
+<LinearLayout
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:tools="http://schemas.android.com/tools"
+    android:layout_width="match_parent"
+    android:layout_height="match_parent"
+    android:orientation="vertical"
+    xmlns:app="http://schemas.android.com/apk/res-auto"
+    tools:context="com.philliphsu.clock2.edittimer.EditTimerActivity">
+
+    <android.support.v7.widget.Toolbar
+        android:id="@+id/toolbar"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:background="?attr/colorPrimary"
+        app:popupTheme="@style/AppTheme.PopupOverlay"
+        app:contentInsetStart="72dp">
+
+        <!--Unfortunately, we can't use a style that extends from BaseLabel
+        because we want the parent to be `TextAppearance.AppCompat.Title`, whereas
+        BaseLabel's parent is `TextAppearance.AppCompat`. We have duplicate attributes,
+        but this is fine since this is the only view that is styled like this.-->
+        <TextView
+            android:id="@+id/label"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:background="?android:attr/selectableItemBackground"
+            style="@style/TextAppearance.AppCompat.Title"
+            android:hint="@string/label"
+            android:maxLines="1"
+            android:ellipsize="end"/>
+
+    </android.support.v7.widget.Toolbar>
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="match_parent"
+        android:orientation="horizontal">
+
+        <FrameLayout
+            android:layout_width="0dp"
+            android:layout_height="match_parent"
+            android:layout_weight="1"
+            android:background="?attr/colorPrimary">
+
+            <LinearLayout
+                android:id="@+id/edit_fields_layout"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:orientation="horizontal"
+                android:theme="@style/AppTheme.AppBarOverlay"
+                android:layout_gravity="center"
+                android:layout_marginBottom="28dp">
+
+                <EditText
+                    android:id="@+id/hour"
+                    style="@style/TimerText.EditField"/>
+
+                <TextView
+                    android:id="@+id/hour_label"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:text="h"
+                    style="@style/TimerText.FieldLabel"/>
+
+                <EditText
+                    android:id="@+id/minute"
+                    style="@style/TimerText.EditField"/>
+
+                <TextView
+                    android:id="@+id/minute_label"
+                    android:text="m"
+                    style="@style/TimerText.FieldLabel"/>
+
+                <EditText
+                    android:id="@+id/second"
+                    style="@style/TimerText.EditField"/>
+
+                <TextView
+                    android:id="@+id/second_label"
+                    android:text="s"
+                    style="@style/TimerText.FieldLabel"/>
+
+                <View
+                    android:id="@+id/focus_grabber"
+                    style="@style/FocusGrabber"/> <!-- Required for right focus search -->
+
+            </LinearLayout>
+
+            <android.support.design.widget.FloatingActionButton
+                android:id="@+id/fab"
+                android:layout_gravity="bottom|center"
+                style="@style/TimerFab"/>
+
+        </FrameLayout>
+
+        <!-- We don't really need the overhead of the GridLayoutNumpad,
+        because it would be a major hassle to adapt it for timers. -->
+        <!-- We're borrowing the margins for bottom sheets, since this numpad
+        was "borrowed" from the bottom sheet numpad anyway. -->
+        <android.support.v7.widget.GridLayout
+            android:id="@+id/numpad"
+            android:layout_width="0dp"
+            android:layout_height="match_parent"
+            android:layout_weight="1"
+            app:columnCount="3">
+
+            <!--We require the buttons' heights to be weighted, so we can't
+            reuse the GridLayoutNumpadButton style used by the bottom
+            sheet numpad.-->
+            <Button
+                android:id="@+id/one"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="1"/>
+
+            <Button
+                android:id="@+id/two"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="2"/>
+
+            <Button
+                android:id="@+id/three"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="3"/>
+
+            <Button
+                android:id="@+id/four"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="4"/>
+
+            <Button
+                android:id="@+id/five"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="5"/>
+
+            <Button
+                android:id="@+id/six"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="6"/>
+
+            <Button
+                android:id="@+id/seven"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="7"/>
+
+            <Button
+                android:id="@+id/eight"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="8"/>
+
+            <Button
+                android:id="@+id/nine"
+                style="@style/GridLayoutTimerNumpadButton"
+                android:text="9"/>
+
+            <Button
+                android:id="@+id/zero"
+                style="@style/GridLayoutTimerNumpadButton"
+                app:layout_column="1"
+                android:text="0"/>
+
+            <!--GridLayoutTimerNumpadButton has text attributes.. but using it
+            is a simple way to get the weighted height. I'd rather not define a
+            new style based on GridLayoutNumpadElement just for this... -->
+            <ImageButton
+                android:id="@+id/backspace"
+                android:src="@drawable/ic_backspace_24dp"
+                style="@style/GridLayoutTimerNumpadButton"
+                app:layout_column="2"
+                android:tint="?attr/themedIconTint"/>
+
+        </android.support.v7.widget.GridLayout>
+
+    </LinearLayout>
+
+</LinearLayout>
diff --git a/app/src/main/res/layout-land/item_timer.xml b/app/src/main/res/layout-land/item_timer.xml
index 33b2a78..659c3e4 100644
--- a/app/src/main/res/layout-land/item_timer.xml
+++ b/app/src/main/res/layout-land/item_timer.xml
@@ -17,7 +17,7 @@
         <com.philliphsu.clock2.timers.CountdownChronometer
             android:id="@+id/duration"
             android:layout_below="@id/label"
-            style="@style/TimerCountdown"/>
+            style="@style/TimerText.Countdown"/>
 
         <!--The default style has padding start and end, so we remove both-->
         <com.philliphsu.clock2.UntouchableSeekBar
diff --git a/app/src/main/res/layout/activity_edit_timer.xml b/app/src/main/res/layout/activity_edit_timer.xml
index eb0fca6..a0738e9 100644
--- a/app/src/main/res/layout/activity_edit_timer.xml
+++ b/app/src/main/res/layout/activity_edit_timer.xml
@@ -8,10 +8,10 @@
     tools:context="com.philliphsu.clock2.edittimer.EditTimerActivity">
     
     <RelativeLayout
-        android:id="@+id/appbar"
+        android:id="@+id/edit_fields_layout"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:background="@color/colorPrimary"
+        android:background="?attr/colorPrimary"
         android:theme="@style/AppTheme.AppBarOverlay"
         android:layout_alignParentTop="true"
         android:paddingBottom="16dp">
@@ -24,15 +24,17 @@
             app:contentInsetStart="72dp"
             android:layout_alignParentTop="true">
 
-            <!-- Set inputType to text to get single-line input -->
+            <!--Unfortunately, we can't use a style that extends from BaseLabel
+            because we want the parent to be `TextAppearance.AppCompat.Title`, whereas
+            BaseLabel's parent is `TextAppearance.AppCompat`. We have duplicate attributes,
+            but this is fine since this is the only view that is styled like this.-->
             <TextView
                 android:id="@+id/label"
                 android:layout_width="match_parent"
-                android:layout_height="match_parent"
-                android:background="?selectableItemBackground"
+                android:layout_height="wrap_content"
+                android:background="?android:attr/selectableItemBackground"
                 style="@style/TextAppearance.AppCompat.Title"
-                android:hint="Add label"
-                android:gravity="center_vertical"
+                android:hint="@string/label"
                 android:maxLines="1"
                 android:ellipsize="end"/>
 
@@ -40,12 +42,8 @@
 
         <EditText
             android:id="@+id/hour"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:text="00"
-            android:background="@android:color/transparent"
             android:layout_below="@id/toolbar"
-            android:textSize="45sp"
+            style="@style/TimerText.EditField"
             android:layout_marginStart="72dp"/>
         
         <TextView
@@ -53,57 +51,38 @@
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:text="h"
-            android:textSize="24sp"
             android:layout_below="@id/toolbar"
             android:layout_toEndOf="@id/hour"
             android:layout_alignBaseline="@id/hour"
-            style="@style/TextAppearance.AppCompat"/>
+            style="@style/TimerText.FieldLabel"/>
 
         <EditText
             android:id="@+id/minute"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:text="00"
-            android:background="@android:color/transparent"
             android:layout_below="@id/toolbar"
             android:layout_toEndOf="@id/hour_label"
-            android:textSize="45sp"
-            />
+            style="@style/TimerText.EditField"/>
 
         <TextView
             android:id="@+id/minute_label"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
             android:text="m"
-            android:textSize="24sp"
             android:layout_below="@id/toolbar"
             android:layout_toEndOf="@id/minute"
             android:layout_alignBaseline="@id/minute"
-            style="@style/TextAppearance.AppCompat"
-            />
+            style="@style/TimerText.FieldLabel"/>
 
         <EditText
             android:id="@+id/second"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
-            android:text="00"
-            android:background="@android:color/transparent"
             android:layout_below="@id/toolbar"
             android:layout_toEndOf="@id/minute_label"
-            android:textSize="45sp"
-            />
+            style="@style/TimerText.EditField"/>
 
         <TextView
             android:id="@+id/second_label"
-            android:layout_width="wrap_content"
-            android:layout_height="wrap_content"
             android:text="s"
-            android:textSize="24sp"
             android:layout_below="@id/toolbar"
             android:layout_toEndOf="@id/second"
             android:layout_alignBaseline="@id/minute"
-            style="@style/TextAppearance.AppCompat"
-            />
+            style="@style/TimerText.FieldLabel"/>
 
         <View
             android:id="@+id/focus_grabber"
@@ -129,31 +108,90 @@
         android:layout_alignParentBottom="true"
         android:layout_centerHorizontal="true"/>-->
 
-    <!-- TODO: Consider defining a style instead. Use the same attrs
-    as below for base API versions, and make a v21 version
-    that includes margin bottom of 16dp. -->
     <android.support.design.widget.FloatingActionButton
         android:id="@+id/fab"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:src="@drawable/ic_half_day_1_24dp"
         android:layout_centerHorizontal="true"
-        android:layout_alignParentBottom="true"/>
+        android:layout_alignParentBottom="true"
+        style="@style/TimerFab"/>
 
     <!-- We don't really need the overhead of the GridLayoutNumpad,
      because it would be a major hassle to adapt it for timers. -->
+    <!-- We're borrowing the margins for bottom sheets, since this numpad
+    was "borrowed" from the bottom sheet numpad anyway. -->
     <android.support.v7.widget.GridLayout
         android:id="@+id/numpad"
         android:layout_width="match_parent"
         android:layout_height="match_parent"
-        android:layout_below="@id/appbar"
+        android:layout_below="@id/edit_fields_layout"
         android:layout_above="@id/fab"
-        android:layout_marginTop="16dp"
-        android:layout_marginStart="24dp"
-        android:layout_marginEnd="24dp"
+        android:layout_marginTop="@dimen/bottom_sheet_vertical_space"
+        android:layout_marginStart="@dimen/bottom_sheet_edge_margin"
+        android:layout_marginEnd="@dimen/bottom_sheet_edge_margin"
         app:columnCount="3">
 
-        <include layout="@layout/content_numpad_timer"/>
+        <!--We require the buttons' heights to be weighted, so we can't
+        reuse the GridLayoutNumpadButton style used by the bottom
+        sheet numpad.-->
+        <Button
+            android:id="@+id/one"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="1"/>
+
+        <Button
+            android:id="@+id/two"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="2"/>
+
+        <Button
+            android:id="@+id/three"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="3"/>
+
+        <Button
+            android:id="@+id/four"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="4"/>
+
+        <Button
+            android:id="@+id/five"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="5"/>
+
+        <Button
+            android:id="@+id/six"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="6"/>
+
+        <Button
+            android:id="@+id/seven"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="7"/>
+
+        <Button
+            android:id="@+id/eight"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="8"/>
+
+        <Button
+            android:id="@+id/nine"
+            style="@style/GridLayoutTimerNumpadButton"
+            android:text="9"/>
+
+        <Button
+            android:id="@+id/zero"
+            style="@style/GridLayoutTimerNumpadButton"
+            app:layout_column="1"
+            android:text="0"/>
+
+        <!--GridLayoutTimerNumpadButton has text attributes.. but using it
+        is a simple way to get the weighted height. I'd rather not define a
+        new style based on GridLayoutNumpadElement just for this... -->
+        <ImageButton
+            android:id="@+id/backspace"
+            android:src="@drawable/ic_backspace_24dp"
+            style="@style/GridLayoutTimerNumpadButton"
+            app:layout_column="2"
+            android:tint="?attr/themedIconTint"/>
 
     </android.support.v7.widget.GridLayout>
 
diff --git a/app/src/main/res/layout/content_numpad_timer.xml b/app/src/main/res/layout/content_numpad_timer.xml
deleted file mode 100644
index 1a12ca2..0000000
--- a/app/src/main/res/layout/content_numpad_timer.xml
+++ /dev/null
@@ -1,12 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<merge xmlns:android="http://schemas.android.com/apk/res/android"
-       xmlns:grid="http://schemas.android.com/apk/res-auto">
-    <include layout="@layout/content_grid_layout_numpad"/>
-
-    <ImageButton
-        android:id="@+id/backspace"
-        android:src="@drawable/ic_backspace_24dp"
-        style="@style/GridLayoutNumpadElement"
-        grid:layout_column="2"/>
-
-</merge>
\ No newline at end of file
diff --git a/app/src/main/res/layout/item_timer.xml b/app/src/main/res/layout/item_timer.xml
index eb3bfe5..3607299 100644
--- a/app/src/main/res/layout/item_timer.xml
+++ b/app/src/main/res/layout/item_timer.xml
@@ -18,7 +18,7 @@
         <com.philliphsu.clock2.timers.CountdownChronometer
             android:id="@+id/duration"
             android:layout_below="@id/label"
-            style="@style/TimerCountdown"/>
+            style="@style/TimerText.Countdown"/>
 
         <!--The default style has padding start and end, so we remove both-->
         <com.philliphsu.clock2.UntouchableSeekBar
diff --git a/app/src/main/res/values-v21/styles_timer.xml b/app/src/main/res/values-v21/styles_timer.xml
new file mode 100644
index 0000000..dad4634
--- /dev/null
+++ b/app/src/main/res/values-v21/styles_timer.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <style name="TimerFab" parent="BaseTimerFab">
+        <item name="android:layout_marginBottom">@dimen/fab_margin</item>
+    </style>
+</resources>
\ No newline at end of file
diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml
index 111514d..cd17033 100644
--- a/app/src/main/res/values/dimens.xml
+++ b/app/src/main/res/values/dimens.xml
@@ -64,6 +64,9 @@
     <dimen name="expanded_alarm_elevation">2dp</dimen> <!--TODO: Increase for v21-->
     <dimen name="label_height">48dp</dimen>
 
+    <!--EditTimerActivity-->
+    <dimen name="field_end_margin">8dp</dimen>
+
     <dimen name="text_size_body_1">14sp</dimen>
     <dimen name="text_size_body_2">14sp</dimen>
     <dimen name="text_size_button">14sp</dimen>
diff --git a/app/src/main/res/values/styles_timer.xml b/app/src/main/res/values/styles_timer.xml
index 3e3f65c..7d5699d 100644
--- a/app/src/main/res/values/styles_timer.xml
+++ b/app/src/main/res/values/styles_timer.xml
@@ -4,13 +4,24 @@
         <item name="android:layout_centerHorizontal">true</item>
         <item name="android:padding">@dimen/cardview_margin</item>
     </style>
-    <style name="TimerCountdown" parent="TextAppearance.AppCompat">
+    <style name="TimerText" parent="TextAppearance.AppCompat">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:fontFamily">sans-serif-light</item>
-        <item name="android:layout_centerHorizontal">true</item>
         <item name="android:textSize">@dimen/text_size_display_2</item>
     </style>
+    <style name="TimerText.Countdown">
+        <item name="android:layout_centerHorizontal">true</item>
+    </style>
+    <style name="TimerText.EditField">
+        <item name="android:text">00</item>
+        <item name="android:textSize">@dimen/text_size_display_3</item>
+        <item name="android:background">@android:color/transparent</item>
+    </style>
+    <style name="TimerText.FieldLabel">
+        <item name="android:textSize">@dimen/text_size_medium</item>
+        <item name="android:layout_marginEnd">@dimen/field_end_margin</item>
+    </style>
     <style name="TimerSeekBar" parent="BaseSeekBar">
         <item name="android:splitTrack">false</item> <!--TODO: Move to v21?-->
     </style>
@@ -33,4 +44,15 @@
         <item name="android:textColor">?attr/themedIconTint</item>
         <item name="android:textStyle">bold</item>
     </style>
+    <!--Style for the FAB in EditTimerActivity-->
+    <style name="BaseTimerFab">
+        <item name="android:layout_width">wrap_content</item>
+        <item name="android:layout_height">wrap_content</item>
+        <item name="android:src">@drawable/ic_start_24dp</item>
+    </style>
+    <style name="TimerFab" parent="BaseTimerFab"/>
+    <style name="GridLayoutTimerNumpadButton" parent="GridLayoutNumpadButton">
+        <item name="android:layout_height">0dp</item>
+        <item name="layout_rowWeight">1</item>
+    </style>
 </resources>
\ No newline at end of file