UIView/视图&&UIImageView/图片视图

【项目实战】 改造原前端ViewUI框架,使其支持ElementUI 与 Avue 因为原来前端的同事习惯用,ViewUI框架,于是基线版本的项目,都是使用的ViewUI框架搭建的。 但是,这个ViewUI的表格,是引用的第三方的vux的框架,在网上很少人使用,所以遇到问题,基本上没有人解答。 只能请教原前端同事作者,反正就是对我们这种半吊子前端开发者非常之不友好 于是,在了解了ElementUI和Avue框架之后,就坚定了要改造的信念,于是便有了下面这篇文章~ 阅读详情

UIView

UIView是所有视图的父类,UIView的属性和方法,就是所有视图的属性和方法



一.关于坐标系的属性和方法

@property(nonatomic) CGRect            frame;

@property(nonatomic) CGRect            bounds; 

@property(nonatomic) CGPoint           center; 

@property(nonatomic) CGAffineTransform transform; 

属性修饰符 atomic表示原子操作,即set方法get方法不可被其他线程中断 atomic是缺省属性;

iOS的UIKit框架下的视图属性默认都是 nonatomic,非原子操作 。

1、创建一个UIView视图

UIView *view=[[UIView alloc] initWithFrame:CGRectMake(100, 100, 100, 100)];

2、设置view的背景色

view.backgroundColor=[UIColor redColor];

3、设置center属性,中心点坐标(设置view至正中心)

view.center=self.view.center;

4、设置view的bounds,相对于本视图坐标系,默认的为左上角为(0,0)

view.bounds=CGRectMake(0, 0, 50, 50);

5、让view的尺寸变形

两个参数是浮点型,它是变形后和变形前的横纵的百分比

view.transform=CGAffineTransformMakeScale(0.5, 2);

6、让角度变形

view.transform=CGAffineTransformMakeRotation(M_PI_2/4);

7、把view放到controller

[self.view addSubview:view];

[view release];



二.关于父子视图关系的属性和方法

【注】任何视图,都可以添加到另一个视图上面,但是每个视图只能有一个父视图。也就是说一个子视图被添加到另一个视图上,会从原父视图上脱离。

【注】子视图的坐标是相对于父视图的。以父视图左上角一点为原点,缺省原点为(0,0)点。移动父视图,因为子视图的位置是相对的,所以会一起移动。

@property(nonatomic,readonly) UIView       *superview;

@property(nonatomic,readonly,copy) NSArray *subviews;

@property(nonatomic,readonly) UIWindow     *window;

1、默认hidden为隐藏属性,默认为NO

父视图隐藏,那么子视图也会跟着一起隐藏(父子隐藏)

superView.hidden=YES;

2、边界裁剪,会裁掉超出父视图那部分

superView.clipsToBounds=YES;

3、alpha 透明度,默认为1

如果改变了父视图的透明度,那么子视图的也会改变

superView.alpha=0.6;




三.关于同父视图的子视图的层次关系

传入子视图地址,将子视图拿到最上层

1、把某个子视图放到最前面

[self.view bringSubviewToFront:redLabel];    

2、把某个子视图放到最后

[self.view sendSubviewToBack:blueLabel];/    

3、交换两个子视图的位置(挡没挡住),第一个参数如果还不是父视图的子视图,会被添加上去,如果是子视图,那么只改变层次关系(上)

[self.view insertSubview:yellowLabel aboveSubview:redLabel];    

4、交换两个子视图的位置,第一个参数如果还不是父视图的子视图,会被添加上去,如果是子视图,那么只改变层次关系(下)

[self.view insertSubview:yellowLabel belowSubview:redLabel];

5、为两个子视图换一个位置,两个参数是视图的序号

[self.view exchangeSubviewAtIndex:0 withSubviewAtIndex:1];




四.层次与事件接收

1.父视图不能接收事件,则子视图无法接受事件。

2.子视图超出父视图的部分,不能接收事件。

3.同一个父视图下,最上面的视图,首先遭遇事件,如果能够响应,就不向下传递事件。如果不能响应,事件向下传递。

4、这个是控制是否可以接收事件,或者可以响应,(UIView的属性,默认是打开的YES);

label也有这个属性,但是他的这个属性默认是关闭的;

UIImageView也是UIView,他同样有这个属性,他的属性默认是关闭的

button.userInteractionEnabled=YES;

5、裁剪,边界裁剪,如果打开这个属性,父视图会裁剪子视图超出父视图那部分,默认为NO

superView.clipsToBounds=YES;




五.UIView动画

【注】UIView动画只能修改关于坐标系的属性,以及色彩和透明度。

