[iOS] Improvements of the focusing animation.

Fades the leading icon and the clear button to avoid overlapping with
the toolbar elements.

Bug: 867406
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: Ib60719fe1adee84032bbd59588609fd63cfa06ed
Reviewed-on: https://chromium-review.googlesource.com/1152919
Commit-Queue: Stepan Khapugin <stkhapugin@chromium.org>
Reviewed-by: Rohit Rao <rohitrao@chromium.org>
Reviewed-by: Gauthier Ambard <gambard@chromium.org>
Cr-Commit-Position: refs/heads/master@{#579767}

ios/chrome/browser/ui/location_bar/location_bar_coordinator.mm

@@ -176,6 +176,10 @@ const int kLocationAuthorizationStatusCount = 4;
   return self.viewController;
 }
 
+- (id<EditViewAnimatee>)editViewAnimatee {
+  return self.omniboxCoordinator.animatee;
+}
+
 #pragma mark - LoadQueryCommands
 
 - (void)loadQuery:(NSString*)query immediately:(BOOL)immediately {

ios/chrome/browser/ui/location_bar/location_bar_generic_coordinator.h

@@ -18,6 +18,7 @@ class WebStateList;
 @class CommandDispatcher;
 @protocol ApplicationCommands;
 @protocol BrowserCommands;
+@protocol EditViewAnimatee;
 @protocol LocationBarAnimatee;
 @protocol OmniboxPopupPositioner;
 @protocol ToolbarCoordinatorDelegate;
@@ -63,9 +64,12 @@ class WebStateList;
 // @optional label and matching respondsToSelector: calls.
 @optional
 
-// Returns the animatee.
+// Returns the location bar animatee.
 - (id<LocationBarAnimatee>)locationBarAnimatee;
 
+// Returns the edit view animatee.
+- (id<EditViewAnimatee>)editViewAnimatee;
+
 @end
 
 #endif  // IOS_CHROME_BROWSER_UI_LOCATION_BAR_LOCATION_BAR_GENERIC_COORDINATOR_H_

ios/chrome/browser/ui/omnibox/omnibox_container_view.h

@@ -39,6 +39,9 @@
 // Shows or hides the leading button.
 - (void)setLeadingImageHidden:(BOOL)hidden;
 
+// Sets the alpha level of the leading image view.
+- (void)setLeadingImageAlpha:(CGFloat)alpha;
+
 @end
 
 #endif  // IOS_CHROME_BROWSER_UI_OMNIBOX_OMNIBOX_CONTAINER_VIEW_H_

ios/chrome/browser/ui/omnibox/omnibox_container_view.mm

@@ -132,6 +132,10 @@ const CGFloat kTextFieldClearButtonTrailingOffset = 4;
   self.textField.incognito = incognito;
 }
 
+- (void)setLeadingImageAlpha:(CGFloat)alpha {
+  self.leadingImageView.alpha = alpha;
+}
+
 #pragma mark - private
 
 - (void)createLeadingImageView {

ios/chrome/browser/ui/omnibox/omnibox_coordinator.h

@@ -12,6 +12,7 @@ class ChromeBrowserState;
 }
 class WebOmniboxEditController;
 @class CommandDispatcher;
+@protocol EditViewAnimatee;
 @class OmniboxPopupCoordinator;
 @class OmniboxTextFieldIOS;
 @protocol LocationBarOffsetProvider;
@@ -26,6 +27,8 @@ class WebOmniboxEditController;
 @property(nonatomic, assign) ios::ChromeBrowserState* browserState;
 // The dispatcher for this view controller.
 @property(nonatomic, weak) CommandDispatcher* dispatcher;
+// Returns the animatee for the omnibox focus orchestrator.
+@property(nonatomic, strong, readonly) id<EditViewAnimatee> animatee;
 
 // The view controller managed by this coordinator. The parent of this
 // coordinator is expected to add it to the responder chain.

ios/chrome/browser/ui/omnibox/omnibox_coordinator.mm

@@ -51,6 +51,8 @@
 @synthesize viewController = _viewController;
 @synthesize mediator = _mediator;
 
+#pragma mark - public
+
 - (void)start {
   BOOL isIncognito = self.browserState->IsOffTheRecord();
 
@@ -155,6 +157,10 @@
   return self.viewController;
 }
 
+- (id<EditViewAnimatee>)animatee {
+  return self.viewController;
+}
+
 #pragma mark - private
 
 // Convenience accessor.

ios/chrome/browser/ui/omnibox/omnibox_view_controller.h

@@ -9,14 +9,16 @@
 
 #import "ios/chrome/browser/ui/omnibox/omnibox_consumer.h"
 #import "ios/chrome/browser/ui/omnibox/omnibox_text_field_ios.h"
+#import "ios/chrome/browser/ui/orchestrator/edit_view_animatee.h"
 #import "ios/chrome/browser/ui/orchestrator/location_bar_offset_provider.h"
 
 @protocol LoadQueryCommands;
 @protocol OmniboxFocuser;
 
 // The view controller managing the omnibox textfield and its container view.
-@interface OmniboxViewController
-    : UIViewController<LocationBarOffsetProvider, OmniboxConsumer>
+@interface OmniboxViewController : UIViewController<EditViewAnimatee,
+                                                    LocationBarOffsetProvider,
+                                                    OmniboxConsumer>
 
 // The textfield used by this view controller.
 @property(nonatomic, readonly, strong) OmniboxTextFieldIOS* textField;

ios/chrome/browser/ui/omnibox/omnibox_view_controller.mm

@@ -118,6 +118,16 @@ const CGFloat kClearButtonSize = 28.0f;
   [self.view setLeadingImage:icon];
 }
 
+#pragma mark - EditViewAnimatee
+
+- (void)setLeadingIconFaded:(BOOL)faded {
+  [self.view setLeadingImageAlpha:faded ? 0 : 1];
+}
+
+- (void)setClearButtonFaded:(BOOL)faded {
+  self.textField.rightView.alpha = faded ? 0 : 1;
+}
+
 #pragma mark - LocationBarOffsetProvider
 
 - (CGFloat)xOffsetForString:(NSString*)string {

ios/chrome/browser/ui/orchestrator/BUILD.gn

@@ -5,6 +5,7 @@
 source_set("orchestrator") {
   configs += [ "//build/config/compiler:enable_arc" ]
   sources = [
+    "edit_view_animatee.h",
     "location_bar_animatee.h",
     "location_bar_offset_provider.h",
     "omnibox_focus_orchestrator.h",

ios/chrome/browser/ui/orchestrator/edit_view_animatee.h

+// Copyright 2018 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+#ifndef IOS_CHROME_BROWSER_UI_ORCHESTRATOR_EDIT_VIEW_ANIMATEE_H_
+#define IOS_CHROME_BROWSER_UI_ORCHESTRATOR_EDIT_VIEW_ANIMATEE_H_
+
+#import <UIKit/UIKit.h>
+
+// An object that represents the edit state location bar for focusing animation.
+@protocol EditViewAnimatee<NSObject>
+
+// Toggles the visibility of the leading icon.
+- (void)setLeadingIconFaded:(BOOL)faded;
+
+// Toggles the visibility of the clear button.
+- (void)setClearButtonFaded:(BOOL)faded;
+
+@end
+
+#endif  // IOS_CHROME_BROWSER_UI_ORCHESTRATOR_EDIT_VIEW_ANIMATEE_H_

ios/chrome/browser/ui/orchestrator/omnibox_focus_orchestrator.h

@@ -7,6 +7,7 @@
 
 #import <UIKit/UIKit.h>
 
+@protocol EditViewAnimatee;
 @protocol LocationBarAnimatee;
 @protocol ToolbarAnimatee;
 
@@ -19,6 +20,8 @@
 
 @property(nonatomic, weak) id<LocationBarAnimatee> locationBarAnimatee;
 
+@property(nonatomic, weak) id<EditViewAnimatee> editViewAnimatee;
+
 // Updates the UI elements orchestrated by this object to reflect the
 // |omniboxFocused| state, and the |toolbarExpanded| state, |animated| or not.
 - (void)transitionToStateOmniboxFocused:(BOOL)omniboxFocused

ios/chrome/browser/ui/orchestrator/omnibox_focus_orchestrator.mm

@@ -4,6 +4,7 @@
 
 #import "ios/chrome/browser/ui/orchestrator/omnibox_focus_orchestrator.h"
 
+#import "ios/chrome/browser/ui/orchestrator/edit_view_animatee.h"
 #import "ios/chrome/browser/ui/orchestrator/location_bar_animatee.h"
 #import "ios/chrome/browser/ui/orchestrator/toolbar_animatee.h"
 #import "ios/chrome/common/material_timing.h"
@@ -22,6 +23,7 @@
 
 @synthesize toolbarAnimatee = _toolbarAnimatee;
 @synthesize locationBarAnimatee = _locationBarAnimatee;
+@synthesize editViewAnimatee = _editViewAnimatee;
 @synthesize isAnimating = _isAnimating;
 
 - (void)transitionToStateOmniboxFocused:(BOOL)omniboxFocused
@@ -70,6 +72,8 @@
     [self.locationBarAnimatee resetTransforms];
     [self.locationBarAnimatee setSteadyViewFaded:NO];
     [self.locationBarAnimatee setEditViewFaded:NO];
+    [self.editViewAnimatee setLeadingIconFaded:NO];
+    [self.editViewAnimatee setClearButtonFaded:NO];
     self.isAnimating = NO;
   };
 
@@ -79,6 +83,8 @@
     // Make edit view transparent, but not hidden.
     [self.locationBarAnimatee setEditViewHidden:NO];
     [self.locationBarAnimatee setEditViewFaded:YES];
+    [self.editViewAnimatee setLeadingIconFaded:YES];
+    [self.editViewAnimatee setClearButtonFaded:YES];
 
     CGFloat duration = ios::material::kDuration1;
 
@@ -112,6 +118,14 @@
                        [self.locationBarAnimatee setEditViewFaded:NO];
                      }
                      completion:nil];
