Merge "Add new preview UI for theme picker" into ub-launcher3-master
diff --git a/res/layout/theme_preview_app_icon_shape.xml b/res/layout/theme_preview_app_icon_shape.xml
new file mode 100644
index 0000000..c6f4cd9
--- /dev/null
+++ b/res/layout/theme_preview_app_icon_shape.xml
@@ -0,0 +1,122 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2020 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:paddingHorizontal="@dimen/preview_theme_app_icon_shape_padding_horizontal"
+    android:orientation="vertical">
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:paddingTop="@dimen/preview_theme_app_icon_shape_padding_top"
+        android:orientation="horizontal">
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:gravity="center_horizontal"
+            android:orientation="vertical">
+            <ImageView
+                android:id="@+id/shape_preview_icon_0"
+                android:layout_width="@dimen/preview_theme_shape_size"
+                android:layout_height="@dimen/preview_theme_shape_size"
+                android:elevation="4dp"/>
+            <TextView
+                android:id="@+id/shape_preview_icon_app_name_0"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/preview_theme_app_icon_shape_text_margin_top"
+                android:textSize="@dimen/preview_theme_app_icon_shape_text_size"
+                android:lineHeight="20dp"/>
+        </LinearLayout>
+
+        <Space
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"/>
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:gravity="center_horizontal"
+            android:orientation="vertical">
+            <ImageView
+                android:id="@+id/shape_preview_icon_1"
+                android:layout_width="@dimen/preview_theme_shape_size"
+                android:layout_height="@dimen/preview_theme_shape_size"
+                android:elevation="4dp"/>
+            <TextView
+                android:id="@+id/shape_preview_icon_app_name_1"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/preview_theme_app_icon_shape_text_margin_top"
+                android:textSize="@dimen/preview_theme_app_icon_shape_text_size"
+                android:lineHeight="20dp"/>
+        </LinearLayout>
+
+    </LinearLayout>
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:paddingTop="@dimen/preview_theme_app_icon_shape_padding_top"
+        android:orientation="horizontal">
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:gravity="center_horizontal"
+            android:orientation="vertical">
+            <ImageView
+                android:id="@+id/shape_preview_icon_2"
+                android:layout_width="@dimen/preview_theme_shape_size"
+                android:layout_height="@dimen/preview_theme_shape_size"
+                android:elevation="4dp"/>
+            <TextView
+                android:id="@+id/shape_preview_icon_app_name_2"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/preview_theme_app_icon_shape_text_margin_top"
+                android:textSize="@dimen/preview_theme_app_icon_shape_text_size"
+                android:lineHeight="20dp"/>
+        </LinearLayout>
+
+        <Space
+            android:layout_width="0dp"
+            android:layout_height="wrap_content"
+            android:layout_weight="1"/>
+
+        <LinearLayout
+            android:layout_width="wrap_content"
+            android:layout_height="wrap_content"
+            android:gravity="center_horizontal"
+            android:orientation="vertical">
+            <ImageView
+                android:id="@+id/shape_preview_icon_3"
+                android:layout_width="@dimen/preview_theme_shape_size"
+                android:layout_height="@dimen/preview_theme_shape_size"
+                android:elevation="4dp"/>
+            <TextView
+                android:id="@+id/shape_preview_icon_app_name_3"
+                android:layout_width="wrap_content"
+                android:layout_height="wrap_content"
+                android:layout_marginTop="@dimen/preview_theme_app_icon_shape_text_margin_top"
+                android:textSize="@dimen/preview_theme_app_icon_shape_text_size"
+                android:lineHeight="20dp"/>
+        </LinearLayout>
+    </LinearLayout>
+</LinearLayout>
diff --git a/res/layout/theme_preview_card_v2.xml b/res/layout/theme_preview_card_v2.xml
index f0852e6..74d1e68 100644
--- a/res/layout/theme_preview_card_v2.xml
+++ b/res/layout/theme_preview_card_v2.xml
@@ -35,7 +35,5 @@
     <FrameLayout
         android:id="@+id/theme_preview_container"
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:paddingVertical="@dimen/preview_card_top_padding"
-        android:paddingHorizontal="@dimen/preview_card_padding"/>
+        android:layout_height="match_parent"/>
 </androidx.cardview.widget.CardView>
