• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

XPQLabel: 轨迹文字

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称:

XPQLabel

开源软件地址:

https://gitee.com/xpq/XPQLabel

开源软件介绍:

XPQLabel

让你的文字动起来!!!让你的文字随路径轨迹办法!!!

XPQLabel能够只需简单的几句代码就让文本以各种轨迹显示和各种酷炫的动画效果。

类继承关系

UML

##语言主要语言为object-c和c++混编。其中object-c主要负责基本显示和操作,C++主要负责路径的计算。

##使用XPQLabel使用非常简单,只需三步就可以完成使用。###第一步,引入头文件把XPQLabel文件夹和其中的文件全部拖进工程。引入头文件,#import "XPQLabel.h"。###第二步,初始化####使用代码初始化

XPQLabel *label = [[XPQLabel alloc] init];

####可视化初始化只需先拖一个UIView到storyboard或者xib上,再Class属性设置成XPQLabel,然后在与某一对象关联就行。###第三步,设置文本####设置普通文本#####代码设置

label.font = [UIFont systemFontOfSize:18.0];label.textColor = [UIColor blackColor];label.text = @"这里是一串普通的文本文字。";

#####storyboard或者xib设置只需修改面板上的text属性和textColor属性,如下图:

设置文本

####设置富文本富文本只能通过代码设置

NSMutableAttributedString *attriString = [[NSMutableAttributedString alloc] initWithString:@"this is attributed string."];//把this的字体颜色变为红色[attriString addAttribute:(NSString *)kCTForegroundColorAttributeNamevalue:(id)[UIColor redColor].CGColorrange:NSMakeRange(0, 4)];//把is变为绿色[attriString addAttribute:(NSString *)kCTForegroundColorAttributeNamevalue:(id)[UIColor greenColor].CGColorrange:NSMakeRange(5, 2)];//改变attributed的字体[attriString addAttribute:(NSString *)kCTFontAttributeName value:(id)CFBridgingRelease(CTFontCreateWithName((CFStringRef)[UIFont boldSystemFontOfSize:12].fontName, 20, NULL)) range:NSMakeRange(8, 10)];//给string加上下划线[attriString addAttribute:(NSString *)kCTUnderlineStyleAttributeNamevalue:(id)[NSNumber numberWithInt:kCTUnderlineStyleDouble]range:NSMakeRange(19, 6)];label.attributedText = attriString;

##属性设置当然,经过上面三部还只能简单的显示,如果需要一些额外的效果就需要设置一些属性了。###文本对齐文本对齐有两个属性textHorizontalAlignment和textVerticalAlignment,从字面意思就可以看出两个属性分别的作用。这两个属性分别对应下面两个枚举:

typedef enum : NSUInteger {XPQLabelHorizontalAlignmentLeft,      // 左对齐XPQLabelHorizontalAlignmentCenter,    // 水平居中XPQLabelHorizontalAlignmentRight,     // 右对齐} XPQLabelHorizontalAlignment;typedef enum : NSUInteger {XPQLabelVerticalAlignmentUp,          // 垂直居上XPQLabelVerticalAlignmentCenter,      // 垂直居中XPQLabelVerticalAlignmentDown,        // 垂直居下} XPQLabelVerticalAlignment;

使用效果如下图:

对齐效果图

###路径只需设置这个属性就能让文字沿着指定路径显示。路径是XPQLabelPath对象,XPQLabelPath的使用也非常简单。先使用XPQLabelPath的pathForBeginPoint方法创建路径起点。

XPQLabelPath *path = [XPQLabelPath pathForBeginPoint:CGPointMake(10.0, 10.0)];

再使用addLineToPoint:/addArcWithCentrePoint:angle:/addCurveToPoint:anchorPoint:来添加路径。

// 添加直线[path addLineToPoint:CGPointMake(250.0, 50.0)];// 添加圆曲线[path addArcWithCentrePoint:CGPointMake(90.0, 70.0) angle:-M_PI];// 添加贝塞尔曲线[path addCurveToPoint:CGPointMake(300.0, 60.0) anchorPoint:CGPointMake(100.0, 0.0)];

最后再把路径赋值给path属性或者使用setPath:rotate:animation:方法

// 带旋转和动画label.path = path;// 旋转和动画可选择[label setPath:path rotate:rotate animation:animation];

效果图如下:

路径效果图

###手势轨迹这是一个很酷炫的功能(然而并没什么卵用)。设置gesturePathEnable为YES后用手在XPQLabel上滑动,文字会根据手指滑动的轨迹显示,效果图如下:

手势轨迹效果图

###入场出场动画暂时只实现两种入场出场动画,调用函数分别为startShowWithDirection:duration:bounce:stepTime:startHideWithDirection:duration:stepTime:

动画1

startFixedShowWithTransform: duration:stepTime:startFixedHideWithTransform:duration:stepTime:

动画2

PS: 如果感觉写的不错请star下,谢谢。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap