BAShimmerButton 0.1.0

BAShimmerButton 0.1.0

×

测试已测试✗
语言语言 Obj-CObjective C
许可证 MIT
发布最后发布2015年9月

由Bryan Antigua维护。

BAShimmerButton 0.1.0

  • 由
  • Bryan Antigua

概述

注意：GIF 的质量影响了闪烁效果（运行代码以获得最佳显示效果）


example1 example4 example6

一个带有闪烁、移动和开关功能的行动按钮。多种方式吸引用户注意力！


要求

  • 在所有 iOS 设备上工作


示例

要运行示例项目，首先克隆仓库，然后从 Example 目录运行 pod install。


开始使用

安装

简单用法

基础

要将 BAShimmerButton 添加到您的应用程序中，添加以下行：

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
[self addCircularMask:button];
[button showButtonWithAnimation:@YES];//@NO skips the animation

注意：在添加按钮之前，已添加圆形遮罩注意：如果已将按钮添加到 IB 中，则可以跳过第一行

这将创建以下动画/按钮

example1

高级用法

下面列出了一些可控制的属性示例。

初始化

您可以使用 initWithFrame: 或简单地在 Interface Builder 中添加视图来使用此按钮。

showButtonWithAnimation:(bool)animated

通过调用此方法显示按钮，通过传递 @NO，将简单显示按钮。如果传递 @YES，您将看到以下动画（与 基本 部分中的相同代码）

example1

hideButtonWithAnimation:(bool)animated

类似于上面的一个，但是相反

example2

toggleButton

这将过渡按钮从开启状态到关闭状态，反之亦然。IB 操作可以像以下示例那样完成

- (IBAction)buttonPressed:(id)sender {
    BAShimmerButton *button = (BAShimmerButton*)sender;
    [button toggleButton];
}

然后您可以生成以下内容

example3 example4

wiggleButton

为了引起按钮的注意，尝试此方法

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
[self addCircularMask:button];
[button showButtonWithAnimation:@NO];
[button wiggleButton];

它将产生以下结果

example5

图标图像

可以使用 iconImage 属性为按钮设置图标图像。这也会创建一个离线状态下的图像遮罩（您可以选择的颜色）。

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
[self addCircularMask:button];
button.backgroundColor = [UIColor colorWithHex:0x420013];
button.shimmerColor = [UIColor colorWithHex:0xe33550];
button.iconImage = [UIImage imageNamed:@"icon"];
[button showButtonWithAnimation:@NO];//@NO skips the animation

这创建了以下按钮

example10

IconOff ImageColor

对于上方图标的离线状态，您可以设置不同的离线颜色

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
button.gradientSize = 0.3f;
button.backgroundColor = [UIColor colorWithHex:0x420013];
button.shimmerColor = [UIColor colorWithHex:0xe33550];
button.iconOffImageColor = [UIColor colorWithHex:0xfffffff];
button.iconImage = [UIImage imageNamed:@"icon"];
[button showButtonWithAnimation:@NO];

注意：在使用 iconImage 之前设置 这将创建以下视图

example11

Shimmer Duration

如果要使闪烁持续更长时间/更短时间，可以编辑 shimmerDuration 属性

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
button.shimmerDuration = 1.0f;
[button showButtonWithAnimation:@NO];

这会产生以下效果

example6

Shimmer Color

您也可以通过编辑 shimmerColor 属性来更改闪烁的整体颜色

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
[self addRoundedSquareMask:button];
button.backgroundColor = [UIColor colorWithHex:0x22313F];
button.shimmerColor = [UIColor colorWithHex:0x3498db];
[button showButtonWithAnimation:@NO];

这会产生以下效果

example7

Shimmer Direction

默认情况下，动画以对角线方向从左到右进行。您可以通过设置 shimmerDirection 属性来更改方向，以下选项任选

  • BAShimmerDirectionTopToBottom
  • BAShimmerDirectionBottomToTop
  • BAShimmerDirectionLeftToRight
  • BAShimmerDirectionDiagonalLeftToRight
  • BAShimmerDirectionRightToLeft
  • BAShimmerDirectionDiagonalRightToLeft

设置新方向的方法如下

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
button.shimmerDuration = BAShimmerDirectionTopToBottom;
[button showButtonWithAnimation:@NO];

这创建了以下视图

example8

Gradient Size

可以使用 gradientSize 属性调整渐变大小。此值介于 0 和 1 之间，决定了整个闪烁的宽度

BAShimmerButton *button = [[BAShimmerButton alloc] initWithFrame:self.view.frame];
button.gradientSize = 0.3f;
[button showButtonWithAnimation:@NO];

这创建了以下按钮

example9

Author

Bryan Antigua, [email protected] - bryanantigua.com

License

BAShimmerButton 受 MIT 许可证许可。有关更多信息，请参阅 LICENSE 文件。