Animate IOS Share extension button.

ios/chrome/share_extension/share_extension_view.mm

 // Copyright 2016 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.
 
 #import "ios/chrome/share_extension/share_extension_view.h"
 
 #include "base/logging.h"
 #import "ios/chrome/share_extension/ui_util.h"
 
 #if !defined(__has_feature) || !__has_feature(objc_arc)
@@ skipping 33 matching lines @@
   else
     self.backgroundColor = [UIColor clearColor];
 }
 
 @end
 
 #pragma mark - Share Extension View
 
 @interface ShareExtensionView () {
   __weak id<ShareExtensionViewActionTarget> _target;
+
+  // Track if a button has been pressed. All button pressing will have no effect
+  // if |_dismissed| is YES.
+  BOOL _dismissed;
 }
 
 // Keep strong references of the views that need to be updated.
 @property(nonatomic, strong) UILabel* titleLabel;
 @property(nonatomic, strong) UILabel* URLLabel;
+@property(nonatomic, strong) UIButton* readingListButton;
 @property(nonatomic, strong) UIImageView* screenshotView;
 @property(nonatomic, strong) UIStackView* itemStack;
 
 // View creation helpers.
 // Returns a view containing the shared items (title, URL, screenshot). This
 // method will set the ivars.
 - (UIView*)sharedItemView;
 
 // Returns a button containing the with title |title| and action |selector| on
 // |_target|.
 - (UIButton*)buttonWithTitle:(NSString*)title selector:(SEL)selector;
 
 // Returns a view containing a divider with vibrancy effect.
 - (UIView*)dividerViewWithVibrancy:(UIVisualEffect*)vibrancyEffect;
 
 // Returns a navigationBar.
 - (UINavigationBar*)navigationBar;
 
+// Called when "Read Later" button has been pressed.
+- (void)addToReadingListPressed:(UIButton*)sender;
+
+// Called when "Add to bookmarks" button has been pressed.
+- (void)addToBookmarksPressed:(UIButton*)sender;
+
+// Called when "Cancel" button has been pressed.
+- (void)cancelPressed:(UIButton*)sender;
+
 @end
 
 @implementation ShareExtensionView
 
 @synthesize titleLabel = _titleLabel;
 @synthesize URLLabel = _URLLabel;
