编写带有点击特效的UIButton

简介:

编写带有点击特效的UIButton

效果:

源码:

//
//  ViewController.m
//  Button
//
//  Created by XianMingYou on 15/1/18.
//  Copyright (c) 2015年 XianMingYou. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@property (nonatomic, strong) UIButton    *button;
@property (nonatomic, strong) UIView      *showView;
@property (nonatomic, strong) UILabel     *showLabel;
@property (nonatomic, strong) UILabel     *staticLabel;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor blackColor];

    
    self.showView                        = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 300, 0)];
    self.showView.transform              = CGAffineTransformMakeRotation(45 * M_PI / 180.0);
    self.showView.userInteractionEnabled = NO;
    self.showView.backgroundColor        = [UIColor redColor];
    
    
    self.staticLabel               = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 130, 30)];
    self.staticLabel.text          = @"YouXianMing";
    self.staticLabel.font          = [UIFont fontWithName:@"HelveticaNeue-Thin" size:18.f];
    self.staticLabel.textAlignment = NSTextAlignmentCenter;
    self.staticLabel.textColor     = [UIColor redColor];
    
    
    self.showLabel               = [[UILabel alloc] initWithFrame:CGRectMake(0, 0, 130, 30)];
    self.showLabel.text          = @"YouXianMing";
    self.showLabel.alpha         = 0.f;
    self.showLabel.font          = [UIFont fontWithName:@"HelveticaNeue-Thin" size:18.f];
    self.showLabel.textAlignment = NSTextAlignmentCenter;
    self.showLabel.textColor     = [UIColor blackColor];

    
    
    // 完整显示按住按钮后的动画效果
    _button                     = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 130, 30)];
    _button.backgroundColor     = [UIColor clearColor];
    _button.layer.borderWidth   = 1.f;
    _button.layer.borderColor   = [UIColor redColor].CGColor;
    _button.layer.masksToBounds = YES;
    _button.center              = self.view.center;
    [self.view addSubview:_button];
    
    self.showView.center = CGPointMake(_button.frame.size.width / 2.f, _button.frame.size.height / 2.f);
    [_button addSubview:self.showView];
    
    self.staticLabel.center = CGPointMake(_button.frame.size.width / 2.f, _button.frame.size.height / 2.f);
    [_button addSubview:self.staticLabel];
    
    self.showLabel.center = CGPointMake(_button.frame.size.width / 2.f, _button.frame.size.height / 2.f);
    [_button addSubview:self.showLabel];

    
    // 按住按钮后没有松手的动画
    [_button addTarget:self
                action:@selector(scaleToSmall)
      forControlEvents:UIControlEventTouchDown | UIControlEventTouchDragEnter];
    
    // 按住按钮松手后的动画
    [_button addTarget:self
                action:@selector(scaleAnimation)
      forControlEvents:UIControlEventTouchUpInside];
    
    // 按住按钮后拖拽出去的动画
    [_button addTarget:self
                action:@selector(scaleToDefault)
      forControlEvents:UIControlEventTouchDragExit];
}

- (void)scaleToSmall {
    [UIView animateWithDuration:0.5f animations:^{
        self.showView.bounds          = CGRectMake(0, 0, 300, 90);
        self.showView.backgroundColor = [UIColor redColor];
        self.showLabel.alpha          = 1.f;
    } completion:^(BOOL finished) {
        NSLog(@"%d", finished);
    }];
}

- (void)scaleAnimation {
    // 获取到当前的状态
    self.showView.bounds                = ((CALayer *)self.showView.layer.presentationLayer).bounds;
    self.showView.layer.backgroundColor = ((CALayer *)self.showView.layer.presentationLayer).backgroundColor;
    self.showLabel.alpha                = ((CALayer *)self.showLabel.layer.presentationLayer).opacity;
    
    // 移除之前的动画状态
    [self.showView.layer removeAllAnimations];

    // 做全新的动画
    [UIView animateWithDuration:0.25f animations:^{
        self.showView.bounds          = CGRectMake(0, 0, 300, 0);
        self.showView.backgroundColor = [UIColor clearColor];
        self.showLabel.alpha          = 0.f;
    } completion:^(BOOL finished) {
        
    }];
}

- (void)scaleToDefault {
    // 获取到当前的状态
    self.showView.bounds                = ((CALayer *)self.showView.layer.presentationLayer).bounds;
    self.showView.layer.backgroundColor = ((CALayer *)self.showView.layer.presentationLayer).backgroundColor;
    self.showLabel.alpha                = ((CALayer *)self.showLabel.layer.presentationLayer).opacity;
    
    // 移除之前的动画状态
    [self.showView.layer removeAllAnimations];
    
    // 做全新的动画
    [UIView animateWithDuration:0.25f animations:^{
        self.showView.bounds          = CGRectMake(0, 0, 300, 0);
        self.showView.backgroundColor = [UIColor clearColor];
        self.showLabel.alpha          = 0.f;
    } completion:^(BOOL finished) {
        
    }];
}


@end

核心源码:

目录
相关文章
|
11天前
|
弹性计算 关系型数据库 微服务
基于 Docker 与 Kubernetes(K3s)的微服务:阿里云生产环境扩容实践
在微服务架构中,如何实现“稳定扩容”与“成本可控”是企业面临的核心挑战。本文结合 Python FastAPI 微服务实战,详解如何基于阿里云基础设施,利用 Docker 封装服务、K3s 实现容器编排,构建生产级微服务架构。内容涵盖容器构建、集群部署、自动扩缩容、可观测性等关键环节,适配阿里云资源特性与服务生态,助力企业打造低成本、高可靠、易扩展的微服务解决方案。
1230 5
|
10天前
|
机器学习/深度学习 人工智能 前端开发
通义DeepResearch全面开源!同步分享可落地的高阶Agent构建方法论
通义研究团队开源发布通义 DeepResearch —— 首个在性能上可与 OpenAI DeepResearch 相媲美、并在多项权威基准测试中取得领先表现的全开源 Web Agent。
1214 87
|
10天前
|
云栖大会
阿里云云栖大会2025年9月24日开启,免费申请大会门票,速度领取~
2025云栖大会将于9月24-26日举行,官网免费预约畅享票,审核后短信通知,持证件入场
1796 13
|
20天前
|
人工智能 运维 安全
|
3天前
|
资源调度
除了nrm-pm,还有哪些工具可以管理多个包管理器的源?
除了nrm-pm,还有哪些工具可以管理多个包管理器的源?
234 127
|
4天前
|
前端开发
Promise的then方法返回的新Promise对象有什么特点?
Promise的then方法返回的新Promise对象有什么特点?
177 2