#ZBImageTextEngine

起因

为了解决图文混排的痛点,UI给你提各种"1像素"问题;

• space大小不正确问题;
• 富文本不同font对齐问题如:baselineOffset在8.0失效问题
• 不同font富文本,删除线无法居中问题;
• 富文本中有图片/web图问题;
• 富文本文字后面有图片切点九图问题;
• 富文本文字后面有边框样式问题;
• 富文本文字/图片有事件
• 写富文本代码啰嗦; ...

Features

• 图文混排

How To Use

• space

[self.spaceLabel zb_makeContexts:^(ZBImageTextMaker *make) {make.text(@"丨");make.space(10);make.text(@"丨");make.space(20);make.text(@"丨");make.space(30);make.text(@"丨");
}];
复制代码

• image

[self.imageLabel zb_makeContexts:^(ZBImageTextMaker *make) {make.image([UIImage imageNamed:@"Canada_28"]);make.image([UIImage imageNamed:@"Canada_28"]).size(CGSizeMake(20, 20));make.image([UIImage imageNamed:@"img_empty"]).size(CGSizeMake(40, 40)).border([ZBImageTextItemBorder borderWithRadius:20]);make.image([UIImage imageNamed:@"img_empty"]).size(CGSizeMake(40, 40)).border([ZBImageTextItemBorder borderWithColor:[UIColor redColor] width:5 radius:10]);make.image([UIImage imageNamed:@"img_empty"]).size(CGSizeMake(40, 40)).border([ZBImageTextItemBorder borderWithColor:[UIColor redColor] width:1 radius:3 margin:UIEdgeInsetsMake(3, 3, 3, 3)]);make.image([UIImage imageNamed:@"img_empty"]).size(CGSizeMake(40, 40)).url(@"http://b0.hucdn.com/img/country_new/ct_18.png");
}];
复制代码

• text

[self.textLabel zb_makeContexts:^(ZBImageTextMaker *make) {make.text(@"优惠券");//指定font,colormake.text(@"优惠券").font([UIFont systemFontOfSize:20]).color([UIColor redColor]);//删除线make.text(@"优惠券").decoration([ZBImageTextItemDecoration decoration]).baselineFont([UIFont systemFontOfSize:30]);//有背景的文字,图片会点九拉伸make.text(@"优惠券").font([UIFont systemFontOfSize:20]).color([UIColor redColor]).offset(0.6).bg([ZBImageTextItemBackground bgWithImage:[UIImage imageNamed:@"bg01"] margin:UIEdgeInsetsMake(2, 5, 2, 5)]);//有边框的文字make.text(@"下单立减10元").font([UIFont systemFontOfSize:20]).color([UIColor redColor]).color([UIColor redColor]).border([ZBImageTextItemBorder borderWithColor:[UIColor redColor] width:0.5 radius:2 margin:UIEdgeInsetsMake(2, 3, 2, 3)]);
} globalConfig:@{@"baselineFont": [UIFont systemFontOfSize:30]}];
复制代码

help

1. 如何垂直调整

make.text(@"优惠券").offset(10);
复制代码

2.hook

使用block

typedef void(^ZBImageTextBlock)(id obj);
复制代码

example:

• ZBImageTextItem

//ZBImageTextBlock imageViewBlock = data[@"imageView"] ? : nil;
//ZBImageTextBlock itemBlock = data[@"item"] ? : nil;make.image([UIImage imageNamed:@"img_empty"]).width(14).height(14).config(@{ @"imageView" :^(UIImageView *imageView) {
NSLog(@"%@",imageView);
}});复制代码

• ZBImageTextItem

//ZBImageTextBlock imageViewBlock = data[@"imageView"] ? : nil;
//ZBImageTextBlock itemBlock = data[@"item"] ? : nil;
//ZBImageTextBlock textLayerBlock = data[@"textLayer"] ? : nil;
复制代码

Installation

platform :ios, '8.0'pod 'ZBImageText'
复制代码

github

github.com/k373379320/…

补充

有啥问题可以提issues/留言,改善和补充~