\ No newline at end of file
diff --git a/res/layout/theme_preview_color_icons.xml b/res/layout/theme_preview_color_icons.xml
new file mode 100644
index 0000000..7a068ee
--- /dev/null
+++ b/res/layout/theme_preview_color_icons.xml
@@ -0,0 +1,169 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+     Copyright (C) 2020 The Android Open Source Project
+
+     Licensed under the Apache License, Version 2.0 (the "License");
+     you may not use this file except in compliance with the License.
+     You may obtain a copy of the License at
+
+          http://www.apache.org/licenses/LICENSE-2.0
+
+     Unless required by applicable law or agreed to in writing, software
+     distributed under the License is distributed on an "AS IS" BASIS,
+     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+     See the License for the specific language governing permissions and
+     limitations under the License.
+-->
+<androidx.cardview.widget.CardView
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:id="@+id/color_icons_section"
+    android:layout_width="match_parent"
+    android:layout_height="wrap_content"
+    android:background="@color/primary_color">
+
+    <LinearLayout
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:paddingHorizontal="@dimen/preview_theme_color_icons_padding_horizontal"
+        android:orientation="vertical">
+
+        <!-- Title -->
+        <TextView
+            android:id="@+id/color_icons_section_title"
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="@dimen/preview_theme_color_icons_title_margin_top"
+            android:layout_marginBottom="@dimen/preview_theme_color_icons_title_margin_bottom"
+            android:text="@string/theme_preview_icons_section_title"
+            android:textSize="@dimen/preview_theme_color_icons_title_text_size"
+            android:lineHeight="16dp"
+            android:gravity="center"/>
+
+        <!-- QS icons -->
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:orientation="horizontal">
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                android:layout_height="@dimen/preview_theme_color_icons_icon_size">
+                <ImageView
+                    android:id="@+id/preview_color_qs_0_bg"
+                    android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_icon_size"/>
+                <ImageView
+                    android:id="@+id/preview_color_qs_0_icon"
+                    android:layout_width="@dimen/preview_theme_color_icons_tile_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_tile_size"
+                    android:tint="@color/tile_enabled_icon_color"
+                    android:layout_gravity="center"/>
+            </FrameLayout>
+            <Space
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"/>
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                android:layout_height="@dimen/preview_theme_color_icons_icon_size"
+                android:layout_gravity="center_horizontal">
+                <ImageView
+                    android:id="@+id/preview_color_qs_1_bg"
+                    android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_icon_size"/>
+                <ImageView
+                    android:id="@+id/preview_color_qs_1_icon"
+                    android:layout_width="@dimen/preview_theme_color_icons_tile_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_tile_size"
+                    android:tint="@color/tile_enabled_icon_color"
+                    android:layout_gravity="center"/>
+            </FrameLayout>
+            <Space
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"/>
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                android:layout_height="@dimen/preview_theme_color_icons_icon_size">
+                <ImageView
+                    android:id="@+id/preview_color_qs_2_bg"
+                    android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_icon_size"/>
+                <ImageView
+                    android:id="@+id/preview_color_qs_2_icon"
+                    android:layout_width="@dimen/preview_theme_color_icons_tile_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_tile_size"
+                    android:tint="@color/tile_enabled_icon_color"
+                    android:layout_gravity="center"/>
+            </FrameLayout>
+            <Space
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1"/>
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                android:layout_height="@dimen/preview_theme_color_icons_icon_size">
+                <ImageView
+                    android:id="@+id/preview_color_qs_3_bg"
+                    android:layout_width="@dimen/preview_theme_color_icons_icon_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_icon_size"/>
+                <ImageView
+                    android:id="@+id/preview_color_qs_3_icon"
+                    android:layout_width="@dimen/preview_theme_color_icons_tile_size"
+                    android:layout_height="@dimen/preview_theme_color_icons_tile_size"
+                    android:tint="@color/tile_enabled_icon_color"
+                    android:layout_gravity="center"/>
+            </FrameLayout>
+        </LinearLayout>
+
+        <!-- Icons of CheckBox/RadioButton/Switch. -->
+        <LinearLayout
+            android:layout_width="match_parent"
+            android:layout_height="wrap_content"
+            android:layout_marginTop="@dimen/preview_theme_color_icons_buttons_margin_top"
+            android:layout_marginBottom="@dimen/preview_theme_color_icons_buttons_margin_bottom"
+            android:orientation="horizontal">
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_icon_size"
+                android:layout_height="@dimen/preview_theme_icon_size">
+                <CheckBox
+                    android:id="@+id/preview_check_selected"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:checked="true"
+                    android:enabled="false"/>
+            </FrameLayout>
+            <Space
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1" />
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_icon_size"
+                android:layout_height="@dimen/preview_theme_icon_size">
+                <RadioButton
+                    android:id="@+id/preview_radio_selected"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:checked="true"
+                    android:enabled="false"/>
+            </FrameLayout>
+            <Space
+                android:layout_width="0dp"
+                android:layout_height="wrap_content"
+                android:layout_weight="1" />
+            <FrameLayout
+                android:layout_width="@dimen/preview_theme_icon_size"
+                android:layout_height="@dimen/preview_theme_icon_size">
+                <Switch
+                    android:id="@+id/preview_toggle_selected"
+                    android:layout_width="wrap_content"
+                    android:layout_height="wrap_content"
+                    android:layout_gravity="center"
+                    android:checked="true"
+                    android:enabled="false"/>
+            </FrameLayout>
+        </LinearLayout>
+
+    </LinearLayout>
+</androidx.cardview.widget.CardView>
diff --git a/res/layout/theme_preview_content_v2.xml b/res/layout/theme_preview_content_v2.xml
index 6370168..ea5db19 100644
--- a/res/layout/theme_preview_content_v2.xml
+++ b/res/layout/theme_preview_content_v2.xml
@@ -18,50 +18,29 @@
     xmlns:android="http://schemas.android.com/apk/res/android"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:paddingTop="@dimen/preview_theme_content_padding_top"