+@synthesize readingListButton = _readingListButton;
 @synthesize screenshotView = _screenshotView;
 @synthesize itemStack = _itemStack;
 
 #pragma mark - Lifecycle
 
 - (instancetype)initWithActionTarget:
     (id<ShareExtensionViewActionTarget>)target {
   self = [super initWithFrame:CGRectZero];
   if (self) {
     DCHECK(target);
     _target = target;
+    _dismissed = NO;
 
     [self.layer setCornerRadius:kCornerRadius];
     [self setClipsToBounds:YES];
     UIBlurEffect* blurEffect =
         [UIBlurEffect effectWithStyle:UIBlurEffectStyleExtraLight];
     UIVibrancyEffect* vibrancyEffect =
         [UIVibrancyEffect effectForBlurEffect:blurEffect];
 
     self.backgroundColor = [UIColor colorWithWhite:242.0f / 255.0f alpha:1];
 
     // Add the blur effect to the whole widget.
     UIVisualEffectView* blurringView =
         [[UIVisualEffectView alloc] initWithEffect:blurEffect];
     [self addSubview:blurringView];
     ui_util::ConstrainAllSidesOfViewToView(self, blurringView);
     [[blurringView layer] setCornerRadius:kCornerRadius];
     [blurringView setClipsToBounds:YES];
 
     NSString* addToReadingListTitle = NSLocalizedString(
         @"IDS_IOS_ADD_READING_LIST_SHARE_EXTENSION",
         @"The add to reading list button text in share extension.");
-    UIButton* readingListButton = [self
-        buttonWithTitle:addToReadingListTitle
-               selector:@selector(
-                            shareExtensionViewDidSelectAddToReadingList:)];
+    self.readingListButton =
+        [self buttonWithTitle:addToReadingListTitle
+                     selector:@selector(addToReadingListPressed:)];
 
     NSString* addToBookmarksTitle = NSLocalizedString(
         @"IDS_IOS_ADD_BOOKMARKS_SHARE_EXTENSION",
         @"The Add to bookmarks button text in share extension.");
-    UIButton* bookmarksButton = [self
-        buttonWithTitle:addToBookmarksTitle
-               selector:@selector(shareExtensionViewDidSelectAddToBookmarks:)];
+    UIButton* bookmarksButton =
+        [self buttonWithTitle:addToBookmarksTitle
+                     selector:@selector(addToBookmarksPressed:)];
 
     UIStackView* contentStack = [[UIStackView alloc] initWithArrangedSubviews:@[
       [self navigationBar], [self dividerViewWithVibrancy:vibrancyEffect],
       [self sharedItemView], [self dividerViewWithVibrancy:vibrancyEffect],
-      readingListButton, [self dividerViewWithVibrancy:vibrancyEffect],
+      self.readingListButton, [self dividerViewWithVibrancy:vibrancyEffect],
       bookmarksButton
     ]];
     [contentStack setAxis:UILayoutConstraintAxisVertical];
     [[blurringView contentView] addSubview:contentStack];
 
     [blurringView setTranslatesAutoresizingMaskIntoConstraints:NO];
     [contentStack setTranslatesAutoresizingMaskIntoConstraints:NO];
 
     ui_util::ConstrainAllSidesOfViewToView([blurringView contentView],
                                            contentStack);
@@ skipping 108 matching lines @@
 
 - (UIButton*)buttonWithTitle:(NSString*)title selector:(SEL)selector {
   UIButton* systemButton = [UIButton buttonWithType:UIButtonTypeSystem];
   UIColor* systemColor = [systemButton titleColorForState:UIControlStateNormal];
 
   UIButton* button = [[ShareExtensionButton alloc] initWithFrame:CGRectZero];
   [button setTitle:title forState:UIControlStateNormal];
   [button setTitleColor:systemColor forState:UIControlStateNormal];
   [[button titleLabel] setFont:[UIFont systemFontOfSize:kButtonFontSize]];
   [button setTranslatesAutoresizingMaskIntoConstraints:NO];
-  [button addTarget:_target
+  [button addTarget:self
                 action:selector
       forControlEvents:UIControlEventTouchUpInside];
   [button.heightAnchor constraintEqualToConstant:kButtonHeight].active = YES;
   return button;
 }
 
 - (UINavigationBar*)navigationBar {
   // Create the navigation bar.
   UINavigationBar* navigationBar =
       [[UINavigationBar alloc] initWithFrame:CGRectZero];
   [[navigationBar layer] setCornerRadius:kCornerRadius];
   [navigationBar setClipsToBounds:YES];
 
   // Create an empty image to replace the standard gray background of the
   // UINavigationBar.
   UIImage* emptyImage = [[UIImage alloc] init];
   [navigationBar setBackgroundImage:emptyImage
                       forBarMetrics:UIBarMetricsDefault];
   [navigationBar setShadowImage:emptyImage];
   [navigationBar setTranslucent:YES];
   [navigationBar setTranslatesAutoresizingMaskIntoConstraints:NO];
 
   UIBarButtonItem* cancelButton = [[UIBarButtonItem alloc]
       initWithBarButtonSystemItem:UIBarButtonSystemItemCancel
-                           target:_target
-                           action:@selector(
-                                      shareExtensionViewDidSelectCancel:)];
+                           target:self
+                           action:@selector(cancelPressed:)];
 
   NSString* appName =
       [[NSBundle mainBundle] objectForInfoDictionaryKey:@"CFBundleDisplayName"];
   UINavigationItem* titleItem =
       [[UINavigationItem alloc] initWithTitle:appName];
   [titleItem setLeftBarButtonItem:cancelButton];
   [titleItem setHidesBackButton:YES];
   [navigationBar pushNavigationItem:titleItem animated:NO];
   return navigationBar;
 }
 
+- (void)addToReadingListPressed:(UIButton*)sender {
+  if (_dismissed) {
+    return;
+  }
+  _dismissed = YES;
+  [self animateButtonPressed:sender
+              withCompletion:^{
+                [_target shareExtensionViewDidSelectAddToReadingList:sender];
+              }];
+}
+
+- (void)animateButtonPressed:(UIButton*)sender

[gambard, 2017/01/06 16:23:54]

Add method definition and comment.

[Olivier, 2017/01/06 16:42:16]

Done.

+              withCompletion:(void (^)(void))completion {
+  NSString* addedString =
+      NSLocalizedString(@"IDS_IOS_ADDED_ITEM_SHARE_EXTENSION",

[gambard, 2017/01/06 16:23:54]

Did you add IDS_IOS_ADDED_ITEM_SHARE_EXTENSION? I don't see it.

[Olivier, 2017/01/06 16:42:15]

I did... in another tree... :(

+                        @"Button label after being pressed.");
+  NSString* addedCheckedString =
+      [addedString stringByAppendingString:@" \u2713"];
+  // Create a label with the same style as the split animation between the text
+  // and the checkmark.
+  UILabel* addedLabel = [[UILabel alloc] initWithFrame:CGRectZero];
+  [addedLabel setTranslatesAutoresizingMaskIntoConstraints:NO];
+  [addedLabel setText:addedString];
+  [self addSubview:addedLabel];
+  [addedLabel setFont:[sender titleLabel].font];
+  [addedLabel setTextColor:[sender titleLabel].textColor];

[gambard, 2017/01/06 16:23:54]

You can use [sender titleColorForState:UIControlStateNormal];

[Olivier, 2017/01/06 16:42:15]

Done.

+  [addedLabel.leadingAnchor

[gambard, 2017/01/06 16:23:54]

This will align the beginning of the "Added" with the previous text of the
button.
Don't we want to center it?
You will need to change the way you are doing step3 if you do like that.

[Olivier, 2017/01/06 16:42:15]

There is no mock on what is centered.
What is true is that both labels must be aligned by leading as text of the
second must be just over the text of the first.

+      constraintEqualToAnchor:[sender titleLabel].leadingAnchor]
+      .active = YES;
+  [addedLabel.centerYAnchor
+      constraintEqualToAnchor:[sender titleLabel].centerYAnchor]
+      .active = YES;
+  [addedLabel setAlpha:0];
+
+  void (^step3ShowCheck)() = ^{
+    [UIView animateWithDuration:ui_util::kAnimationDuration
+        animations:^{
+          [addedLabel setAlpha:0];
+          [sender setAlpha:1];
+        }
+        completion:^(BOOL finished) {
+          completion();

[gambard, 2017/01/06 16:23:54]

You don't check for nullability?

[Olivier, 2017/01/06 16:42:16]

Done.

+        }];
+  };
+
+  void (^step2ShowTextWithoutCheck)() = ^{
+    [sender setTitle:addedCheckedString forState:UIControlStateNormal];
+    [UIView animateWithDuration:ui_util::kAnimationDuration
+        animations:^{
+          [addedLabel setAlpha:1];
+        }
+        completion:^(BOOL finished) {
+          step3ShowCheck();
+        }];
+  };
+
+  void (^step1HideText)() = ^{
+    [UIView animateWithDuration:ui_util::kAnimationDuration
+        animations:^{
+          [sender setAlpha:0];
+        }
+        completion:^(BOOL finished) {
+          step2ShowTextWithoutCheck();
+        }];
+  };
+  step1HideText();
+}
+
+- (void)addToBookmarksPressed:(UIButton*)sender {

[gambard, 2017/01/06 16:23:54]

Please position this function before animateButtonPressed:withCompletion:

[Olivier, 2017/01/06 16:42:16]

Done.

+  if (_dismissed) {
+    return;
+  }
+  _dismissed = YES;
+  [self animateButtonPressed:sender
+              withCompletion:^{
+                [_target shareExtensionViewDidSelectAddToBookmarks:sender];
+              }];
+}
+
+- (void)cancelPressed:(UIButton*)sender {
+  if (_dismissed) {
+    return;
+  }
+  _dismissed = YES;
+  [_target shareExtensionViewDidSelectCancel:sender];
+}
+
 #pragma mark - Content getters and setters.
 
 - (void)setURL:(NSURL*)URL {
   [[self URLLabel] setText:[URL absoluteString]];
 }
 
 - (void)setTitle:(NSString*)title {
   [[self titleLabel] setText:title];
 }
 
 - (void)setScreenshot:(UIImage*)screenshot {
   [[self screenshotView] setHidden:NO];
   [[self screenshotView] setImage:screenshot];
   [[self itemStack] addArrangedSubview:[self screenshotView]];
 }
 
 @end