1、启动动画

[UIView beginAnimations:nil context:nil];

2、设置动画启动的延迟时间

[UIView setAnimationDelay:3];

3、设置动画持续的时间,也就是完成的时间

[UIView setAnimationDuration:10];

4、设置动画的委托

[UIView setAnimationDelegate:self];

5、设置回调方法

[UIView setAnimationDidStopSelector:@selector(stopAnimation)];

6、执行动画

[UIView commitAnimations];

7、通过block方式实现动画

    void(^animationBlock)(void)=^(void)

    {

        view.frame=self.view.bounds;

        view.backgroundColor=[UIColor blueColor];

    };

    void(^completionBlock)(BOOL finished)=^(BOOL finished){

        [UIView animateWithDuration:5 delay:0 options:0 animations:^{

            view.frame=CGRectMake(150, 230, 20, 20);

            view.backgroundColor=[UIColor redColor];

        }completion:nil];

    };

第一个参数是持续时间,第二个参数是动画启动的延迟时间,第三个默认0,第四个参数是block,在这里我们来实现我们的动画,第五个block是完成的block

[UIView animateWithDuration:10 delay:2 options:0 animations:animationBlock completion:completionBlock];




六.停靠模式

【注】停靠模式,是控制父视图改变大小时,子视图的变化方式。

【注】停靠模式并非服务于视图缩放,使用transform属性scale视图,根本是等比缩放,子视图也会等比缩放。停靠模式是服务于父视图边界修改后,子视图的重新布局。

1、设置停靠模式

上边距自由调整,下边距自由调整,高度不变

subView.autoresizingMask=UIViewAutoresizingFlexibleTopMargin|UIViewAutoresizingFlexibleBottomMargin;

UIViewAutoresizingNone                               = 0,                没有变化

UIViewAutoresizingFlexibleLeftMargin        = 1 << 0,       自由调整左边距,保持右边距不变

UIViewAutoresizingFlexibleWidth                 = 1 << 1,       自由调整宽距,保持左右边局部不变

UIViewAutoresizingFlexibleRightMargin      = 1 << 2,       自由调整右边距,保持左边距不变

UIViewAutoresizingFlexibleTopMargin        = 1 << 3,       自由调整上边距,保持下边距不变

UIViewAutoresizingFlexibleHeight               = 1 << 4,        自由调整高度,保持上下边距不变

UIViewAutoresizingFlexibleBottomMargin  = 1 << 5,        自由调整下边距,保持上边距不变

2、创建滑块视图

UISlider *slider=[[UISlider alloc] initWithFrame:CGRectMake(10, 400, 280, 20)];

3、设置滑块视图最大值

slider.maximumValue=1;

4、设置滑块视图最小值

slider.minimumValue=0;

5、滑块初始位置

slider.value=1;

6、为滑块视图添加事件

[slider addTarget:self action:@selector(valueChanged:) forControlEvents:UIControlEventValueChanged];






UIImageView

图片视图 UIImage  UIImageView

【注】UIImage和UIImageView的关系,近似于NSString和UILabel的关系。

1、创建UIImageView,也是继承于UIView

UIImageView *imageView=[[UIImageView alloc] initWithFrame:CGRectMake(200, 200, 50, 50)];

imageView.backgroundColor=[UIColor blueColor];

imageView.center=self.view.center;

[self.view addSubview:imageView];

[imageView release];

2、类方法创建image

(1)UIImage *image=[UIImage imageNamed:str];

(2)NSString *path=[NSString stringWithFormat:@“照片名”];

NSString *filePath=[[NSBundle mainBundle] pathForResource:path ofType:@"jpg"];

UIImage *image=[UIImage imageWithContentsOfFile:filePath];

3、(1)设置图片数据(这个数据一定是UIImage类型)

NSMutableArray *imageArray=[[NSMutableArray alloc] init];

把图片放到了我们图片数组里

for (int i=1; i<=12; i++) {

NSString *str=[NSString stringWithFormat:@"player%d.png",i];

UIImage *image=[UIImage imageNamed:str];

[imageArray addObject:image];

}

imageView.animationImages=imageArray;

(2)imageView.image=image;

4、设置我们动画的持续时间,我在多少秒内完成我的图片切换

imageView.animationDuration=3;

5、重复执行的次数,如果为0,无限次循环

imageView.animationRepeatCount=0;

6、启动动画

[imageView startAnimating];

7、停止动画

[imageView stopAnimating];




例题:会飞的鸽子