+    android:paddingHorizontal="@dimen/preview_theme_content_padding"
+    android:paddingBottom="@dimen/preview_theme_content_padding"
     android:orientation="vertical">
 
     <include layout="@layout/theme_preview_topbar" />
 
-    <!-- App icons for shapes. -->
-    <GridLayout
+    <TextView
+        android:id="@+id/smart_space_date"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
-        android:layout_gravity="center"
-        android:orientation="horizontal"
-        android:columnCount="2"
-        android:rowCount="2"
-        android:useDefaultMargins="true"
-        android:layout_marginTop="12dp">
+        android:textSize="@dimen/preview_theme_smart_space_date_size"
+        android:lineHeight="24dp"
+        android:gravity="center"
+        android:layout_marginTop="@dimen/preview_theme_smart_space_margin_top"/>
 
-        <ImageView
-            android:id="@+id/shape_preview_icon_0"
-            android:layout_width="@dimen/preview_theme_shape_size"
-            android:layout_height="@dimen/preview_theme_shape_size"
-            android:layout_gravity="start"
-            android:elevation="4dp"/>
-        <ImageView
-            android:id="@+id/shape_preview_icon_1"
-            android:layout_width="@dimen/preview_theme_shape_size"
-            android:layout_height="@dimen/preview_theme_shape_size"
-            android:layout_gravity="end"
-            android:elevation="4dp"/>
+    <include layout="@layout/theme_preview_app_icon_shape" />
 
