iOS开发UI篇 - 图片优化
1.图片是否缓存
代码示例:
@interface ViewController ()
@property (nonatomic, retain) UIImageView *photoImage;
@end
//创建imageView
- (void)creatImageView {
self.photoImage = [[UIImageView alloc] initWithFrame:CGRectMake(40, 40, 240, 400)];
//添加到父视图
[self.view addSubview:_photoImage];
//释放
[_photoImage release];
}
//图片缓存
- (void)aboutImageCache {
//是否缓存图片, 就是说是否把图片存入到缓存中
//获取图片方式一
//缺点: 第一次使用时检索比较麻烦(浪费时间)
//优点: 这种方式会在内存中拷贝一份, 以后我运行时就直接从缓存中读取图片(节省时间)
self.photoImage.image = [UIImage imageNamed:@"girl.png"];
//获取图片方式二
//优点: 查找的时候比较方便, 通过路径来查找(节省时间)
//缺点: 每次使用都会从路径中来查找(浪费时间)
self.photoImage.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"girl.png" ofType:nil]];
}
2.图片阴影的设置, 根据贝塞尔曲线能够设置四个方向上的阴影
示例代码:
//图片阴影
- (void)shadowOfImage {
//设置图片
self.photoImage.image = [UIImage imageNamed:@"girl.png"];
//shadowColor阴影颜色
self.photoImage.layer.shadowColor = [UIColor blackColor].CGColor;
//阴影偏移量
self.photoImage.layer.shadowOffset = CGSizeMake(0, 0);//默认(0, -3), 这个跟shadowRadius配合使用
//阴影透明度, 默认0
self.photoImage.layer.shadowOpacity = 1;
//阴影半径, 默认3
self.photoImage.layer.shadowRadius = 3;
//先获取photoImage的bounds属性, 以便于下面的使用和修改
float width = self.photoImage.bounds.size.width;
float height = self.photoImage.bounds.size.height;
float x = self.photoImage.bounds.origin.x;
float y = self.photoImage.bounds.origin.y;
float addWH = 10;//阴影宽度
//路径阴影, 贝塞尔曲线
UIBezierPath *path = [UIBezierPath bezierPath];
//设置贝塞尔曲线绘制路径
CGPoint topLeft = self.photoImage.bounds.origin;
CGPoint topMiddle = CGPointMake(x + (width / 2), y - addWH);
CGPoint topRight = CGPointMake(x + width, y);
CGPoint rightMiddle = CGPointMake(x + width + addWH, height / 2 + y);
CGPoint bottomRight = CGPointMake(x + width, y + height);
CGPoint bottomMiddle = CGPointMake(x + width / 2, y + height + addWH);
CGPoint bottomLeft = CGPointMake(x, y + height);
CGPoint leftMiddle = CGPointMake(x - addWH, y + height / 2);
//设置起始位置
[path moveToPoint:topLeft];
//添加四个二元曲线
[path addQuadCurveToPoint:topRight controlPoint:topMiddle];
[path addQuadCurveToPoint:bottomRight controlPoint:rightMiddle];
[path addQuadCurveToPoint:bottomLeft controlPoint:bottomMiddle];
[path addQuadCurveToPoint:topLeft controlPoint:leftMiddle];
//设置图片阴影路径
self.photoImage.layer.shadowPath = path.CGPath;
}
3.图片大小的绘制. 有些情况下, UIImageView和UIImage的大小不合适, 就会出现显示不全, 或者拉伸现象, 影响视觉体验. 不过我们通过具体的方法来绘制图片, 来杜绝这种情况的出现
给UIImage添加类目的方法, 传入要修改的图片, 和要适配的尺寸(宽高), 就可以绘制图片了.
示例代码:
#import@interface UIImage (DrawRect)
+ (UIImage *)imageWithImage:(UIImage *)image scaledToSize:(CGSize)newSize;
@end
#import "UIImage+DrawRect.h"
@implementation UIImage (DrawRect)
+ (UIImage *)imageWithImage:(UIImage *)image scaledToSize:(CGSize)newSize {
//创建图片上下文
UIGraphicsBeginImageContext(newSize);
//将旧的图片根据新图形的大小绘制到上下文
[image drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
//根据上下文获取到新的图片
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
//结束绘制
UIGraphicsEndImageContext();
//返回新的图片
return newImage;
}
@end
4.图片的拉伸绘制.
将一张小的背景图片进行拉伸, 拉伸到自己想要的尺寸(微信聊天的气泡)
示例代码:
//图片绘制
- (void)drawImage {
//创建Label
//1.创建对象
UILabel *aLabel = [[UILabel alloc] initWithFrame:CGRectMake(15, 5, 200, 300)];
aLabel.text = @"蓝鸥是美国苹果AATC官方认证培训机构,是中国先进的移动互联网研发实训基地,致力于iOS开发、Unity3D游戏开发、Android开发、html5开发等人才的培养,独创“FCBS”实训体系,以真实的企业级项目打造高薪技术人才,学员上线项目1000+.选蓝鸥,学尖端的IT技术,从此走上人生巅峰";
//行数
aLabel.numberOfLines = 0;
//换行方式
aLabel.lineBreakMode = NSLineBreakByCharWrapping;
//添加到父视图
[self.photoImage addSubview:aLabel];
UIImage *image = [UIImage imageNamed:@"bubbleSomeone"];
//第一个参数图形上, 左, 下, 右从具体的那个位置开始拉伸
//第二个参数图片拉伸方式
UIImage *im = [image resizableImageWithCapInsets:UIEdgeInsetsMake(13, 16, 13, 16) resizingMode:UIImageResizingModeStretch];
//重新设置拉伸处理好的图片
self.photoImage.image = im;
//重新调整imageView的大小
self.photoImage.frame = CGRectMake(30, 30, 220, 300);
}
