[Payments] Update billing address dropdown style to match the design

chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java

Index: chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java
diff --git a/chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java b/chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java
index d7651749dc40752b32c56f982170029c087b53d5..cae4d1cbdd2ecccf3e83e5b946713fe8956fb89a 100644
--- a/chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java
+++ b/chrome/android/java/src/org/chromium/chrome/browser/payments/ui/BillingAddressAdapter.java
@@ -7,6 +7,7 @@ package org.chromium.chrome.browser.payments.ui;
 import android.content.Context;
 import android.content.res.Resources;
 import android.graphics.Typeface;
+import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
 import android.widget.ArrayAdapter;
@@ -38,6 +39,11 @@ import java.util.List;
  *                                                         ..............
  */
 public class BillingAddressAdapter<T> extends ArrayAdapter<T> {
+    private static final int TOP_VIEW_ID = 1;

[Ian Wen, 2016/12/21 23:04:24]

If multiple type does not work in spinner, I think you can simply manipulate
paddings for the first and last item in getDropDownView().

You need to make sure that every tweak you do to those special elements, you
should undo them for other normal items. A tiny example can be found here
http://stackoverflow.com/a/26240895/4371425.

This approach should simplify the code much more as no id or convertable need to
be introduced. Also it guarantees performance, as we are not creating new views
for every position.

[gogerald1, 2017/01/04 16:00:51]

Done.

+    private static final int MIDDLE_VIEW_ID = 2;
+    private static final int BOTTOM_VIEW_ID = 3;
+
+    private final Context mContext;
 
     /**
      * Creates an array adapter for which the last element is a hint that is not shown in the
@@ -59,6 +65,7 @@ public class BillingAddressAdapter<T> extends ArrayAdapter<T> {
         // The hint is added as the last element. It will not be shown when the dropdown is
         // expanded and not be taken into account in the getCount function.
         add(hint);
+        mContext = context;
     }
 
     @Override
@@ -70,32 +77,63 @@ public class BillingAddressAdapter<T> extends ArrayAdapter<T> {
 
     @Override
     public View getDropDownView(int position, View convertView, ViewGroup parent) {
-        View view;
+        boolean isViewConvertable =
+                convertView == null ? false : isViewConvertable(position, convertView);
+        // Wrap the TextView around with a LinearLayout to display the text in multiple lines.
+        View view = isViewConvertable

[Ian Wen, 2016/12/21 23:04:24]

Nit: The variable, "view", can be removed and the code could be shortened like
this:
if (!isViewConvertable) {
  convertView = LayoutInflater.from(mContext).inflate()...;
}

[gogerald1, 2017/01/04 16:00:51]

Done.

+                ? convertView
+                : LayoutInflater.from(mContext).inflate(
+                          R.layout.payment_request_dropdown_item, parent, false);
+        TextView textView = (TextView) view.findViewById(R.id.dropdown_item);
+        textView.setText(getItem(position).toString());
+
+        if (isViewConvertable) return view;
 
-        // Add a "+" icon and a blue tint to the last element.
-        if (position == getCount() - 1) {
-            view = super.getDropDownView(position, convertView, parent);
-            TextView tv = (TextView) view;
+        if (position == 0) {
+            // Padding at the top of the dropdown.
+            ApiCompatibilityUtils.setPaddingRelative(view,
+                    ApiCompatibilityUtils.getPaddingStart(view),
+                    mContext.getResources().getDimensionPixelSize(
+                            R.dimen.payments_section_small_spacing),
+                    ApiCompatibilityUtils.getPaddingEnd(view), view.getPaddingBottom());
+            view.setId(TOP_VIEW_ID);
+        } else if (position == getCount() - 1) {
+            // Add a "+" icon and a blue tint to the last element.
             Resources resources = getContext().getResources();
 
             // Create the "+" icon, put it left of the text and add appropriate padding.
-            tv.setCompoundDrawablesWithIntrinsicBounds(
+            textView.setCompoundDrawablesWithIntrinsicBounds(
                     TintedDrawable.constructTintedDrawable(
-                        resources, R.drawable.plus, R.color.light_active_color),
+                            resources, R.drawable.plus, R.color.light_active_color),
                     null, null, null);
-            tv.setCompoundDrawablePadding(
+            textView.setCompoundDrawablePadding(
                     resources.getDimensionPixelSize(R.dimen.payments_section_large_spacing));
 
             // Set the correct appearance, face and style for the text.
-            ApiCompatibilityUtils.setTextAppearance(tv, R.style.PaymentsUiSectionAddButtonLabel);
-            tv.setTypeface(Typeface.create(
-                    resources.getString(R.string.roboto_medium_typeface),
-                    R.integer.roboto_medium_textstyle));
+            ApiCompatibilityUtils.setTextAppearance(
+                    textView, R.style.PaymentsUiSectionAddButtonLabel);
+            textView.setTypeface(
+                    Typeface.create(resources.getString(R.string.roboto_medium_typeface),
+                            R.integer.roboto_medium_textstyle));
+
+            // Padding at the bottom of the dropdown.
+            ApiCompatibilityUtils.setPaddingRelative(view,
+                    ApiCompatibilityUtils.getPaddingStart(view), view.getPaddingTop(),
+                    ApiCompatibilityUtils.getPaddingEnd(view),
+                    mContext.getResources().getDimensionPixelSize(
+                            R.dimen.payments_section_small_spacing));
+            view.setId(BOTTOM_VIEW_ID);
         } else {
-            // Don't use the recycled convertView, as it may have the style of the last element.
-            view = super.getDropDownView(position, null, parent);
+            view.setId(MIDDLE_VIEW_ID);
         }
 
         return view;
     }
+
+    // Note that getViewTypeCount must return 1 if targeting LOLLIPOP and later.
+    private boolean isViewConvertable(int position, View convertView) {
+        if (position == 0) return convertView.getId() == TOP_VIEW_ID;
+        if (position == getCount() - 1) return convertView.getId() == BOTTOM_VIEW_ID;
+        return convertView.getId() == MIDDLE_VIEW_ID;
+    }
 }