iOS UIView动画效果详解及示例代码 在iOS中,UIView动画使用的是块动画(Block-based Animation)的方式,即通过block语法来定义动画的开始和结束状态。在动画过程中,系统会自动地根据起始状态和结束状态之间的差异来计算出动画的中间状态,从而实现平滑的过渡效果。同时,为了实现更复杂的动画效果,开发者可以结合UIView的其他属性和方法进行操作,例如使用关键帧动画、动画组等。同时,UIView动画还支持设置动画的持续时间、重复次数、延迟等参数,以及添加动画的过渡效果。在动画完成后,会执行指定的完成处理代码,这里通过。 阅读详情

相关推荐

Li‘s 核磁共振影像数据处理-4-使用3D Slicer从DTI计算参数图(FA、ADC等)

从DTI计算参数图 通过3D Slicer软件计算 主要步骤 导入DICOM影像 3D Slicer似乎只能支持DICOM格式和NRRD格式的DTI处理,而无法支持NIFTI+磁场梯度信息文件的方式。(这里不确定,如有错误请指正。) 模块选择: 需要选择或设置的内容包括:选择DicomToNrrd,设置Output DWI Volume file,设置Input Dicom Data Directory。设置好后点击“Apply”。 制作mask。 实质就是去脑壳。 模块选择: 需要设置的内

weixin_38594676的博客 3921

业务后台商业组件ViewUI(iView)入门

ViewUI(iView)入门教学

qq_55917018的博客 7140

保姆级教程:Synology NAS共享文件夹从创建到权限设置的完整流程

本文提供了一份详尽的Synology NAS共享文件夹创建与权限设置指南。重点讲解了如何将NAS接入企业AD域,并利用域管理员账户进行集中身份验证和权限管理。文章从基础概念、域环境配置、文件夹创建、精细化权限分配到客户端访问与维护,完整覆盖了构建安全高效企业级文件共享空间的全流程,旨在帮助管理员实现便捷的团队协作与数据安全管理。

u9v0w的博客 556

10_前端笔记-ViewUI

文章目录安装ViewUIiview admin 个人博客 https://blog.youkuaiyun.com/cPen_web ViewUI官网 https://www.iviewui.com/docs/introduce 用vue写的 ui框架:View UI 安装ViewUI 步骤:首先 创建新的项目 15334@LAPTOP-5GGR0QTF MINGW64 /e/cpen-frond/cpen-front/8、iview $ vue create viewui-proj 步骤:然后 安装 viewui

cPen_web的博客 3694

Python模拟发送SOME/IP消息(Scapy模块)

SOMEIP提供服务、订阅、响应、通知等Python代码示例

liluo0815481的博客 3069

RANSAC地面点分割:从原理到C++实战优化

本文深入解析RANSAC算法在点云地面分割中的原理与C++实战优化,涵盖动态迭代次数、自适应阈值等关键技巧,通过并行计算和内存访问优化提升性能,适用于激光雷达点云处理。

weixin_29015051的博客 277

【亲测免费】 探索优雅前端设计:ViewUI——一个高效、灵活的组件库

探索优雅前端设计:ViewUI——一个高效、灵活的组件库 项目简介 是由 ViewDesign 团队开发的一款开源前端 UI 框架,旨在提供一套简洁、易用且功能强大的组件库,以帮助开发者快速构建高质量的 Web 应用。该项目自发布以来,已获得了众多开发者的好评,其丰富的组件和优秀的性能为前端开发带来了极大的便利。 技术分析 ViewUI 基于现代化的前端技术栈构建,主要采用: React.js ...

gitblog_00094的博客 942

用Python实现一个简单的远程桌面服务端和客户端