-        <ImageView
-            android:id="@+id/shape_preview_icon_2"
-            android:layout_width="@dimen/preview_theme_shape_size"
-            android:layout_height="@dimen/preview_theme_shape_size"
-            android:layout_gravity="start"
-            android:elevation="4dp"/>
+    <include layout="@layout/theme_preview_color_icons"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:layout_marginTop="@dimen/preview_theme_color_icons_margin_top"/>
 
-        <ImageView
-            android:id="@+id/shape_preview_icon_3"
-            android:layout_width="@dimen/preview_theme_shape_size"
-            android:layout_height="@dimen/preview_theme_shape_size"
-            android:layout_gravity="end"
-            android:elevation="4dp"/>
-    </GridLayout>
-
-    <!-- Placeholder, will add more content later. -->
     <Space
         android:layout_width="match_parent"
         android:layout_height="0dp"
diff --git a/res/values/dimens.xml b/res/values/dimens.xml
index 5e23919..a565701 100644
--- a/res/values/dimens.xml
+++ b/res/values/dimens.xml
@@ -72,6 +72,25 @@
     <dimen name="preview_theme_content_bottom">@dimen/min_taptarget_height</dimen>
     <dimen name="preview_theme_cover_content_bottom">@dimen/preview_theme_content_bottom</dimen>
 
+    <!--  For the new preview of theme picker.  -->
+    <dimen name="preview_theme_content_padding_top">12dp</dimen>
+    <dimen name="preview_theme_content_padding">@dimen/preview_card_padding</dimen>
+    <dimen name="preview_theme_smart_space_margin_top">48dp</dimen>
+    <dimen name="preview_theme_smart_space_date_size">16sp</dimen>
+    <dimen name="preview_theme_app_icon_shape_padding_horizontal">36dp</dimen>
+    <dimen name="preview_theme_app_icon_shape_padding_top">28dp</dimen>
+    <dimen name="preview_theme_app_icon_shape_text_margin_top">8dp</dimen>
+    <dimen name="preview_theme_app_icon_shape_text_size">16sp</dimen>
+    <dimen name="preview_theme_color_icons_margin_top">40dp</dimen>
+    <dimen name="preview_theme_color_icons_padding_horizontal">18dp</dimen>
+    <dimen name="preview_theme_color_icons_title_text_size">12sp</dimen>
+    <dimen name="preview_theme_color_icons_title_margin_top">12dp</dimen>
+    <dimen name="preview_theme_color_icons_title_margin_bottom">20dp</dimen>
+    <dimen name="preview_theme_color_icons_icon_size">@dimen/preview_theme_icon_size</dimen>
+    <dimen name="preview_theme_color_icons_tile_size">@dimen/preview_theme_tile_size</dimen>
+    <dimen name="preview_theme_color_icons_buttons_margin_top">32dp</dimen>
+    <dimen name="preview_theme_color_icons_buttons_margin_bottom">28dp</dimen>
+
     <!--  For the customization previews on the picker. -->
     <dimen name="preview_content_height">@dimen/preview_pager_height</dimen>
     <dimen name="preview_content_padding_top">@dimen/preview_page_top_margin</dimen>
diff --git a/res/values/strings.xml b/res/values/strings.xml
index 3454653..238be06 100755
--- a/res/values/strings.xml
+++ b/res/values/strings.xml
@@ -192,4 +192,7 @@
 
     <!-- Generic error message [CHAR_LIMIT=NONE] -->
     <string name="something_went_wrong">Oops! Something went wrong.</string>
+
+    <!-- Title for a section of a style preview screen that shows a preview of the style color and icons. [CHAR_LIMIT=30]-->
+    <string name="theme_preview_icons_section_title">Color / Icons</string>
 </resources>
diff --git a/src/com/android/customization/picker/theme/ThemeOptionPreviewer.java b/src/com/android/customization/picker/theme/ThemeOptionPreviewer.java
index d1c6dcd..7412f33 100644
--- a/src/com/android/customization/picker/theme/ThemeOptionPreviewer.java
+++ b/src/com/android/customization/picker/theme/ThemeOptionPreviewer.java
@@ -16,16 +16,20 @@
 package com.android.customization.picker.theme;
 
 import android.content.Context;
