UILabel混合显示动画效果

效果

源码

https://github.com/YouXianMing/Animations

//
// MixedColorProgressViewController.m
// Animations
//
// Created by YouXianMing on 16/1/5.
// Copyright © 2016年 YouXianMing. All rights reserved.
// #import "MixedColorProgressViewController.h"
#import "UIView+SetRect.h"
#import "GCD.h" @interface MixedColorProgressViewController () @property (nonatomic, strong) UIView *upView;
@property (nonatomic, strong) UILabel *upLabel;
@property (nonatomic, strong) UIView *downView;
@property (nonatomic, strong) UILabel *downLabel; @property (nonatomic, strong) GCDTimer *timer; @end @implementation MixedColorProgressViewController - (void)setup { [super setup]; /*
给upView的frame值做动画才是label能够混色显示的核心 upView(红色背景) ===> upLabel(白色底字)
| |
| |
| |
| |
downView(白色背景) ===> downLabel(红色底字) */ // 上面一层
{
// 红色背景
_upView = [[UIView alloc] initWithFrame:CGRectMake(, , , )];
_upView.center = self.view.center;
_upView.layer.cornerRadius = .f;
_upView.backgroundColor = [UIColor redColor];
_upView.layer.masksToBounds = YES; // 核心(不让subview显示超出范围)
[self.view addSubview:_upView]; // 白色底字
_upLabel = [[UILabel alloc] initWithFrame:_upView.bounds];
_upLabel.font = [UIFont fontWithName:@"HelveticaNeue-Thin" size:];
_upLabel.text = @"YouXianMing - iOS Programmer";
_upLabel.textColor = [UIColor whiteColor];
_upLabel.textAlignment = NSTextAlignmentCenter;
[_upView addSubview:_upLabel];
} // 下面一层
{
// 白色背景
_downView = [[UIView alloc] initWithFrame:CGRectMake(, , , )];
_downView.center = self.view.center;
_downView.layer.cornerRadius = .f;
_downView.backgroundColor = [UIColor whiteColor];
[self.view addSubview:_downView]; // 红色底字
_downLabel = [[UILabel alloc] initWithFrame:_downView.bounds];
_downLabel.textColor = [UIColor redColor];
_downLabel.font = [UIFont fontWithName:@"HelveticaNeue-Thin" size:];
_downLabel.text = @"YouXianMing - iOS Programmer";
_downLabel.textAlignment = NSTextAlignmentCenter;
[_downView addSubview:_downLabel];
} // 显示上面一层
[self.view bringSubviewToFront:_upView]; // 给上面一层的frame值做动画
_timer = [[GCDTimer alloc] initInQueue:[GCDQueue mainQueue]];
[_timer event:^{ [UIView animateWithDuration:0.5f delay:.f usingSpringWithDamping:.f initialSpringVelocity: options: animations:^{ _upView.width = arc4random() % ; } completion:nil]; } timeInterval:NSEC_PER_SEC];
[_timer start];
} @end

细节

UILabel混合显示动画效果的更多相关文章

  1. UILabel的缩放动画效果

    UILabel的缩放动画效果 效果图 源码 https://github.com/YouXianMing/Animations // // ScaleLabel.h // Animations // ...

  2. 高逼格UILabel的闪烁动画效果

    高逼格UILabel的闪烁动画效果 最终效果图如下: 源码: YXLabel.h 与  YXLabel.m // // YXLabel.h // // Created by YouXianMing o ...

  3. anacoda的spyder在调用matplotlib的时候无法显示动画效果【学习笔记】

    ipython console的默认设置将图像结果显示在终端,但是这样显示存在的问题是无法显示动画效果,因此需要将动画效果显示到单独的窗口,按照下面的截图即可显示. 方法一.按照如下截图显示设置,重启 ...

  4. jquery 隐藏 显示 动画效果

    <!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js&qu ...

  5. cad.net 图元延迟显示,动画效果,编辑器延迟发送提示.

    public class Command_test { [CommandMethod("tt", CommandFlags.Modal | CommandFlags.UsePick ...

  6. iframe载入页面过程显示动画效果

    http://www.xfeixiang.com/Bug/Detail/A2FD7EFFA8CA72F1

  7. 设置Activity显示和关闭时的动画效果

    设置Activity显示和关闭时的动画效果 通过overridePendingTransition方法可以设置Activity显示和关闭的动画效果.首先需要在res/anim目录中建立相应的动画资源文 ...

  8. UI设计篇·入门篇·简单动画的实现,透明动画/旋转动画/移动动画/缩放动画,混合动画效果的实现,为动画设置监听事件,自定义动画的方法

    基本的动画构成共有四种:透明动画/旋转动画/移动动画/缩放动画. 配置动画的方式有两种,一种是直接使用代码来配置动画效果,另一种是使用xml文档配置动画效果 相比而言,用xml文档写出来的动画效果,写 ...

  9. Android ListView item项 显示动画

    (1)使用LayoutAnimation 所谓的布局动画,其实就是为ViewGroup添加显示动画效果,主要用过LayoutAnimationController来控制实现.LayoutAnimati ...

随机推荐

  1. USACO 6.1 A Rectangular Barn

    A Rectangular Barn Mircea Pasoi -- 2003 Ever the capitalist, Farmer John wants to extend his milking ...

  2. ArrayList源码中EMPTY_ELEMENTDATA和DEFAULTCAPACITY_EMPTY_ELEMENTDATA的区别

    2018年7月22日09:54:17 JDK 1.8.0_162 ArrayList源码中EMPTY_ELEMENTDATA和DEFAULTCAPACITY_EMPTY_ELEMENTDATA的区别 ...

  3. poi类包对比

  4. 一、django rest_framework源码之总体流程剖析

    1 序言 有如下django代码,视图层: from django.http import HttpResponse from rest_framework.views import APIView ...

  5. 【转】JQuery Validate使用总结1

    一.导入js库 <script src="../js/jquery.js" type="text/javascript"></script&g ...

  6. 切换 NPM 镜像源

    转载:快速切换NPM源 我们介绍过cnpmjs.org和淘宝 npm 两个 NPM 镜像.除此之外,还有一些国外的 NPM 镜像.不同地区访问不同的镜像速度可能有差异,因此有时候需要切换 NPM 镜像 ...

  7. Revit二次开发示例:DeleteDimensions

    在本例中,创建一个命令,实现删除所选中的尺寸标注. #region Namespaces using System; using System.Collections.Generic; using S ...

  8. HTML 模板继承

    网站模板的设计,一般的,我们做网站有一些通用的部分,比如 导航,底部,访问统计代码等.合理的规划模板往往会减少工作量,同时也使得罗乱.难以阅读的静态页面布局变得优雅. 假设,我们的网站主页面除了正文是 ...

  9. rest framework 类 继承图

  10. djongo form.is_valid 返回false的解决方法

    在用djongo编写网站时,有时点击提交按钮之后,并未提交,通过debug会发现是form.is_valid()返回false造成的.但是,具体原因往往并不容易找. 这时在提交的html中添加如下代码 ...