本文介绍了一个基于Python的轻量级远程桌面解决方案,针对商业软件在嵌入式系统上的兼容性问题、性能问题和成本问题。系统采用客户端-服务端架构,包含两个通信通道:5000端口传输压缩视频流,5001端口传输控制事件。通过多线程设计、图像压缩(JPEG+zlib)和网络优化(禁用Nagle算法)等技术手段提高性能。服务端实现了高效的屏幕捕获(使用mss库)、图像处理流水线和事件处理逻辑。客户端采用PyQt5构建UI界面,包含视频接收线程以减少主线程负担。该方案具有跨平台、开源免费、轻量级(核心代码不到500行

Hi20240217的博客 1665

ViewUI高保真 原型元件库操作指南

ViewUI元件库按照ViewUI官网样式和风格进行设计,提供完全与viewUI的兼容的元件库。级别功能如下: 基础:色彩、字体、按钮、图标; 布局:栅格、布局、列表、卡片、折叠面板、分割线、单元格、宫格、描述列表、页头; 导航:导航菜单、标签页、下拉菜单、分页、面包屑、徽标数、锚点、步骤条、加载进度条、标签选择器; 表单:输入框、单选框、多选框、开关、表格、选择器、自动完成、滑块、日期选择器、时间选择器、级联选择、穿梭框、数字输入框、评分、上传、颜色选择器、表单; 统计图:包含折线图、柱状图、条

游泳的鱼的专栏 1080

ROS中costmap_converter插件的配置与使用

在学习TEB算法的过程中,作者提供了一个插件用于转换代价地图,原始的代价地图是由栅格地图中单元格组成,用于表示障碍物,但单元格占用的计算资源较大,故采用插件将单元格转换成点,线,多边形表示。 插件激活 rospack plugins --attrib=plugin costmap_converter 配置cfg文件 在导航配置文件下,新建costmap_converter_params.yaml #######################################################

weixin_42621524的博客 5905

Vue3 - Element Plus上传组件el-upload上传多个文件时,让on-change监听事件仅执行一次并获取最终文件列表方法(开启多选文件并手动上传,拿到文件列表统一循环调用接口上传)

vue3,elementplus,Upload上传,el-upload,文件上传组件,上传组件on-change里执行多次,取消自动上传后change重复执行问题,upload上传多个文件后导致on-change执行多次拿不到最终文件列表,Element-plus的upload组件on-change不断执行怎么办,上传多个文件多次执行调用,上传多个文件时如何只执行一次on-change方法拿到最终的文件列表,vue3elementplus上传组件开启多个上传后导致change方法执行好几次,仅调用一

🏆 前端领域优质创作者 1万+

UIView相关总结

CALayer内部创建backingstore(CGContextRef) 一般在drawRect方法中可以通过上下文堆栈取出栈顶的Context,拿到当前视图或控件的上下文,然后该layer会判断是否有delegate,若无则调用[CALyer drawInContext:],若有调用[layer.delegate drawLayer:inContext:]做当前视图的绘制工作,这步发生在系统内部,在合适时机给予一个回调方法[UIView drawRect:],开这个口子允许做一些其他绘制工作;

idealPC的专栏 573

48-OpenCVSharp —-Cv2.MatchTemplate() 函数功能(模板匹配)详解

是 OpenCV 中一个常见且简单的模板匹配算法,适用于目标检测和图像识别中的静态场景。它的优点是易于理解和实现,但在面对旋转、尺度变化、复杂背景或光照变化等挑战时,效果可能大打折扣。在这些情况下,结合多尺度图像、特征匹配算法(如 SIFT、SURF、ORB 等)以及深度学习模型可以显著提高匹配的鲁棒性和精度。模板匹配仍然是一个非常基础但强大的工具,适用于一些简单的图像匹配任务。对于更加复杂和动态的图像识别任务,我们通常会使用其他更加复杂的算法或者深度学习模型来处理。

weixin_45590420的博客 4523

UIView详解

UIView表示屏幕上的一块矩形区域,它在App中占有绝对重要的地位,因为IOS中几乎所有可视化控件都是UIView的子类。负责渲染区域的内容,并且响应该区域内发生的触摸事件 UIView的功能 1.管理矩形区域里的内容2.处理矩形区域中的事件3.子视图的管理 4.还能实现动画  UIView的子类也具有这些功能 下图就是视图的内层次

承影 3万+

win10 跳过U8环境检测的IE WebControls.rar

win10 安装u8的时候 提示IE WebControls 不通过,这个工具可以欺骗u8的检查。 跳过U8环境检测的IE WebControls。提示导入失败后,重新检测通过。

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

UIView

UIView生命周期 本文系从外网翻译而来,在此附上原作者链接???? [view-lifecycle-ios]: https://candost.blog/view-lifecycle-in-ios/ “感谢” ios中view的生命周期 在学习啦application的生命周期后,view的生命周期对与iOS的开发者来说是另一个非常重要的事情 每一个view都是用stroyboard,xibs,或者programmaatic创建的。从这些方法中脱离出来,真正理解view是什么时候被created,lo

缄默的博客 637

RU DOS版、EFI版32bit/64bit BIOS常用工具

DOS版、EFI版的RU工具,可用来查看IO、MEM、PCI、SMBIOS等资源。亲测在EFI SHELL下可用。

View UI的简介和基本使用

View UI(即原 iView) 是由 北京视图更新科技有限公司 开发的,面向中后台业务的一整套前端解决方案,包含了工程构建、主题定制、多语言等功能,极大提升了开发效率。 官网:https://www.iviewui.com/ 推荐使用NPM 安装进入你的vue项目中命令行输入 $ npm install view-design --save 然后在你的vue项目中的main.js中添加就行使...

MW 1万+

复分析 阿尔福斯(Ahlfors) 第三版答案 英文

答案分为十章,有部分习题没有答案,全英文复分析阿尔福斯(Ahlfors) 第三版答案

OC语言学习——UI(一)

UIViewController是一个视图控制器,创建完视图控制器对象后,要对它进行赋值操作。视图控制器提供了许多控制器的基本功能,因为它是所有控制器的基类视图控制器负责创建和管理一组视图,它本身就提供了一个视图,称为该控制器的根视图(view),协调管理数据和视图之间的交互。3.将新建的视图加入到父视图中实现了两项功能:(1)将新建的视图显示到屏幕上(2)将新建的视图作为父视图的子视图来管理。3.视图的移动是通过定时器的方法里的事件函数实现的,也就是说,视图的移动要写在定时器调用的方法的事件函数里。

2301_80095702的博客 1967

UIView简介

目录UIView简介常见属性UIView 初始化实例常见方法sendSubviewToBack、bringSubviewToFront UIView简介 https://developer.apple.com/documentation/uikit/uiview?language=objc 官方解释:An object that manages the content for a recta...

guyindong的博客 463

View UI (iview)动态表单 使用教程

View UI,即原先的 iView,从 2019 年 10 月起正式更名为 View UI,并使用全新的 Logo 本文介绍 View UI (iview)动态表单的使用。在项目开发中,有些数据的数量是动态的,不确定的,可能是1条,也可能是多条。如人的证件,工作经历,项目经验等。在做这些数据的添加时就要使用动态表单 1、使用介绍 首先将 iview 官方的动态表单的代码全部复制出来,粘贴到项目里,看一下运行效果 代码如下 <template> <Form

悟世君子的博客 3896

【异步绘制】UIView刷新原理 与 异步绘制

UIView刷新原理、异步绘制、异步渲染

allanGold 1722

UIView你知道多少

      曾经有人这么说过,在iphone里你看到的,摸到的,都是UIView,所以UIView在iphone开发里具有非常重要的作用。那么UIView我们到底知道多少呢。请看看下面的问题, 如果这些你都知道,那么本文章的内容就请绕道,如果你还不太清楚,我想看了下面的内容,你就明白了。 1。bounds和frame分别表示什么? 2。ContentMode里UIViewContentMod...

weixin_34087503的博客 386

12个Vue UI 组件库

Vue.js 是一个渐进式 javascript 框架,用于构建 UIS(用户界面)和 SPA(单页应用程序)。UI 组件库提高了我们的开发效率,增强了应用的整体外观、感觉、交互性和可访问性,下面就来看看有哪些适用于 Vue 的 UI 组件库。

顺其自然~专栏 6530

Iphone中的UIView开发

曾经有人这么说过,在iphone里你看到的,摸到的,都是UIView,所以UIView在iphone开发里具有非常重要的作用。那么UIView我们到底知道多少呢。请看看下面的问题, 如果这些你都知道,那么本文章的内容就请绕道,如果你还不太清楚,我想看了下面的内容,你就明白了。 1。bounds和frame分别表示什么? 2。ContentMode里UIViewContentModeScale

amber_tear的专栏 1495

Android --- UI、View与布局

可以在XML布局文件中使用标记来定义各种视图,比如TextView(文本视图)、Button(按钮)、ImageView(图像视图)等。可以设置视图的属性,如大小、位置、颜色等。1.定义布局2.设置宽高3.设置背景颜色4.设置内容布局// 1.定义布局// 2.设置宽高// 3.设置背景颜色*/根据id找到按钮自定义一个类实现 View.OnClickListener 接口的类,重写里面的 onClick 方法。

weixin_43244083的博客 1115

vue3基础教程(3)——引入ui框架iview(viewui)

本系列文章由浅入深,从基础知识到实战开发,非常适合入门同学。HTML基础css基础js基础当然,即使从未接触过前端代码的小白,也能轻松学习本系列课程,因为我会在文章中简略穿插前端基础知识。由于各平台对专栏文章的支持度不同,所以如果您看到这篇文章的平台,系统学习专栏文章的操作不够丝滑,可以先关注小程序,后续小程序会开发专栏博客功能。可以直接搜索【中二少年工具箱】,也可通过二维码知乎地址二维码csdn地址二维码头条地址等入口进入,扫码关注。

关注前端,关注原创 2737
上一篇: NSTimer/定时器
下一篇: UITextField/文本输入框
TomLD
博客等级 码龄11年 1粉丝 28原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值