+import android.content.res.ColorStateList;
 import android.graphics.Typeface;
 import android.graphics.drawable.Drawable;
 import android.graphics.drawable.GradientDrawable;
 import android.view.LayoutInflater;
 import android.view.View;
 import android.view.ViewGroup;
+import android.widget.CompoundButton;
 import android.widget.ImageView;
+import android.widget.Switch;
 import android.widget.TextView;
 
 import androidx.annotation.MainThread;
+import androidx.cardview.widget.CardView;
 import androidx.lifecycle.Lifecycle;
 import androidx.lifecycle.LifecycleObserver;
 import androidx.lifecycle.OnLifecycleEvent;
@@ -43,17 +47,42 @@
 
 /** A class to load the {@link ThemeBundle} preview to the view. */
 class ThemeOptionPreviewer implements LifecycleObserver {
+    // Maps which icon from ResourceConstants#ICONS_FOR_PREVIEW.
+    private static final int ICON_WIFI = 0;
+    private static final int ICON_BLUETOOTH = 1;
+    private static final int ICON_FLASHLIGHT = 3;
+    private static final int ICON_AUTO_ROTATE = 4;
+    private static final int ICON_CELLULAR_SIGNAL = 6;
+    private static final int ICON_BATTERY = 7;
 
-    /**
-     * Maps which icon from ResourceConstants#ICONS_FOR_PREVIEW to use for each icon in the
-     * top bar (fake "status bar") of the cover page.
-     */
-    private static final int [] sTopBarIconToPreviewIcon = new int [] { 0, 6, 7 };
+    // Icons in the top bar (fake "status bar") with the particular order.
+    private static final int [] sTopBarIconToPreviewIcon = new int [] {
+            ICON_WIFI, ICON_CELLULAR_SIGNAL, ICON_BATTERY };
 
-    private int[] mShapeIconIds = {
+    // Ids of app icon shape preview.
+    private int[] mShapeAppIconIds = {
             R.id.shape_preview_icon_0, R.id.shape_preview_icon_1,
             R.id.shape_preview_icon_2, R.id.shape_preview_icon_3
     };
+    private int[] mShapeIconAppNameIds = {
+            R.id.shape_preview_icon_app_name_0, R.id.shape_preview_icon_app_name_1,
+            R.id.shape_preview_icon_app_name_2, R.id.shape_preview_icon_app_name_3
+    };
+
+    // Ids of color/icons section.
+    private int[][] mColorTileIconIds = {
+            new int[] { R.id.preview_color_qs_0_icon, ICON_WIFI},
+            new int[] { R.id.preview_color_qs_1_icon, ICON_BLUETOOTH},
+            new int[] { R.id.preview_color_qs_2_icon, ICON_FLASHLIGHT},
+            new int[] { R.id.preview_color_qs_3_icon, ICON_AUTO_ROTATE},
+    };
+    private int[] mColorTileIds = {
+            R.id.preview_color_qs_0_bg, R.id.preview_color_qs_1_bg,
+            R.id.preview_color_qs_2_bg, R.id.preview_color_qs_3_bg
+    };
+    private int[] mColorButtonIds = {
+            R.id.preview_check_selected, R.id.preview_radio_selected, R.id.preview_toggle_selected
+    };
 
     private final Context mContext;
 
@@ -76,7 +105,10 @@
         PreviewInfo previewInfo = themeBundle.getPreviewInfo();
         setHeadlineFont(previewInfo.headlineFontFamily);
         setTopBarIcons(previewInfo.icons);
-        setShapeIcons(previewInfo.shapeAppIcons);
+        setAppIconShape(previewInfo.shapeAppIcons);
+        setColorAndIconsSection(previewInfo.icons, previewInfo.shapeDrawable,
+                previewInfo.resolveAccentColor(mContext.getResources()));
+        setColorAndIconsBoxRadius(previewInfo.bottomSheeetCornerRadius);
         setQsbRadius(previewInfo.bottomSheeetCornerRadius);
     }
 
@@ -98,7 +130,20 @@
     private void setHeadlineFont(Typeface headlineFont) {
         mClock.setTypeface(headlineFont);
 
-        // Update other text style here.
+        TextView date = mContentView.findViewById(R.id.smart_space_date);
+        date.setTypeface(headlineFont);
+        // TODO(chihhangchuang): Use real date.
+        date.setText("Friday, Nov 12");
+
+        // TODO(chihhangchuang): Query the app name for icon shapes, we can get package name from
+        // res/values/override.xml to query the app name.
+        for (int id : mShapeIconAppNameIds) {
+            TextView appName = mContentView.findViewById(id);
+            appName.setTypeface(headlineFont);
+        }
+
+        TextView colorIconsSectionTitle = mContentView.findViewById(R.id.color_icons_section_title);
+        colorIconsSectionTitle.setTypeface(headlineFont);
     }
 
     private void setTopBarIcons(List<Drawable> icons) {
@@ -115,13 +160,44 @@
         }
     }
 
