Add icon to the Data Saver main menu footer and update to spec

chrome/android/java/res/layout/data_reduction_main_menu_footer.xml

Index: chrome/android/java/res/layout/data_reduction_main_menu_footer.xml
diff --git a/chrome/android/java/res/layout/data_reduction_main_menu_footer.xml b/chrome/android/java/res/layout/data_reduction_main_menu_footer.xml
index 15cc470b4b5ee3bee2044db603df5a40687abded..91a4449dc70e3a555ece67c956434906691a949e 100644
--- a/chrome/android/java/res/layout/data_reduction_main_menu_footer.xml
+++ b/chrome/android/java/res/layout/data_reduction_main_menu_footer.xml
@@ -9,24 +9,48 @@
     android:id="@+id/data_reduction_footer"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
-    android:layout_gravity="start"
-    android:paddingTop="12dp"
-    android:paddingBottom="12dp"
     android:orientation="vertical"
-    style="@style/AppMenuItem" >
+    android:background="#EDFAFAFA" >
 
-    <TextView
-        android:id="@+id/menu_item_text"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:text="@string/data_reduction_title"
-        android:textAppearance="?android:attr/textAppearanceLargePopupMenu" />
+    <View style="@style/Divider" />
 
-    <TextView
-        android:id="@+id/menu_item_summary"
-        android:layout_width="wrap_content"
+    <LinearLayout
+        android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:textSize="14sp"
-        android:textColor="@color/descriptive_text_color" />
+        android:layout_gravity="start"
+        android:paddingTop="12dp"
+        android:paddingBottom="12dp"
+        android:orientation="horizontal"
+        style="@style/AppMenuItem" >

[Ted C, 2017/04/07 18:19:10]

I think even if we want to keep AppMenuItem, we should still make
DataReductionMainMenuFooter and this LinearLayout into FrameLayouts.

Here you would set a marginTop to 1dp which is the divider height.  We could
pull out a size dimen for this and use it in styles.xml for Divider and allow it
to be reused here.

Then if we just change layout_width of the image view to be a specific value,
set the marginStart of the inner linearlayout to match, you should be able to
reduce from 3 nested LinearLayouts to having just one as the child.  The number
of layout passes required to do that should be fewer and it shouldn't make it
too hard to grok IMO.

[megjablon, 2017/04/07 20:03:26]

Done. PTAL to make sure I understood correctly.

+
+        <ImageView
+            android:id="@+id/chart_icon"
+            android:src="@+drawable/data_reduction_main_menu_icon"
+            android:layout_width="wrap_content"
+            android:layout_height="match_parent"
+            android:contentDescription="@null" />
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:orientation="vertical"
+            android:paddingStart="16dp" >
+
+            <TextView
+                android:id="@+id/menu_item_text"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:textSize="14sp"
+                android:textAppearance="@style/RobotoMediumStyle" />
+
+            <TextView
+                android:id="@+id/menu_item_summary"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:textSize="14sp"
+                android:textColor="@color/descriptive_text_color" />
+        </LinearLayout>
+
+    </LinearLayout>
 
 </org.chromium.chrome.browser.preferences.datareduction.DataReductionMainMenuFooter>