IOS开发-UIImageView基本用法
阅读原文时间:2023年08月31日阅读:1

UIImageView是iOS中用于显示图像(图片、gif、svg等)的视图。

它的主要功能有:

1. 显示图片
UIImageView可以通过image属性显示一张UIImage类型的图片。可以是本地图片、从网络下载的图片等。

2. 设置填充模式
可以通过contentMode属性设置图片在UIImageView内的显示和填充模式。内容模式有:- scaleToFill:拉伸填充整个imageView
- scaleAspectFit:保持纵横比缩放适应imageView
- scaleAspectFill:保持纵横比缩放填充满imageView
- top、bottom、left、right:拉伸填充指定方向
- center:居中不拉伸显示

3. 设置多种交替动画
可以通过animationImages和animationDuration设置多张图片的交替动画。
或者配置UIImageViewAnimation方式来实现更为复杂的动画。

4. 支持用户交互
UIImageView支持用户交互事件,可以得到点击、拖动等事件。

5. 实现自适应布局
UIImageView支持Auto Layout,可以自动适应不同屏幕尺寸。

1. 创建UIImageView实例:

UIImageView \*imgview = \[\[UIImageView alloc\] init\];

2.设置UIImageView的布局信息:

imgview.frame =CGRectMake((self.view.frame.size.width-100)/2, (self.view.frame.size.height-100)/2, 100, 100);

3. 设置image属性,显示图片:

imgview.image = [UIImage imageNamed:@"icon"]

这里需要使用UIImage类的imageNamed方法传入图片的名称来生成图片,然后赋给imgview的image属性。

效果图:

4. 设置contentMode属性,控制图片缩放模式:

imageView.contentMode = UIViewContentModeScaleToFill; // 充满
imageView.contentMode = UIViewContentModeScaleAspectFit; // 完整显示
imageView.contentMode = UIViewContentModeScaleAspectFill; // 完整充满这里不做演示。就是三个枚举只,分别用来设置不同的展示方式

5. UIImageView设置圆角的方式

第一种方法:通过设置layer的属性

最简单的一种,但是很影响性能,一般在正常的开发中使用很少.

//设置圆角
imgview.layer.cornerRadius = imgview.frame.size.width / 2;
//将多余的部分切掉
imgview.layer.masksToBounds = YES;

效果:

第二种方法:使用贝塞尔曲线UIBezierPath和Core Graphics框架画出一个圆角

//开始对imageView进行画图
UIGraphicsBeginImageContextWithOptions(imgview.bounds.size, NO, 1.0);
//使用贝塞尔曲线画出一个圆形图
[[UIBezierPath bezierPathWithRoundedRect:imgview.bounds cornerRadius:imgview.frame.size.width] addClip];
[imgview drawRect:imgview.bounds];
imgview.image = UIGraphicsGetImageFromCurrentImageContext();
//结束画图
UIGraphicsEndImageContext();

第三种方法:使用CAShapeLayer和UIBezierPath设置圆角

首先需要导入<AVFoundation/AVFoundation.h>

UIBezierPath *maskPath = [UIBezierPath bezierPathWithRoundedRect:imgview.bounds byRoundingCorners:UIRectCornerAllCorners cornerRadii:imgview.bounds.size];

    CAShapeLayer \*maskLayer = \[\[CAShapeLayer alloc\]init\];  
    //设置大小  
    maskLayer.frame = imgview.bounds;  
    //设置图形样子  
    maskLayer.path = maskPath.CGPath;  
    imgview.layer.mask = maskLayer;

效果图:

这三种方法中第三种最好,对内存的消耗最少,而且渲染快速

手机扫一扫

移动阅读更方便

阿里云服务器
腾讯云服务器
七牛云服务器

你可能感兴趣的文章