New issue
Advanced search Search tips

Issue 851872 link

Starred by 3 users

Issue metadata

Status: Verified
Owner:
Closed: Jul 20
Cc:
Components:
EstimatedDays: ----
NextAction: ----
OS: iOS
Pri: 1
Type: Bug
Q2



Sign in to add a comment

Improve iPhone New Tab Animation - Not From Tab Switcher

Project Member Reported by martijnb@chromium.org, Jun 12 2018

Issue description

We would like to do tweaks to the animation that appears when creating a new tab, but not coming from the tab switcher, but from a menu (popup, tools, etc.)

Current implementation see attachment. 

In order to become more consistent, we can think of this animation as a variant of the "Improve Done Animation + New Tab w selected tab outside of the view  -  Tab Switcher " animation. (https://bugs.chromium.org/p/chromium/issues/detail?id=851871)

The main difference being the origin from which the New Tab scales. In this animation, the origin is related to the position of the button from which this animation is triggered. 

More concrete, these tweaks will help us to get there. 
- Remove the bounce/ spring motion
- Ensure that the new tab animates with rounded corners (13pt)
- Fade the old tab to black when the new is animating in. 
- Start the animation from a lower Scale (e.g. 0.7) 

Additionally fix this bug:
- Ensure that the old tab doesn't Y offset when the new tab is animating in.

Refer to the "Master" animation that acts as a guide (e.g. for timing and tweening):
https://bugs.chromium.org/p/chromium/issues/detail?id=850507 
 
ScreenRecording_06-12-2018 10-02-19.MP4
3.3 MB View Download

Comment 1 Deleted

Issue 831760 has been merged into this issue.

Comment 3 by marq@chromium.org, Jun 12 2018

Labels: MS-Tab-Grid S-Polish

Comment 4 by marq@chromium.org, Jun 13 2018

Labels: Q2
Status: Assigned (was: Untriaged)
Labels: M-69
Status: Started (was: Assigned)
Project Member

Comment 7 by bugdroid1@chromium.org, Jul 20

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/aad2c8570a211ab0010a7b97b464372a7a48d9c5

commit aad2c8570a211ab0010a7b97b464372a7a48d9c5
Author: Mark Cogan <marq@google.com>
Date: Fri Jul 20 11:51:03 2018

[iOS] Updated foreground new-tab animation for UIRefresh

This CL replaces the "open new tab" animation from the BVC for UIRefresh.

The animation itself is implemented inside an animation view which is inserted at the front of the BVC's content area; this will put the animation behind the bottom toolbar (or behind the toolbar in landscape).

To avoid too much refactoring, this CL uses most of the setup code for the existing animation. To patch a visual glitch with that code, a snapshot of the top toolbar is inserted into the content area while the animation is running.

Bug:  851872 
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: I12cb1805d6123ae0cdebcc7ce739f8ce51e3cfca
Reviewed-on: https://chromium-review.googlesource.com/1143394
Commit-Queue: Mark Cogan <marq@chromium.org>
Reviewed-by: Gauthier Ambard <gambard@chromium.org>
Cr-Commit-Position: refs/heads/master@{#576830}
[modify] https://crrev.com/aad2c8570a211ab0010a7b97b464372a7a48d9c5/ios/chrome/browser/ui/browser_view_controller.mm
[modify] https://crrev.com/aad2c8570a211ab0010a7b97b464372a7a48d9c5/ios/chrome/browser/ui/tabs/BUILD.gn
[add] https://crrev.com/aad2c8570a211ab0010a7b97b464372a7a48d9c5/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.h
[add] https://crrev.com/aad2c8570a211ab0010a7b97b464372a7a48d9c5/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.mm

Status: Fixed (was: Started)
Project Member

Comment 9 by bugdroid1@chromium.org, Jul 23

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/946179d72f823e368a38da06b8e583e70934d5c2

commit 946179d72f823e368a38da06b8e583e70934d5c2
Author: Mark Cogan <marq@google.com>
Date: Mon Jul 23 12:49:32 2018

[iOS] Tune updated new tab animation

A small tweak to the spring damping ratio for the new tab animation, which ensures that the spring effect doesn't show a black hairline on an iPhone X.

Bug:  851872 
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: I1b6769f9d4b124e332efddf2f9602b4665d7aca8
Reviewed-on: https://chromium-review.googlesource.com/1146640
Reviewed-by: Gauthier Ambard <gambard@chromium.org>
Commit-Queue: Mark Cogan <marq@chromium.org>
Cr-Commit-Position: refs/heads/master@{#577156}
[modify] https://crrev.com/946179d72f823e368a38da06b8e583e70934d5c2/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.mm

Labels: Merge-Request-69
Status: Verified (was: Fixed)
Verified on Canary 70.0.3501.0
Labels: -Merge-Request-69 Merge-Approved-69
Approved!
Project Member

Comment 12 by bugdroid1@chromium.org, Jul 25

Labels: -merge-approved-69 merge-merged-3497
The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/fb463bc9a15f4ec2eded8b9925644bd60a989cde

commit fb463bc9a15f4ec2eded8b9925644bd60a989cde
Author: Mark Cogan <marq@google.com>
Date: Wed Jul 25 07:52:27 2018

[iOS] Updated foreground new-tab animation for UIRefresh

This CL replaces the "open new tab" animation from the BVC for UIRefresh.

The animation itself is implemented inside an animation view which is inserted at the front of the BVC's content area; this will put the animation behind the bottom toolbar (or behind the toolbar in landscape).

To avoid too much refactoring, this CL uses most of the setup code for the existing animation. To patch a visual glitch with that code, a snapshot of the top toolbar is inserted into the content area while the animation is running.

Bug:  851872 
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: I12cb1805d6123ae0cdebcc7ce739f8ce51e3cfca
Reviewed-on: https://chromium-review.googlesource.com/1143394
Commit-Queue: Mark Cogan <marq@chromium.org>
Reviewed-by: Gauthier Ambard <gambard@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#576830}(cherry picked from commit aad2c8570a211ab0010a7b97b464372a7a48d9c5)
Reviewed-on: https://chromium-review.googlesource.com/1149780
Reviewed-by: Mark Cogan <marq@chromium.org>
Cr-Commit-Position: refs/branch-heads/3497@{#64}
Cr-Branched-From: 271eaf50594eb818c9295dc78d364aea18c82ea8-refs/heads/master@{#576753}
[modify] https://crrev.com/fb463bc9a15f4ec2eded8b9925644bd60a989cde/ios/chrome/browser/ui/browser_view_controller.mm
[modify] https://crrev.com/fb463bc9a15f4ec2eded8b9925644bd60a989cde/ios/chrome/browser/ui/tabs/BUILD.gn
[add] https://crrev.com/fb463bc9a15f4ec2eded8b9925644bd60a989cde/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.h
[add] https://crrev.com/fb463bc9a15f4ec2eded8b9925644bd60a989cde/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.mm

Project Member

Comment 13 by bugdroid1@chromium.org, Jul 25

The following revision refers to this bug:
  https://chromium.googlesource.com/chromium/src.git/+/4745a2653d93de9953371932f0478626a88bc353

commit 4745a2653d93de9953371932f0478626a88bc353
Author: Mark Cogan <marq@google.com>
Date: Wed Jul 25 07:55:44 2018

[iOS] Tune updated new tab animation

A small tweak to the spring damping ratio for the new tab animation, which ensures that the spring effect doesn't show a black hairline on an iPhone X.

Bug:  851872 
Cq-Include-Trybots: luci.chromium.try:ios-simulator-full-configs;master.tryserver.chromium.mac:ios-simulator-cronet
Change-Id: I1b6769f9d4b124e332efddf2f9602b4665d7aca8
Reviewed-on: https://chromium-review.googlesource.com/1146640
Reviewed-by: Gauthier Ambard <gambard@chromium.org>
Commit-Queue: Mark Cogan <marq@chromium.org>
Cr-Original-Commit-Position: refs/heads/master@{#577156}(cherry picked from commit 946179d72f823e368a38da06b8e583e70934d5c2)
Reviewed-on: https://chromium-review.googlesource.com/1149800
Reviewed-by: Mark Cogan <marq@chromium.org>
Cr-Commit-Position: refs/branch-heads/3497@{#65}
Cr-Branched-From: 271eaf50594eb818c9295dc78d364aea18c82ea8-refs/heads/master@{#576753}
[modify] https://crrev.com/4745a2653d93de9953371932f0478626a88bc353/ios/chrome/browser/ui/tabs/foreground_tab_animation_view.mm

Sign in to add a comment