-    private void setShapeIcons(List<Drawable> icons) {
-        for (int i = 0; i < mShapeIconIds.length && i < icons.size(); i++) {
-            ImageView iconView = mContentView.findViewById(mShapeIconIds[i]);
-            iconView.setBackground(icons.get(i));
+    private void setAppIconShape(List<Drawable> appIcons) {
+        for (int i = 0; i < mShapeAppIconIds.length && i < appIcons.size(); i++) {
+            ImageView iconView = mContentView.findViewById(mShapeAppIconIds[i]);
+            iconView.setBackground(appIcons.get(i));
         }
     }
 
+    private void setColorAndIconsSection(List<Drawable> icons, Drawable shapeDrawable,
+                                         int accentColor) {
+        // Set QS icons and background.
+        for (int i = 0; i < mColorTileIconIds.length && i < icons.size(); i++) {
+            Drawable icon = icons.get(mColorTileIconIds[i][1]).getConstantState()
+                    .newDrawable().mutate();
+            Drawable bgShape = shapeDrawable.getConstantState().newDrawable();
+            bgShape.setTint(accentColor);
+
+            ImageView bg = mContentView.findViewById(mColorTileIds[i]);
+            bg.setImageDrawable(bgShape);
+            ImageView fg = mContentView.findViewById(mColorTileIconIds[i][0]);
+            fg.setImageDrawable(icon);
+        }
+
+        // Set color for Buttons (CheckBox, RadioButton, and Switch).
+        ColorStateList tintList = getColorStateList(accentColor);
+        for (int mColorButtonId : mColorButtonIds) {
+            CompoundButton button = mContentView.findViewById(mColorButtonId);
+            button.setButtonTintList(tintList);
+            if (button instanceof Switch) {
+                ((Switch) button).setThumbTintList(tintList);
+                ((Switch) button).setTrackTintList(tintList);
+            }
+        }
+    }
+
+    private void setColorAndIconsBoxRadius(int cornerRadius) {
+        ((CardView) mContentView.findViewById(R.id.color_icons_section)).setRadius(cornerRadius);
+    }
+
     private void setQsbRadius(int cornerRadius) {
         View qsb = mContentView.findViewById(R.id.theme_qsb);
         if (qsb != null && qsb.getVisibility() == View.VISIBLE) {
@@ -157,4 +233,20 @@
         return cornerRadius >= mContext.getResources().getDimensionPixelSize(
                 R.dimen.roundCornerThreshold);
     }
+
+    private ColorStateList getColorStateList(int accentColor) {
+        int controlGreyColor = mContext.getColor(R.color.control_grey);
+        return new ColorStateList(
+                new int[][]{
+                        new int[]{android.R.attr.state_selected},
+                        new int[]{android.R.attr.state_checked},
+                        new int[]{-android.R.attr.state_enabled},
+                },
+                new int[] {
+                        accentColor,
+                        accentColor,
+                        controlGreyColor
+                }
+        );
+    }
 }