[MDC/Button] Add rippleColor and rippleStyle APIs

This commit adds the ripple color and ripple style APIs to match the inkColor and inkStyle APIs that are soon to be deprecated. This also moves those APIs to a "ToBeDeprecated" category. In this commit I set an ivar instead of having pass through properties because in a follow up I think it would be a good optimization to have the ripple be lazy until a user interacts with the button. This will lower initialization time and make the setters potentially faster. Since we don't have pass through properties I mirrored the default rippleColor from `MDCStatefulRippleView` to match here.

PiperOrigin-RevId: 322585578

components/Buttons/src/MDCButton.h

@@ -17,6 +17,7 @@
 
 #import "MaterialElevation.h"
 #import "MaterialInk.h"
+#import "MaterialRipple.h"
 #import "MaterialShadowElevations.h"
 #import "MaterialShapes.h"
 
@@ -36,11 +37,15 @@
  */
 @interface MDCButton : UIButton <MDCElevatable, MDCElevationOverriding>
 
-/** The ink style of the button. */
-@property(nonatomic, assign) MDCInkStyle inkStyle UI_APPEARANCE_SELECTOR;
+/** The ripple style of the button. */
+@property(nonatomic, assign) MDCRippleStyle rippleStyle;
 
-/** The ink color of the button. */
-@property(nonatomic, strong, null_resettable) UIColor *inkColor UI_APPEARANCE_SELECTOR;
+/**
+ The color of the ripple.
+
+ @note Defaults to a transparent black.
+ */
+@property(nonatomic, strong, null_resettable) UIColor *rippleColor;
 
 /*
  Maximum radius of the button's ink. If the radius <= 0 then half the length of the diagonal of
@@ -401,4 +406,10 @@
  */
 @property(nonatomic, assign) BOOL accessibilityTraitsIncludesButton;
 
+/** The ink style of the button. */
+@property(nonatomic, assign) MDCInkStyle inkStyle UI_APPEARANCE_SELECTOR;
+
+/** The ink color of the button. */
+@property(nonatomic, strong, null_resettable) UIColor *inkColor UI_APPEARANCE_SELECTOR;
+
 @end

components/Buttons/src/MDCButton.m

@@ -33,6 +33,7 @@
 static const CGFloat MDCButtonMinimumTouchTargetHeight = 48;
 static const CGFloat MDCButtonMinimumTouchTargetWidth = 48;
 static const CGFloat MDCButtonDefaultCornerRadius = 2.0;
+static const CGFloat kDefaultRippleAlpha = (CGFloat)0.12;
 
 static const NSTimeInterval MDCButtonAnimationDuration = 0.2;
 