+    [UIView animateWithDuration:duration * 0.2
+                          delay:duration * 0.8
+                        options:UIViewAnimationCurveLinear
+                     animations:^{
+                       [self.editViewAnimatee setLeadingIconFaded:NO];
+                       [self.editViewAnimatee setClearButtonFaded:NO];
+                     }
+                     completion:nil];
   } else {
     cleanup(YES);
   }
@@ -127,7 +141,8 @@
     [self.locationBarAnimatee resetTransforms];
     self.isAnimating = NO;
     [self.locationBarAnimatee setSteadyViewFaded:NO];
-    [self.locationBarAnimatee setEditViewFaded:NO];
+    [self.editViewAnimatee setLeadingIconFaded:NO];
+    [self.editViewAnimatee setClearButtonFaded:NO];
   };
 
   if (animated) {
@@ -136,6 +151,8 @@
     // Make steady view transparent, but not hidden.
     [self.locationBarAnimatee setSteadyViewHidden:NO];
     [self.locationBarAnimatee setSteadyViewFaded:YES];
+    [self.editViewAnimatee setLeadingIconFaded:NO];
+    [self.editViewAnimatee setClearButtonFaded:NO];
 
     CGFloat duration = ios::material::kDuration1;
 
@@ -150,6 +167,12 @@
 
     // These timings are explained in a comment in
     // focusOmniboxAnimated:shouldExpand:.
+    [UIView animateWithDuration:0.2 * duration
+                     animations:^{
+                       [self.editViewAnimatee setLeadingIconFaded:YES];
+                       [self.editViewAnimatee setClearButtonFaded:YES];
+                     }];
+
     [UIView animateWithDuration:duration * 0.8
                           delay:duration * 0.1
                         options:UIViewAnimationCurveEaseInOut

ios/chrome/browser/ui/toolbar/adaptive/primary_toolbar_coordinator.mm

@@ -84,6 +84,13 @@
     self.orchestrator.locationBarAnimatee =
         [self.locationBarCoordinator locationBarAnimatee];
   }
+
+  if ([self.locationBarCoordinator
+          respondsToSelector:@selector(editViewAnimatee)]) {
+    self.orchestrator.editViewAnimatee =
+        [self.locationBarCoordinator editViewAnimatee];
+  }
+
   [super start];
 
   _fullscreenObserver =