[Modern] Update modern composited toolbar and fix animations

This change adds a new nine-patch asset for the location bar that
is used exclusively in the compositor. This allows us to have stop
drawing the location bar as part of the toolbar texture and draw it
with correct colors in the compositor. Since the new texture draws
the entire location bar instead of just part of it, the 'anonymize'
layer is not needed in the modern design (we can now simply draw
over the url). These changes correct all the toolbar/compositor
related animations.

BUG=803098

Change-Id: I90d67967c4d1a0e37b0d504d154b0f6df7bdd656
Reviewed-on: https://chromium-review.googlesource.com/912177
Commit-Queue: Matthew Jones <mdjones@chromium.org>
Reviewed-by: David Trainor <dtrainor@chromium.org>
Reviewed-by: Theresa <twellington@chromium.org>
Cr-Commit-Position: refs/heads/master@{#537425}

chrome/android/java/src/org/chromium/chrome/browser/compositor/scene_layer/TabListSceneLayer.java

@@ -69,17 +69,19 @@ public class TabListSceneLayer extends SceneLayer {
             boolean useModernDesign = FeatureUtilities.isChromeModernDesignEnabled();
 
             float shadowAlpha = decoration;
-            if (useModernDesign) shadowAlpha /= 2;
+            int urlBarBackgroundId = R.drawable.card_single;
+            if (useModernDesign) {
+                urlBarBackgroundId = R.drawable.modern_location_bar;
+                shadowAlpha /= 2;
+            }
 
             int defaultThemeColor =
                     ColorUtils.getDefaultThemeColor(res, useModernDesign, t.isIncognito());
 
             int toolbarBackgroundColor = getTabThemeColor(context, t);
-            int textBoxBackgroundColor = t.getTextBoxBackgroundColor();
 
-            // In the modern design, the text box is always drawn in the Java layer rather
-            // than the compositor layer.
-            float textBoxAlpha = useModernDesign ? 0.f : t.getTextBoxAlpha();
+            // In the modern design, the text box is always drawn opaque in the compositor.
+            float textBoxAlpha = useModernDesign ? 1.f : t.getTextBoxAlpha();
 
             int closeButtonColor =
                     ColorUtils.getThemedAssetColor(toolbarBackgroundColor, t.isIncognito());
@@ -108,8 +110,8 @@ public class TabListSceneLayer extends SceneLayer {
                     LayoutTab.CLOSE_BUTTON_WIDTH_DP * dpToPx, t.getStaticToViewBlend(),
                     t.getBorderScale(), t.getSaturation(), t.getBrightness(), t.showToolbar(),
                     defaultThemeColor, toolbarBackgroundColor, closeButtonColor,
-                    t.anonymizeToolbar(), t.isTitleNeeded(), R.drawable.card_single,
-                    textBoxBackgroundColor, textBoxAlpha, t.getToolbarAlpha(),
+                    t.anonymizeToolbar(), t.isTitleNeeded(), urlBarBackgroundId,
+                    t.getTextBoxBackgroundColor(), textBoxAlpha, t.getToolbarAlpha(),
                     t.getToolbarYOffset() * dpToPx, t.getSideBorderScale(),
                     t.insetBorderVertical());
         }

chrome/android/java/src/org/chromium/chrome/browser/compositor/scene_layer/ToolbarSceneLayer.java

@@ -5,6 +5,7 @@
 package org.chromium.chrome.browser.compositor.scene_layer;
 
 import android.content.Context;
+import android.graphics.Color;
 import android.graphics.RectF;
 
 import org.chromium.base.annotations.JNINamespace;
@@ -18,6 +19,9 @@ import org.chromium.chrome.browser.compositor.layouts.eventfilter.EventFilter;
 import org.chromium.chrome.browser.compositor.overlays.SceneOverlay;
 import org.chromium.chrome.browser.device.DeviceClassManager;
 import org.chromium.chrome.browser.fullscreen.ChromeFullscreenManager;
+import org.chromium.chrome.browser.ntp.NewTabPage;
+import org.chromium.chrome.browser.tab.Tab;
+import org.chromium.chrome.browser.util.ColorUtils;
 import org.chromium.chrome.browser.util.FeatureUtilities;
 import org.chromium.chrome.browser.widget.ClipDrawableProgressBar.DrawingInfo;
 import org.chromium.chrome.browser.widget.ControlContainer;
@@ -97,10 +101,27 @@ public class ToolbarSceneLayer extends SceneOverlayLayer implements SceneOverlay
                 ? fullscreenManager.getBottomControlOffset()
                 : fullscreenManager.getTopControlOffset();
 
+        int textBoxColor = Color.WHITE;
+        int textBoxResourceId = R.drawable.card_single;
+
+        boolean isNtp = false;
+        boolean useModern = false;
+        Tab currentTab = fullscreenManager.getTab();
+        if (currentTab != null) {
+            isNtp = currentTab != null ? NewTabPage.isNTPUrl(currentTab.getUrl()) : false;
+            useModern = currentTab.getActivity().supportsModernDesign()
+                    && FeatureUtilities.isChromeModernDesignEnabled();
+        }
+
+        if (useModern) {
+            textBoxColor = ColorUtils.getTextBoxColorForToolbarBackground(
+                    mContext.getResources(), isNtp, browserControlsBackgroundColor, true);
+            textBoxResourceId = R.drawable.modern_location_bar;
+        }
+
         nativeUpdateToolbarLayer(mNativePtr, resourceManager, R.id.control_container,
-                browserControlsBackgroundColor, R.drawable.card_single,
-                browserControlsUrlBarAlpha, controlsOffset, windowHeight, useTexture, showShadow,
-                FeatureUtilities.isChromeModernDesignEnabled());
+                browserControlsBackgroundColor, textBoxResourceId, browserControlsUrlBarAlpha,
+                textBoxColor, controlsOffset, windowHeight, useTexture, showShadow, useModern);
 
         if (mProgressBarDrawingInfo == null) return;
         nativeUpdateProgressBar(mNativePtr, mProgressBarDrawingInfo.progressBarRect.left,
@@ -155,9 +176,9 @@ public class ToolbarSceneLayer extends SceneOverlayLayer implements SceneOverlay
             if (!fullscreenManager.getTab().isIncognito()) alpha = 1f;
         }
 