@@ -230,7 +231,8 @@ - (void)commonMDCButtonInit {
   _inkView.inkColor = [UIColor colorWithWhite:1 alpha:(CGFloat)0.2];
 
   _rippleView = [[MDCStatefulRippleView alloc] initWithFrame:self.bounds];
-  _rippleView.rippleColor = [UIColor colorWithWhite:1 alpha:(CGFloat)0.12];
+  _rippleColor = [UIColor colorWithWhite:0 alpha:kDefaultRippleAlpha];
+  _rippleView.rippleColor = [UIColor colorWithWhite:0 alpha:(CGFloat)0.12];
 
   // Default content insets
   // The default contentEdgeInsets are set here (instead of above, as they were previously) because
@@ -622,6 +624,12 @@ - (void)setInkStyle:(MDCInkStyle)inkStyle {
       (inkStyle == MDCInkStyleUnbounded) ? MDCRippleStyleUnbounded : MDCRippleStyleBounded;
 }
 
+- (void)setRippleStyle:(MDCRippleStyle)rippleStyle {
+  _rippleStyle = rippleStyle;
+
+  self.rippleView.rippleStyle = rippleStyle;
+}
+
 - (UIColor *)inkColor {
   return _inkView.inkColor;
 }
@@ -631,6 +639,11 @@ - (void)setInkColor:(UIColor *)inkColor {
   [self.rippleView setRippleColor:inkColor forState:MDCRippleStateHighlighted];
 }
 
+- (void)setRippleColor:(UIColor *)rippleColor {
+  _rippleColor = rippleColor ?: [UIColor colorWithWhite:0 alpha:kDefaultRippleAlpha];
+  [self.rippleView setRippleColor:_rippleColor forState:MDCRippleStateHighlighted];
+}
+
 - (void)setInkMaxRippleRadius:(CGFloat)inkMaxRippleRadius {
   _inkMaxRippleRadius = inkMaxRippleRadius;
   _inkView.maxRippleRadius = inkMaxRippleRadius;

components/Buttons/tests/snapshot/ButtonsRippleSnapshotTests.m

@@ -43,7 +43,7 @@ - (void)setUp {
   UIImage *testImage = [[UIImage mdc_testImageOfSize:CGSizeMake(24, 24)]
       imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
   [self.button setImage:testImage forState:UIControlStateNormal];
-  self.button.inkColor = [UIColor.magentaColor colorWithAlphaComponent:0.25];
+  self.button.rippleColor = [UIColor.magentaColor colorWithAlphaComponent:0.25];
   [self.button sizeToFit];
   [self configureButton:self.button
                forState:UIControlStateNormal

components/Buttons/tests/unit/MDCButtonRippleTests.m

@@ -51,7 +51,7 @@ - (void)tearDown {
 - (void)testDefaultButtonBehaviorWithRipple {
   // Then
   XCTAssertNotNil(self.button.rippleView);
-  XCTAssertEqualObjects(self.button.rippleView.rippleColor, [UIColor colorWithWhite:1
+  XCTAssertEqualObjects(self.button.rippleView.rippleColor, [UIColor colorWithWhite:0
                                                                               alpha:(CGFloat)0.12]);
   XCTAssertEqual(self.button.rippleView.rippleStyle, MDCRippleStyleBounded);
   XCTAssertFalse(self.button.enableRippleBehavior);
@@ -89,37 +89,37 @@ - (void)testSetEnableRippleBehaviorToYesThenNoRemovesRippleViewAsSubviewOfButton
 }
 
 /**
- Test setting @c inkColor correctly sets the @c rippleColor on @c rippleView of the button.
+ Test setting @c rippleColor correctly sets the @c rippleColor on @c rippleView of the button.
  */
-- (void)testSetCustomInkColorUpdatesRippleViewForHighlightedState {
+- (void)testSetCustomRippleColorUpdatesRippleViewForHighlightedState {
   // Given
   UIColor *fakeColor = UIColor.redColor;
 
   // When
-  self.button.inkColor = fakeColor;
+  self.button.rippleColor = fakeColor;
 
   // Then
   XCTAssertEqualObjects([self.button.rippleView rippleColorForState:MDCRippleStateHighlighted],
                         fakeColor);
 }
 
 /**
- Test setting @c inkStyle correctly sets the @c rippleStyle on @c rippleView of the button.
+ Test setting @c rippleStyle correctly sets the @c rippleStyle on @c rippleView of the button.
  */
-- (void)testSetInkStyleUnboundedUpdatesRippleView {
+- (void)testSetRippleStyleUnboundedUpdatesRippleView {
   // When
-  self.button.inkStyle = MDCInkStyleUnbounded;
+  self.button.rippleStyle = MDCRippleStyleUnbounded;
 
   // Then
   XCTAssertEqual(self.button.rippleView.rippleStyle, MDCRippleStyleUnbounded);
 }
 
 /**
- Test setting @c inkStyle correctly sets the @c rippleStyle on @c rippleView of the button.
+ Test setting @c rippleStyle correctly sets the @c rippleStyle on @c rippleView of the button.
  */
-- (void)testSetInkStyleBoundedUpdatesRippleView {
+- (void)testSetRippleStyleBoundedUpdatesRippleView {
   // When
-  self.button.inkStyle = MDCInkStyleBounded;
+  self.button.rippleStyle = MDCRippleStyleBounded;
 
   // Then
   XCTAssertEqual(self.button.rippleView.rippleStyle, MDCRippleStyleBounded);

components/Buttons/tests/unit/MDCButtonTests.m

@@ -926,6 +926,17 @@ - (void)testInkColors {
   XCTAssertEqualObjects(self.button.inkColor, color);
 }
 
+- (void)testRippleColors {
+  // Given
+  UIColor *color = randomColor();
+
+  // When
+  self.button.rippleColor = color;
+
+  // Then
+  XCTAssertEqualObjects(self.button.rippleColor, color);
+}
+
 /*
  TODO: things to unit test
  (should these even be a thing?)