UIImageView+UILabel+UIButton的小Demo--超级猜图

原创 2017年03月28日 09:56:22


利用UIImageView+UILabel+UIButton做的一个小程序:


首先要实现各个控件的静态布局,要做好每个设备的适配。
因为我是小白,不太懂其他的适配方法,我就用比例来适配。
比如说:就6s的屏幕   375 x 667 的宽高来说,中间大图的宽高固定是182.5 x 182.5 那么宽对于屏幕的比例就是 182.5/375=0.5  ,高和宽一样。
即宽高  都为:

[UIScreen mainScreen].bounds.size.width * 0.5

用这种比例的方式来布局控件,就可以解决适配的问题

一般来说,先固定一个按钮的比例位置(也可以是绝对位置),然后其他的控件相对于这个控件来布局即可


点击下面被选按钮,会把文字传到答案选项框里面,且被选按钮文字隐藏,如果答案错了,答案选项框字体为红色。

实现的思路:
前提:答案按钮4个button是放在一个view里面的,被选答案按钮button也全是放在另一个view里面
点击被选答案按钮时候,遍历答案的view里面的UIButton,如果UIButton.currentTitle.lenght == 0的话,就把被选答案的当前文字设置为答案按钮的文字。然后被选答案隐藏起来。


如果被选答案全对,那么答案区域的字体就显示橙色字体,过0.5秒后自动到下一题,并且分数增加10分。
实现思路:
遍历答案区域的按钮的文字,然后记录下来,然后跟已经转化成模型的当前答案比较,对的话字体就显示橙色并且加10分。分数机制可以自己设置。


点击图片会放大,并且背景半透明白色。点击背景或者图片,还原图片的位置。
实现思路:
图片后面其实就是加了一个UIButton(遮罩)而已,然后设置这个UIButton的宽为屏幕的宽,高为屏幕的高,背景颜色为white,alpha为0.        
 当UIButton的alpha为0时候,然后把当前ImageView的frame设置为

CGRectMake(0, (ScreenHeight -ScreenWidth)*0.5,ScreenWidth,ScreenWidth);然后这是UIButton的alpha为0.5,然后把ImageView加到self.view的最上层。(

[self.viewbringSubviewToFront:self.bigImage];

ScreenWidth和ScreenHeight是屏幕宽高,我自定义过了。为什么要这样设置frame? 不要问为什么,就问你这样设置出来效果好看不?

当UIButton的alpha为0.5时候,还原当前ImageView原来的frame(可以临时保存他原来的frame)。然后设置UIButton的alpha为0.


除了这种方法之外,也可以用UITapGestureRecognizer来实现。这里就不赘述,可以自己改变来试试。


PS:无论用哪种方法,当ImageView还原到原来位置的时候,他处于视图层的位置和原来不一样了。这个Demo看不出来效果,如果你要做九宫格的图片或者多张图片,也是用这种方法实现放大效果的话,那么会出现缩小的图片也出现在放大图片的后面,而且还能点击。解决办法:可以先遍历self.view的子视图,仔细观察每个视图的frame的位置,你会发现因为他的视图层关系变化而导致的。可以直接把UIButton(遮罩)再加到self.view上面一次,强行改变他的视图层关系,就可以了。


个人觉得以上几点比较重要,其余的话,可以自己简单理解下。


此Demo仅供参考,小白写的不太好,忘见谅。


代码网址:https://github.com/HZhenF/Superguess.git
代码参考:点击打开链接








版权声明:本文为博主原创文章,未经博主允许不得转载。

相关文章推荐

IOS开发UI系列之常用控件 UILabel, UITextField, UIButton, UIImageView等常用属性与方法

IOS的UI开发中,一些常用的控件如UILabel,  UITextField,  UIButton,  UIImageView等都直接或间接继承于UIView     此处简单介绍这些控件的常用属...

UI基础-基础控件-0324-浏览图片案例与改进版(UILabel、UIButton、UIImageView的应用)

// MJViewController.m // 04-图片浏览器 // // Created by apple on 14-3-24. // Copyright (c) 2014年 itca...

iOS个人整理06-第一周小结,常用控件UIView,UILabel,UIImageView,UIButton,UITextField

一、UiView a.初始化方式:           ini

UIButton,UIImageView,UILabel,UITextField

第一、UIButton的定义        UIButton *button=[[UIButton buttonWithType:(UIButtonType);  能够定义的button类型有以...

基础控件之UILabel、UIButton、UITextField、UIAlertView、 UIImageView

基础控件之UILabel、UIButton、UITextField、UIAlertView、 UIImageView    UILabel: 标签控件,适合一些短的文本  UILable继承于...
  • xyj1204
  • xyj1204
  • 2015年12月17日 21:00
  • 187

iOS UILabel UIButton UIImageView使用方法

关于 UILabel UIButton UIImageView 进阶使用 大神绕行

iOS基本常用控件总结(UIView,UILabel,UIButton,UIImageView)

iOS开发中基本常用控件UIView, UILabel, UIButton, UIImageView的属性和方法的小总结

UIView UILabel UITextField UIButton UIImageView 常用属性

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(20, 40, 80, 30)]; //    背景颜色     label....

Swift - UIView,UILabel,UIButton,UIImageView

学习Swift没少查资料,但是发现网上都是对一些基础语法的介绍,还有些看不明白的,博主觉得么,没必要看的那么详细,等使用中自然就会懂了。但是使用的时候,我们最常用的UIView,UILabel,UIB...

UILabel、UITextField、UIButton、UIImageView控件

//一、UIlabel标签控件   //1.开辟空间并初始化     UILabel *label=[[UILabel alloc]initWithFrame:CGRectMake(0, 0, 100...
  • Wulitc
  • Wulitc
  • 2015年12月31日 20:11
  • 351
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:UIImageView+UILabel+UIButton的小Demo--超级猜图
举报原因:
原因补充:

(最多只允许输入30个字)