-        // In Chrome modern design, the url bar is always drawn in the Java layer rather than the
-        // compositor layer.
-        if (FeatureUtilities.isChromeModernDesignEnabled()) alpha = 0;
+        // In Chrome modern design, the url bar is always opaque since it is drawn in the
+        // compositor.
+        if (FeatureUtilities.isChromeModernDesignEnabled()) alpha = 1;
 
         update(color, alpha, mLayoutProvider.getFullscreenManager(), resourceManager,
                 forceHideBrowserControlsAndroidView, viewportMode, DeviceFormFactor.isTablet(),
@@ -257,6 +278,7 @@ public class ToolbarSceneLayer extends SceneOverlayLayer implements SceneOverlay
             int toolbarBackgroundColor,
             int urlBarResourceId,
             float urlBarAlpha,
+            int urlBarColor,
             float topOffset,
             float viewHeight,
             boolean visible,

chrome/android/java/src/org/chromium/chrome/browser/toolbar/ToolbarPhone.java

@@ -239,6 +239,7 @@ public class ToolbarPhone extends ToolbarLayout
     protected final Point mNtpSearchBoxTranslation = new Point();
 
     protected final int mToolbarSidePadding;
+    private final int mModernLocationBarLateralInset;
     protected int mLocationBarBackgroundCornerRadius;
     protected int mLocationBarVerticalMargin;
 
@@ -264,20 +265,6 @@ public class ToolbarPhone extends ToolbarLayout
     /** The height of the location bar background when the modern UI is enabled. */
     private float mModernLocationBarBackgroundHeight;
 
-    /**
-     * The float used to inset the rect returned by {@link #getLocationBarContentRect(Rect)} when
-     * the modern UI is enabled. This extra vertical inset is needed to ensure the anonymize layer
-     * doesn't draw outside of the background bounds.
-     */
-    private float mModernLocationBarContentVerticalInset;
-
-    /**
-     * The float used to inset the rect returned by {@link #getLocationBarContentRect(Rect)} when
-     * the modern UI is enabled. This extra lateral inset is needed to ensure the anonymize layer
-     * doesn't draw outside of the background bounds.
-     */
-    private float mModernLocationBarContentLateralInset;
-
     /**
      * The extra margin to apply to the start side of the location bar when it is focused and the
      * modern UI is enabled.
@@ -352,6 +339,8 @@ public class ToolbarPhone extends ToolbarLayout
                 ApiCompatibilityUtils.getColor(getResources(), R.color.light_mode_tint);
         mDarkModeDefaultColor =
                 ApiCompatibilityUtils.getColor(getResources(), R.color.dark_mode_tint);
+        mModernLocationBarLateralInset = getResources().getDimensionPixelOffset(
+                R.dimen.modern_toolbar_background_lateral_inset);
     }
 
     @Override
@@ -398,10 +387,6 @@ public class ToolbarPhone extends ToolbarLayout
                     mLocationBarBackgroundPadding.top, mLocationBarBackgroundPadding.right,
                     mLocationBarBackgroundPadding.bottom);
 
-            mModernLocationBarContentLateralInset = getResources().getDimensionPixelSize(
-                    R.dimen.bottom_location_bar_content_lateral_inset);
-            mModernLocationBarContentVerticalInset = getResources().getDimensionPixelSize(
-                    R.dimen.bottom_location_bar_content_vertical_inset);
             mModernLocationBarExtraFocusedStartMargin = getResources().getDimensionPixelSize(
                     R.dimen.bottom_toolbar_background_focused_left_margin);
             mLocationBarBackgroundCornerRadius = 0;
@@ -1550,7 +1535,7 @@ public class ToolbarPhone extends ToolbarLayout
      */
     protected boolean shouldDrawLocationBarBackground() {
         return (mLocationBar.getAlpha() > 0 || mForceDrawLocationBarBackground)
-                && (mLocationBar.useModernDesign() || !mTextureCaptureMode);
+                && !mTextureCaptureMode;
     }
 
     @Override
@@ -1662,12 +1647,16 @@ public class ToolbarPhone extends ToolbarLayout
     @Override
     public void getLocationBarContentRect(Rect outRect) {
         updateLocationBarBackgroundBounds(outRect, VisualState.NORMAL);
-
         if (mLocationBar.useModernDesign()) {
-            outRect.left += mModernLocationBarContentLateralInset;
-            outRect.top += mModernLocationBarContentVerticalInset;
-            outRect.right -= mModernLocationBarContentLateralInset;
-            outRect.bottom -= mModernLocationBarContentVerticalInset;
+            // Remove the insets for the composited version.
+            // TODO(mdjones): The image asset used to render the location bar in java is different
+            // from the one used in the compositor. The java asset has padding applied to both sides
+            // while the compositor one does not. The value manipulation here is to account for that
+            // difference. Instead we should just remove the padding from the toolbar asset, but
+            // there is much more overhead in updating the animations. Fix this once modern is the
+            // new default.
+            outRect.left -= mModernLocationBarLateralInset;
+            outRect.right += mModernLocationBarLateralInset;
         }
     }
 

chrome/android/java/src/org/chromium/chrome/browser/util/ColorUtils.java

@@ -77,7 +77,11 @@ public class ColorUtils {
         boolean usingDefaultThemeColor =
                 ColorUtils.isUsingDefaultToolbarColor(res, useModernDesign, false, color);
         if (usingDefaultThemeColor && useModernDesign) {
-            return ApiCompatibilityUtils.getColor(res, R.color.modern_light_grey);
+            // In modern, the default theme color is white, so the text box uses a darker color
+            // which is different from all other cases. In the case of the NTP, the location bar is
+            // not visible by default, so we make it white to appear as part of the background.
+            return isNtp ? Color.WHITE
+                         : ApiCompatibilityUtils.getColor(res, R.color.modern_light_grey);
         }
 
         if (shouldUseOpaqueTextboxBackground(color)) {

chrome/browser/android/compositor/layer/toolbar_layer.cc

@@ -64,9 +64,17 @@ void ToolbarLayer::PushResource(
       (resource->location_bar_content_rect().width() != 0) && url_bar_alpha > 0;
   url_bar_background_layer_->SetHideLayerAndSubtree(!url_bar_visible);
   if (url_bar_visible) {
-    ui::NinePatchResource* url_bar_background_resource =
-        ui::NinePatchResource::From(resource_manager_->GetResource(
-            ui::ANDROID_RESOURCE_TYPE_STATIC, url_bar_background_resource_id));
+    ui::NinePatchResource* url_bar_background_resource;
+    if (!modern_design_enabled) {
+      url_bar_background_resource = ui::NinePatchResource::From(
+          resource_manager_->GetResource(ui::ANDROID_RESOURCE_TYPE_STATIC,
+                                         url_bar_background_resource_id));
+    } else {
+      url_bar_background_resource = ui::NinePatchResource::From(
+          resource_manager_->GetStaticResourceWithTint(
+              url_bar_background_resource_id,
+              toolbar_textbox_background_color));
+    }
 
     gfx::Size draw_size(url_bar_background_resource->DrawSize(
         resource->location_bar_content_rect().size()));
@@ -89,14 +97,36 @@ void ToolbarLayer::PushResource(
 
   layer_->SetMasksToBounds(clip_shadow);
 
-  anonymize_layer_->SetHideLayerAndSubtree(!anonymize);
-  if (anonymize) {
+  // TODO(mdjones): Remove the anonymize layer once modern launches.
+  anonymize_layer_->SetHideLayerAndSubtree(!anonymize || modern_design_enabled);
+  if (!modern_design_enabled && anonymize) {
     anonymize_layer_->SetPosition(
         gfx::PointF(resource->location_bar_content_rect().origin()));
     anonymize_layer_->SetBounds(resource->location_bar_content_rect().size());
     anonymize_layer_->SetBackgroundColor(toolbar_textbox_background_color);
   }
 
+  // If modern is enabled, the location bar background doubles as the
+  // anonymize layer -- it just needs to be drawn on top of the toolbar
+  // bitmap.
+  if (modern_design_enabled) {
+    int background_layer_index = GetIndexOfLayer(toolbar_background_layer_);
+
+    bool needs_move_to_front =
+        anonymize && layer_->children().back() != url_bar_background_layer_;
+    bool needs_move_to_back =
+        !anonymize &&
+        layer_->child_at(background_layer_index) != url_bar_background_layer_;
+
+    // If the layer needs to move, remove and re-add it.
+    if (needs_move_to_front) {
+      layer_->AddChild(url_bar_background_layer_);
+    } else if (needs_move_to_back) {
+      layer_->InsertChild(url_bar_background_layer_,
+                          background_layer_index + 1);
+    }
+  }
+
   debug_layer_->SetBounds(resource->size());
   if (show_debug && !debug_layer_->parent())
     layer_->AddChild(debug_layer_);
@@ -106,6 +136,14 @@ void ToolbarLayer::PushResource(
   layer_->SetPosition(gfx::PointF(0, y_offset));
 }
 
+int ToolbarLayer::GetIndexOfLayer(scoped_refptr<cc::Layer> layer) {
+  for (unsigned int i = 0; i < layer_->children().size(); ++i) {
+    if (layer_->child_at(i) == layer)
+      return i;
+  }
+  return -1;
+}
+
 void ToolbarLayer::UpdateProgressBar(int progress_bar_x,
                                      int progress_bar_y,
                                      int progress_bar_width,

chrome/browser/android/compositor/layer/toolbar_layer.h

@@ -57,6 +57,8 @@ class ToolbarLayer : public Layer {
   ~ToolbarLayer() override;
 
  private:
+  int GetIndexOfLayer(scoped_refptr<cc::Layer> layer);
+
   ui::ResourceManager* resource_manager_;
 
   scoped_refptr<cc::Layer> layer_;

chrome/browser/android/compositor/scene_layer/tab_list_scene_layer.cc

@@ -158,6 +158,9 @@ void TabListSceneLayer::PutTabLayer(
   // used for this frame.
   used_tints_.insert(toolbar_background_color);
   used_tints_.insert(close_button_color);
+  if (modern_design_enabled) {
+    used_tints_.insert(toolbar_textbox_background_color);
+  }
 
   DCHECK(layer);
   if (layer) {

chrome/browser/android/compositor/scene_layer/toolbar_scene_layer.cc

@@ -38,6 +38,7 @@ void ToolbarSceneLayer::UpdateToolbarLayer(
     jint toolbar_background_color,
     jint url_bar_resource_id,
     jfloat url_bar_alpha,
+    jint url_bar_color,
     jfloat y_offset,
     jfloat view_height,
     bool visible,
@@ -55,7 +56,7 @@ void ToolbarSceneLayer::UpdateToolbarLayer(
   toolbar_layer_->layer()->SetHideLayerAndSubtree(!visible);
   if (visible) {
     toolbar_layer_->PushResource(toolbar_resource_id, toolbar_background_color,
-                                 false, SK_ColorWHITE, url_bar_resource_id,
+                                 false, url_bar_color, url_bar_resource_id,
                                  url_bar_alpha, view_height, y_offset, false,
                                  !show_shadow, modern_design_enabled);
   }

chrome/browser/android/compositor/scene_layer/toolbar_scene_layer.h

@@ -37,6 +37,7 @@ class ToolbarSceneLayer : public SceneLayer {
       jint toolbar_background_color,
       jint url_bar_resource_id,
       jfloat url_bar_alpha,
+      jint url_bar_color,
       jfloat y_offset,
       jfloat view_height,
       bool visible,