zoukankan      html  css  js  c++  java
  • iOS

    前言

    	NS_CLASS_AVAILABLE_IOS(2_0) @interface UIView : UIResponder <NSCoding, UIAppearance, UIAppearanceContainer, UIDynamicItem, UITraitEnvironment, UICoordinateSpace, UIFocusEnvironment>
    	
    	@available(iOS 2.0, *)		 public class UIView : UIResponder, NSCoding, UIAppearance, UIAppearanceContainer, UIDynamicItem, UITraitEnvironment, UICoordinateSpace, UIFocusEnvironment
    
    • 苹果将控件的共同属性都抽取到父类 UIView 中,所有的控件最终都继承自 UIView。UIView 最纯洁、最干净的控件,拥有尺寸、位置、背景色等基本属性。

    • view:翻译过来是页面的意思,iOS 有层的概念。

    1、View 的创建

    • UIView 创建出来默认是透明的,在 iOS6 的时候是白色的。

    • Objective-C

      	// 实例化 view 对象,并设置 view 大小
      	UIView *view = [[UIView alloc] initWithFrame:CGRectMake(10, 20, 200, 100)]; 
        	
      	// 将 view 加到 window 上显示出来
      	[self.view addSubview:view];
      
    • Swift

      	// 实例化 view 对象,并设置 view 大小
      	let view:UIView = UIView(frame: CGRectMake(10, 20, 200, 100))
      
      	// 将 view 加到 window 上显示出来
      	self.view.addSubview(view)
      

    2、View 的设置

    • Objective-C

      	// 设置 frame
      	/*
      		frame:控件矩形框在父控件中的位置和尺寸,以父控件的左上角为坐标原点
      	*/
      	view.frame = CGRectMake(10, 20, 200, 100);
      
      	// 设置 bounds
      	/*
      		bounds:控件矩形框的位置和尺寸,以自己左上角为坐标原点,所以 bounds 的 x、y 一般为 0
      	*/
      	view.bounds = CGRectMake(0, 0, 200, 100);
      
      	// 设置中心位置
      	/*
      	 	控件中点的位置,以父控件的左上角为坐标原点
      	*/
      	view.center = self.view.center; 
      	
      	// 设置背景颜色
      	view.backgroundColor = [UIColor greenColor];
      
      	// 设置背景颜色半透明
      	view.backgroundColor = [[UIColor blackColor] colorWithAlphaComponent:0.5];
      	
      	// 设置视图透明度
      	/*
          	范围:0.0 ~ 1.0 ,0.0 透明,1.0 不透明(默认)
          	视图上的文字等内容的透明度也同时被改变
       	*/
      	view.alpha = 1.0;
      
      	// 设置 tag 值
      	/*
      		用于区分不同的 view ,所有继承 view 的类对象都可以设置 tag 值
      	*/
      	view.tag = 100;
          
      	// 设置用户交互属性
      	/*
      		YES:打开用户交互属性,NO:关闭用户交互属性
      	*/
      	view.userInteractionEnabled = YES;  
             
      	// 设置圆脚边框
      	/*
      		cornerRadius:圆角半径
      		masksToBounds:子图层是否剪切图层边界,默认为 NO
      	*/
      	view.layer.cornerRadius = 20;
      	view.layer.masksToBounds = YES;
          
      	// 设置边框
      	/*
      		borderWidth:边框粗细
      		borderColor:边框颜色
      	*/
      	view.layer.borderWidth = 5;
      	view.layer.borderColor = [[UIColor blueColor] CGColor];    
          
      	// 不允许子视图的范围超过父视图的范围
      	/*
      		不允许 view 的子视图的范围超过 view 的范围,在父视图上设置
      	*/
      	view.clipsToBounds = NO;
          
      	// 获得自己的所有子控件对象
      	/*
      		数组元素的顺序决定着子控件的显示层级顺序(下标越大的,越显示在上面)
      	*/
      	NSArray *subviews = self.view.subviews;
         	
      	// 获得自己的父控件对象
      	UIView *superview = self.view.superview;
         	
      	// 从父视图中移除
      	[view removeFromSuperview];
      	
      	// 根据一个 tag 标识找出对应的控件
      	UIView *view = [self.view viewWithTag:100];
      
    • Swift

      	// 设置 frame
      	/*
      		控件矩形框在父控件中的位置和尺寸,以父控件的左上角为坐标原点
      	*/
      	view.frame = CGRectMake(10, 20, 200, 100)
          
      	// 设置 bounds
      	/*
      		控件矩形框的位置和尺寸,以自己左上角为坐标原点,所以 bounds 的 x、y 一般为 0
      	*/
      	view.bounds = CGRectMake(0, 0, 200, 100)
          
      	// 设置中心位置
      	/*
      		控件中点的位置,以父控件的左上角为坐标原点
      	*/
      	view.center = self.view.center
          
      	// 设置背景颜色
      	view.backgroundColor = UIColor.greenColor()
      
      	// 设置背景颜色半透明
      	view.backgroundColor = UIColor.blackColor().colorWithAlphaComponent(0.5)
      	
      	// 设置视图透明度
      	/*
          	范围:0.0 ~ 1.0 ,0.0 透明,1.0 不透明(默认)
          	视图上的文字等内容的透明度也同时被改变
       	*/
      	view.alpha = 1.0
      
      	// 设置 tag 值
      	/*
      		用于区分不同的 view ,所有继承 view 的类对象都可以设置 tag 值
      	*/
      	view.tag = 100
          
      	// 设置用户交互属性
      	/*
      		true:打开用户交互属性,false:关闭用户交互属性
      	*/
      	view.userInteractionEnabled = true
          
      	// 设置圆脚边框
      	/*
      		cornerRadius:圆角半径
      		masksToBounds:子图层是否剪切图层边界,默认为 false
      	*/
      	view.layer.cornerRadius = 20
      	view.layer.masksToBounds = true
          
      	// 设置边框
      	/*
      		borderWidth:边框粗细
      		borderColor:边框颜色
      	*/
      	view.layer.borderWidth = 5
      	view.layer.borderColor = UIColor.blueColor().CGColor
          
      	// 子视图的范围不允许超过父视图的范围
      	/*
      		不允许 view 的子视图的范围超过 view 的范围,在父视图上设置
      	*/
      	view.clipsToBounds = true
          
      	// 获得自己的所有子控件对象
      	/*
      		数组元素的顺序决定着子控件的显示层级顺序(下标越大的,越显示在上面)
      	*/
      	let subviews:Array = self.view.subviews
             	
      	// 获得自己的父控件对象
      	let superview:UIView? = self.view.superview
             	
      	// 从父视图中移除
      	view.removeFromSuperview()
      	
      	// 根据一个 tag 标识找出对应的控件
      	let view:UIView? = self.view.viewWithTag(100)
      

    3、View 的层次设置

    • 在 iOS 中后添加的 View 在上层。

    • Objective-C

      	// 放到最上层
      	/*
      		将 view1 放到最上层,层次关系 view2.view3.view1
      	*/
      	[self.view bringSubviewToFront:view1]; 
      
      	// 放倒最下面
      	/*
      		将 view3 放倒最下面,层次关系 view3.view1.view2
      	*/
       	[self.view sendSubviewToBack:view3]; 
      
      	// 位置进行交换
      	/*
      		将 view1 和 view3 位置进行交换,层次关系 view3.view2.view1
      	*/
       	[self.view exchangeSubviewAtIndex:0 withSubviewAtIndex:2];
      
      	// 放在上面
      	/*
      		将 view1 放在 view3 上面,层次关系 view2.view3.view1
      	*/
      	[self.view insertSubview:view1 aboveSubview:view3]; 
      
      	// 放在下面
      	/*
      		将 view3 放在 view2 下面,层次关系 view1.view3.view2
      	*/
      	[self.view insertSubview:view3 belowSubview:view2];  
      
      	// 放在 n 位置
      	/*
      		将 view1 放在1的位置,层次关系 view2.view1.view3
      	*/
      	[self.view insertSubview:view1 atIndex:1];
      
    • Swift

      	// 放到最上层
      	/*
      		将 view1 放到最上层,层次关系 view2.view3.view1
      	*/
      	self.view.bringSubviewToFront(view1)
      
      	// 放倒最下面
      	/*
      		将 view3 放倒最下面,层次关系 view3.view1.view2
      	*/
      	self.view.sendSubviewToBack(view3)
      
      	// 位置进行交换
      	/*
      		将 view1 和 view3 位置进行交换,层次关系 view3.view2.view1
      	*/
      	self.view.exchangeSubviewAtIndex(0, withSubviewAtIndex: 2) 
      
      	// 放在上面
      	/*
      		将 view1 放在 view3 上面,层次关系 view2.view3.view1
      	*/
      	self.view.insertSubview(view1, aboveSubview: view3)
      
      	// 放在下面
      	/*
      		将 view3 放在 view2 下面,层次关系 view1.view3.view2
      	*/
      	self.view.insertSubview(view3, belowSubview: view2)
      
      	// 放在 n 位置
      	/*
      		将 view1 放在1的位置,层次关系 view2.view1.view3
      	*/
      	self.view.insertSubview(view1, atIndex: 1)
      

    4、View 的旋转与缩放设置

    • Objective-C

      • 单一形变

        	// 控件的形变属性
        	@property(nonatomic) CGAffineTransform transform;
            
        	// 旋转
        	/*
        		(CGFloat angle) 旋转 45 度,需要输入的参数为弧度,45/180 * M_PI,1 度 = PI/180 弧度
        	*/
        	self.testView.transform = CGAffineTransformMakeRotation(0.25 * M_PI);
        	
        	[self.testView.layer setAffineTransform: CGAffineTransformMakeRotation(0.25 * M_PI)];
            
        	// 缩放
        	/*
        		(CGFloat sx, CGFloat sy) (1, 2) 宽度和高度的放大倍数
        	*/
        	self.testView.transform = CGAffineTransformMakeScale(1, 2);
        	
        	[self.testView.layer setAffineTransform: CGAffineTransformMakeScale(1, 2)];
            
        	// 平移
        	/*
        		(CGFloat tx, CGFloat ty) (100, 100) 水平和垂直方向的移动距离
        	*/
        	self.testView.transform = CGAffineTransformMakeTranslation(100, 100);
        	
        	[self.testView.layer setAffineTransform: CGAffineTransformMakeTranslation(100, 100)];
        
      • 叠加形变

        	// 旋转 + 缩放
        	CGAffineTransform rotationTransform = CGAffineTransformMakeRotation(0.25 * M_PI);
        	self.testView.transform = CGAffineTransformScale(rotationTransform, 2, 2);
        
        	// 旋转 + 平移
        	CGAffineTransform rotationTransform = CGAffineTransformMakeRotation(0.25 * M_PI);
        	self.testView.transform = CGAffineTransformTranslate(rotationTransform, 200, 100);
        
        	// 缩放 + 平移
        	CGAffineTransform scaleTransform = CGAffineTransformMakeScale(2, 2);
        	self.testView.transform = CGAffineTransformTranslate(scaleTransform, 100, 100);
        
        	// 旋转 + 缩放 + 平移
        	CGAffineTransform rotationTransform = CGAffineTransformMakeRotation(0.25 * M_PI);
        	CGAffineTransform rotationScaleTransform = CGAffineTransformScale(rotationTransform, 2, 2);
        	self.testView.transform = CGAffineTransformTranslate(rotationScaleTransform, 200, 100);
        
      • 累加形变

        	// 连续旋转
        	self.testView.transform = CGAffineTransformRotate(self.testView.transform, 0.25 * M_PI);
        
        	// 连续缩放
        	self.testView.transform = CGAffineTransformScale(self.testView.transform, 2, 2);
        
        	// 连续平移
        	self.testView.transform = CGAffineTransformTranslate(self.testView.transform, 100, 100);
        
      • 还原形变

        	// 还原所有形变
        	self.testView.transform = CGAffineTransformIdentity;
        
        	[self.testView.layer setAffineTransform: CGAffineTransformIdentity];
        
    • Swift

      • 单一形变

        	// 控件的形变属性
        	public var transform: CGAffineTransform 
        	    
        	// 旋转
        	/*
        		(angle: CGFloat) 旋转 45 度,需要输入的参数为弧度,45/180 * M_PI,1 度 = PI/180 弧度
        	*/
        	self.testView.transform = CGAffineTransformMakeRotation(0.25 * CGFloat(M_PI))
        	
        	self.testView.layer.setAffineTransform(CGAffineTransformMakeRotation(0.25 * CGFloat(M_PI)))
        		
        	// 缩放
        	/*
        		(sx: CGFloat, _ sy: CGFloat) (1, 2) 宽度和高度的放大倍数
        	*/
        	self.testView.transform = CGAffineTransformMakeScale(1, 2)
        	
        	self.testView.layer.setAffineTransform(CGAffineTransformMakeScale(1, 2))
        	    
        	// 平移
        	/*
        		(tx: CGFloat, _ ty: CGFloat) 水平和垂直方向的移动距离
        	*/
        	self.testView.transform = CGAffineTransformMakeTranslation(100, 100)
        	
        	self.testView.layer.setAffineTransform(CGAffineTransformMakeTranslation(100, 100))
        
      • 叠加形变

        	// 旋转 + 缩放
        	let rotationTransform:CGAffineTransform = CGAffineTransformMakeRotation(0.25 * CGFloat(M_PI))
        	self.testView.transform = CGAffineTransformScale(rotationTransform, 2, 2)
        
        	// 旋转 + 平移
        	let rotationTransform:CGAffineTransform = CGAffineTransformMakeRotation(0.25 * CGFloat(M_PI))
        	self.testView.transform = CGAffineTransformTranslate(rotationTransform, 200, 100)
        
        	// 缩放 + 平移
        	let scaleTransform:CGAffineTransform = CGAffineTransformMakeScale(2, 2)
        	self.testView.transform = CGAffineTransformTranslate(scaleTransform, 100, 100)
        
        	// 旋转 + 缩放 + 平移
        	let rotationTransform:CGAffineTransform = CGAffineTransformMakeRotation(0.25 * CGFloat(M_PI))
        	let rotationScaleTransform:CGAffineTransform = CGAffineTransformScale(rotationTransform, 2, 2)
        	self.testView.transform = CGAffineTransformTranslate(rotationScaleTransform, 200, 100)
        
      • 累加形变

        	// 连续旋转
        	self.testView.transform = CGAffineTransformRotate(self.testView.transform, 0.25 * CGFloat(M_PI))
        
        	// 连续缩放
        	self.testView.transform = CGAffineTransformScale(self.testView.transform, 2, 2)
        
        	// 连续平移
        	self.testView.transform = CGAffineTransformTranslate(self.testView.transform, 100, 100)
        
      • 还原形变

        	// 还原所有形变
        	self.testView.transform = CGAffineTransformIdentity
        
        	self.testView.layer.setAffineTransform(CGAffineTransformIdentity)
        

    5、View 的跟随模式设置

    • Objective-C

      	// 父视图设置
      	/*
      		父视图允许子视图跟随
      		default is YES
      	*/
      	fatherView.autoresizesSubviews = YES;
          
      	// 子视图设置
      	/*
      		UIViewAutoresizingNone                 = 0,         // 不跟随
      		UIViewAutoresizingFlexibleLeftMargin   = 1 << 0,    // 左边距 随父视图变化
      		UIViewAutoresizingFlexibleRightMargin  = 1 << 2,    // 右边距 随父视图变化
      		UIViewAutoresizingFlexibleTopMargin    = 1 << 3,    // 上边距 随父视图变化
      		UIViewAutoresizingFlexibleBottomMargin = 1 << 5     // 下边距 随父视图变化
      		
      		UIViewAutoresizingFlexibleWidth        = 1 << 1,    // 宽度 随父视图变化
      		UIViewAutoresizingFlexibleHeight       = 1 << 4,    // 高度 随父视图变化
      	*/
      	sonView.autoresizingMask = UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight;          
      
    • Swift

      	// 父视图设置
      	/*
      		父视图允许子视图跟随
      		default is true
      	*/
      	fatherView.autoresizesSubviews = true
          
      	// 子视图设置
      	/*
              None                    // 不跟随
              FlexibleLeftMargin      // 左边距 随父视图变化
              FlexibleRightMargin     // 右边距 随父视图变化
              FlexibleTopMargin       // 上边距 随父视图变化
              FlexibleBottomMargin    // 下边距 随父视图变化
              
              FlexibleWidth           // 宽度 随父视图变化
              FlexibleHeight          // 高度 随父视图变化
      	*/
      	sonView.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
      

    6、View 的动画设置

    6.1 block 方式

    • 设置控件位置、尺寸、透明度等的代码,放在 animateWithDuration: block 中,将自动以动画的方式改变。

    • Objective-C

      	// 移动时间 2 秒
      	[UIView animateWithDuration:2 animations:^{
      		
          	// 改变控件的位置和尺寸,改变后的位置或大小
          	view.frame = CGRectMake([UIScreen mainScreen].bounds.size.width - 60, 20, 50, 50);
      		
      	} completion:^(BOOL finished) {
      	                    
      		// 上一个设置完成后
      		
      		[UIView animateWithDuration:2 animations:^{
      			
      			// 改变控件的位置和尺寸,改变后的位置或大小
      			view.frame = CGRectMake(10, [UIScreen mainScreen].bounds.size.height - 110, 100, 100);
         		}];
      	}];
      
    • Swift

      	// 移动时间 2 秒
      	UIView.animateWithDuration(2, animations: {
      		
      		// 改变控件的位置和尺寸,改变后的位置或大小
      		view.frame = CGRectMake(UIScreen.mainScreen().bounds.size.width - 60, 20, 50, 50)
      		
          }) { (finished:Bool) in
      
      		// 上一个设置完成后
      		
      		UIView.animateWithDuration(2, animations: {
      			
      			// 改变控件的位置和尺寸,改变后的位置或大小
      			view.frame = CGRectMake(10, UIScreen.mainScreen().bounds.size.height - 110, 100, 100)
      		})
          }
      

    6.2 动画块方式

    • 设置控件位置、尺寸、透明度等的代码,放在 beginAnimations: 和 commitAnimations 之间,将自动以动画的方式改变。

    • Objective-C

      
      	// 开始一个动画块
      	[UIView beginAnimations:nil context:nil];
      	    
      	// 动画设置
      		
      		// 设置动画时间
      		/*
      		    default = 0.2
      		*/
      		[UIView setAnimationDuration:2.0];
      		    
      		// 设置延时
      		/*
      		    设置指定的时间后开始执行动画,default = 0.0
      		*/
      		[UIView setAnimationDelay:1.0];
      		    
      		// 设置动画开始执行时间
      		/*
      		    default = now ([NSDate date])
      		*/
      		[UIView setAnimationStartDate:[NSDate dateWithTimeIntervalSinceNow:10]];
      		    
      		// 设置动画执行节奏
      		/*
      		    UIViewAnimationCurveEaseInOut,         // slow at beginning and end  开始喝结束慢速,默认
      		    UIViewAnimationCurveEaseIn,            // slow at beginning          开始慢速
      		    UIViewAnimationCurveEaseOut,           // slow at end                结束慢速
      		    UIViewAnimationCurveLinear             //                            匀速
      		*/
      		[UIView setAnimationCurve:UIViewAnimationCurveEaseOut];
      		    
      		// 设置重复次数
      		/*
      		    default = 0.0.  May be fractional
      		*/
      		[UIView setAnimationRepeatCount:CGFLOAT_MAX];
      		    
      		// 设置是否自动返回
      		/*
      		    default = NO. used if repeat count is non-zero
      		*/
      		[UIView setAnimationRepeatAutoreverses:YES];
      		    
      		// 设置是否从当前状态开始动画
      		/*
      		    default = NO
      		*/
      		[UIView setAnimationBeginsFromCurrentState:YES];
      		    
      		// 设置代理
      		/*
      			default = nil
      		*/
      		[UIView setAnimationDelegate:self];
      		    
      		// 设置动画开始时执行的代理方法,自定义方法
      		/*
      		    default = NULL
      		*/
      		[UIView setAnimationWillStartSelector:@selector(startAnimations)];
      		    
      		// 设置动画结束时执行的代理方法,自定义方法
      		/*
      		    default = NULL
      		 */
      		[UIView setAnimationDidStopSelector:@selector(stopAnimations)];
      	    
      	// 动画之行后效果
      	
      		// 设置透明度,改变后的透明度
      		view.alpha = 0.0;
      		    
      		// 改变控件的位置和尺寸,改变后的位置或大小
      		view.center = CGPointMake(250, 250);
      		view.frame = CGRectMake(100, 180, 50, 50);
      	    
      	// 结束一个动画块
      	[UIView commitAnimations];
      
    • Swift

      	// 开始一个动画块
      	UIView.beginAnimations(nil, context: nil)
      	    
      	// 动画设置
      		
      		// 设置动画时间
      		/*
      		    default = 0.2
      		*/
      		UIView.setAnimationDuration(2.0)
      		    
      		// 设置延时
      		/*
      		    设置指定的时间后开始执行动画,default = 0.0
      		*/
      		UIView.setAnimationDelay(1.0)
      		    
      		// 设置动画开始执行时间
      		/*
      		    default = now ([NSDate date])
      		*/
      		UIView.setAnimationStartDate(NSDate(timeIntervalSinceNow: 10))
      		    
      		// 设置动画执行节奏
      		/*
      		    EaseInOut,         // slow at beginning and end  开始喝结束慢速,默认
      		    EaseIn,            // slow at beginning          开始慢速
      		    EaseOut,           // slow at end                结束慢速
      		    Linear             //                            匀速
      		*/
      		UIView.setAnimationCurve(.EaseOut)
      		    
      		// 设置重复次数
      		/*
      		    default = 0.0.  May be fractional
      		*/
      		UIView.setAnimationRepeatCount(9999999)
      		    
      		// 设置是否自动返回
      		/*
      		    default = NO. used if repeat count is non-zero
      		*/
      		UIView.setAnimationRepeatAutoreverses(true)
      		    
      		// 设置是否从当前状态开始动画
      		/*
      		    default = NO
      		*/
      		UIView.setAnimationBeginsFromCurrentState(true)
      		    
      		// 设置代理
      		/*
      		    default = nil
      		*/
      		UIView.setAnimationDelegate(self)
      		    
      		// 设置动画开始时执行的代理方法,自定义方法
      		/*
      		    default = NULL
      		*/
      		UIView.setAnimationWillStartSelector(#selector(UiView.startAnimations))
      		    
      		// 设置动画结束时执行的代理方法,自定义方法
      		/*
      		    default = NULL
      		*/
      		UIView.setAnimationDidStopSelector(#selector(UiView.stopAnimations))
      
      	// 动画之行后效果
      	
      		// 设置透明度,改变后的透明度
      		view.alpha = 0.0
      		    
      		// 改变控件的位置和尺寸,改变后的位置或大小
      		view.center = CGPointMake(250, 250)
      		view.frame = CGRectMake(100, 180, 50, 50)
      	    
      	// 结束一个动画块
      	UIView.commitAnimations()
      

    7、frame 与 NSValue 的相互转换

    • Objective-C

          // Frame 转 NSValue
          NSValue *freamValue = [NSValue valueWithCGRect:frame];
          
          // NSValue 转 Frame
          frame = [freamValue CGRectValue];
      
    • Swift

          // Frame 转 NSValue
          let freamValue:NSValue = NSValue(CGRect: frame)
          
          // NSValue 转 Frame
          frame = freamValue.CGRectValue()
      

    8、view 的封装(自定义控件)

    • 如果一个 view 内部的子控件比较多,一般会考虑自定义一个 view,把它内部子控件的创建屏蔽起来,不让外界关心。外界可以传入对应的模型数据给 view,view 拿到模型数据后给内部的子控件设置对应的数据。

    • 一个控件有 2 种创建方式:

      • 通过纯代码创建

        • 初始化时一定会调用 initWithFrame: 方法。想做一些初始化操作,应该在这个方法中执行。
        • 系统中 init 方法执行时会自动调用 initWithFrame: 方法。
      • 通过 xibstoryboard 创建

        • 初始化时不会调用 initWithFrame: 方法,只会调用 initWithCoder: 方法。
        • 初始化完毕后会调用 awakeFromNib 方法。想做一些初始化操作,应该在这个方法中执行。
      • 有时候希望在控件初始化时做一些初始化操作,比如添加子控件、设置基本属性,这时需要根据控件的创建方式,来选择在 initWithFrame:、initWithCoder:、awakeFromNib 的哪个方法中操作。

    8.1 纯代码自定义控件

    • 1> 在 initWithFrame: 方法中添加子控件,提供便利构造方法(类方法)。

      • 或者不使用 initWithFrame: 方法,而是使用子控件的懒加载方式,添加子控件。
    • 2> 在 layoutSubviews 方法中设置子控件的 frame(一定要调用 super 的 layoutSubviews)。

      • 控件的尺寸发生改变时会自动调用 layoutSubviews 方法,设置子控件的布局。
    • 3> 增加模型属性,在模型属性 setter 方法中设置数据到子控件上。

    • Objective-C

      • ShopView.h

        	#import <UIKit/UIKit.h>
        	
        	/// 数据模型
        	@class ShopModel;
        	
        	@interface ShopView : UIView
        	
        	/// 商品模型
        	@property (nonatomic, strong) ShopModel *shop;
        	
        	/// 便利的构造方法
        	+ (instancetype)shopView;
        	
        	@end
        
      • ShopView.m

        • 在 initWithFrame: 方法中添加子控件

          	#import "ShopView.h"
          	#import "ShopModel.h"
          	
          	@interface ShopView()
          	
          	/// 图片控件
          	@property (nonatomic, strong) UIImageView *iconView;
          	
          	/// 名字控件
          	@property (nonatomic, strong) UILabel *nameLabel;
          	
          	@end
          	
          	@implementation ShopView
          	
          	/// 便利的构造方法
          	+ (instancetype)shopView {
          	    return [[self alloc] init];
          	}
          
          	/**
          	 * 控件初始化方法
          	 * init 方法内部会自动调用 initWithFrame: 方法
          	 */
          	- (instancetype)initWithFrame:(CGRect)frame {
          	
          	    if (self = [super initWithFrame:frame]) {
          	        self.backgroundColor = [UIColor orangeColor];
          	        
          	        // 添加图片
          	        UIImageView *iconView = [[UIImageView alloc] init];
          	        iconView.backgroundColor = [UIColor blueColor];
          	        [self addSubview:iconView];
          	        self.iconView = iconView;
          	        
          	        // 添加文字
          	        UILabel *nameLabel = [[UILabel alloc] init];
          	        nameLabel.font = [UIFont systemFontOfSize:11];
          	        nameLabel.textAlignment = NSTextAlignmentCenter;
          	        nameLabel.backgroundColor = [UIColor redColor];
          	        [self addSubview:nameLabel];
          	        self.nameLabel = nameLabel;
          	    }
          	    return self;
          	}
          	
          	/**
          	 * 布局子控件
          	 * 这个方法专门用来布局子控件,一般在这里设置子控件的 frame
          	 * 当控件本身的尺寸发生改变的时候,系统会自动调用这个方法
          	 */
          	- (void)layoutSubviews{
          	
          	    // 一定要调用 super 的 layoutSubviews
          	    [super layoutSubviews];
          	    
          	    CGFloat shopW = self.frame.size.width;
          	    CGFloat shopH = self.frame.size.height;
          	    self.iconView.frame = CGRectMake(0, 0, shopW, shopW);
          	    self.nameLabel.frame = CGRectMake(0, shopW, shopW, shopH - shopW);
          	}
          	
          	/// 数据模型 setter 方法
          	- (void)setShop:(ShopModel *)shop {
          	
          	    _shop = shop;
          	    
          	    self.nameLabel.text = shop.name;
          	    self.iconView.image = [UIImage imageNamed:shop.icon];
          	}
          	
          	@end
          
        • 使用子控件的懒加载方法添加子控件

          	#import "ShopView.h"
          	#import "ShopModel.h"
          	
          	@interface ShopView()
          	
          	/// 图片控件
          	@property (nonatomic, strong) UIImageView *iconView;
          	
          	/// 名字控件
          	@property (nonatomic, strong) UILabel *nameLabel;
          	
          	@end
          	
          	@implementation ShopView
          	
          	/// 便利的构造方法
          	+ (instancetype)shopView {
          	    return [[self alloc] init];
          	}
          	
          	/// 子控件懒加载方法(getter 方法)
          	- (UIImageView *)iconView {
          	
          	    if (_iconView == nil) {
          	        UIImageView *iconView = [[UIImageView alloc] init];
          	        iconView.backgroundColor = [UIColor blueColor];
          	        [self addSubview:iconView];
          	        _iconView = iconView;
          	    }
          	    return _iconView;
          	}
          	
          	/// 子控件懒加载方法(getter 方法)
          	- (UILabel *)nameLabel {
          	
          	    if (_nameLabel == nil) {
          	        UILabel *nameLabel = [[UILabel alloc] init];
          	        nameLabel.font = [UIFont systemFontOfSize:11];
          	        nameLabel.textAlignment = NSTextAlignmentCenter;
          	        nameLabel.backgroundColor = [UIColor redColor];
          	        [self addSubview:nameLabel];
          	        _nameLabel = nameLabel;
          	    }
          	    return _nameLabel;
          	}
          
          	/**
          	 * 布局子控件
          	 * 这个方法专门用来布局子控件,一般在这里设置子控件的 frame
          	 * 当控件本身的尺寸发生改变的时候,系统会自动调用这个方法
          	 */
          	- (void)layoutSubviews{
          	
          	    // 一定要调用 super 的 layoutSubviews
          	    [super layoutSubviews];
          	    
          	    CGFloat shopW = self.frame.size.width;
          	    CGFloat shopH = self.frame.size.height;
          	    self.iconView.frame = CGRectMake(0, 0, shopW, shopW);
          	    self.nameLabel.frame = CGRectMake(0, shopW, shopW, shopH - shopW);
          	}
          	
          	/// 数据模型 setter 方法
          	- (void)setShop:(ShopModel *)shop {
          	
          	    _shop = shop;
          	    
          	    self.nameLabel.text = shop.name;
          	    self.iconView.image = [UIImage imageNamed:shop.icon];
          	}
          	
          	@end
          

    8.2 XIB 自定义控件

    • 新建自定义控件类。

      UIView2

    • 新建 xib 文件(文件名建议和自定义控件类的类名一致)。

      UIView3

    • 修改 xib 中控件绑定的类名。

      UIView4

    • 在类扩展中增加子控件的属性,关联 xib 中的子控件。封装 xib 的加载过程,增加模型属性,在模型属性 setter 方法中设置数据到子控件上。

    • Objective-C

      • ShopView.h

        	#import <UIKit/UIKit.h>
        	
        	@class ShopModel;
        	
        	@interface ShopView : UIView
        	
        	/** 模型数据 */
        	@property (nonatomic, strong) ShopModel *shop;
        	
        	+ (instancetype)shopView;
        	+ (instancetype)shopViewWithShopModel:(ShopModel *)shop;
        	@end
        
      • ShopView.m

        	#import "ShopView.h"
        	#import "ShopModel.h"
        	
        	@interface ShopView()
        	
        	/** 图标 */
        	@property (weak, nonatomic) IBOutlet UIImageView *iconView;
        	
        	/** 名字 */
        	@property (weak, nonatomic) IBOutlet UILabel *nameLabel;
        	
        	@end
        	
        	@implementation ShopView
        	
        	+ (instancetype)shopView {
        	  	return [self shopViewWithShop:nil];
        	}
        	
        	+ (instancetype)shopViewWithShop:(ShopModel *)shop {
        	
        		// 加载 xib 自定义控件
        	  	ShopView *shopView = [[[NSBundle mainBundle] loadNibNamed:NSStringFromClass(self) 
        	  	                                                    owner:nil 
        	  	                                                  options:nil] lastObject];
        	  	shopView.shop = shop;
        	    
        	  	return shopView;
        	}
        	
        	/// 数据模型 setter 方法
        	- (void)setShop:(ShopModel *)shop {
        	
        	  	_shop = shop;
        	    
        	  	// 设置子控件的数据
        	  	self.iconView.image = [UIImage imageNamed:shop.icon];
        	  	self.nameLabel.text = shop.name;
        	}
        	
        	@end
        

    9、九宫格计算思路

    UIView1

    • Objective-C

      	// 设置列数
      	int cols = 3;
      	
      	// 设置每一个单元格的尺寸
      	CGFloat shopW = 50;
      	CGFloat shopH = 70;
      
      	// 设置每一列和每一行之间的间距
      	/*
      		self.shopsView.frame.size.width 为父视图的宽度
      	*/
      	CGFloat colMargin = (self.shopsView.frame.size.width - cols * shopW) / (cols - 1);
      	CGFloat rowMargin = 10;
      
      	// 计算单元格的索引
      	/*
      		计算将要添加的单元格的索引
      	*/
      	NSUInteger index = self.shopsView.subviews.count;
      	    
      	// 计算单元格的 x 坐标值
      	NSUInteger col = index % cols;
      	CGFloat shopX = col * (shopW + colMargin);
      	    
      	// 计算单元格的 y 坐标值
      	NSUInteger row = index / cols;
      	CGFloat shopY = row * (shopH + rowMargin);
      	    
      	// 创建一个单元格视图控件
      	UIView *shopView = [[UIView alloc] init];
      	    
      	// 设置单元格的 frame
      	shopView.frame = CGRectMake(shopX, shopY, shopW, shopH);
      	
      	// 设置单元格视图控件的内容
      	shopView.shop = self.shops[index];
      
      	// 将单元格添加到父视图上
      	[self.shopsView addSubview:shopView];
      

    10、UI 控件 weak 引用

    • 我们知道,从 Storyboard 往编译器拖出来的 UI 控件的属性是 weak 的,那么,如果有一些 UI 控件我们要用代码的方式来创建,那么它应该用 weak 还是 strong 呢?为什么?

      	@property (weak, nonatomic) IBOutlet UIButton *myButton;
      
      • 这是一道有意思的问题。简单来说,这道题并没有标准答案,但是答案背后的解释却非常有价值,能够看出一个人对于引用计数,对于 view 的生命周期的理解是否到位。

      • 我们就能看到一些理解非常不到位的解释,例如说:Storyboard 拖线使用 weak 是为了规避出现循环引用的问题。

      • 这个理解是错误的,Storyboard 拖出来的控件即使是 strong 的,也不会有循环引用问题。UI 控件用默认用 weak,根源还是苹果希望只有这些 UI 控件的父 View 来强引用它们,而 ViewController 只需要强引用 ViewController.view 成员,则可以间接持有所有的 UI 控件。这样有一个好处是:在以前,当系统收到 Memory Warning 时,会触发 ViewController 的 viewDidUnload 方法,这样的弱引用方式,可以让整个 view 整体都得到释放,也更方便重建时整体重新构造。但是首先 viewDidUnload 方法在 iOS 6 开始就被废弃掉了,苹果用了更简单有效地方式来解决内存警告时的视图资源释放。总之就是,除非你特殊地操作 view 成员,ViewController.view 的生命期和 ViewController 是一样的了。

      • 所以在这种情况下,其实 UI 控件是不是 weak 其实关系并不大。当 UI 控件是 weak 时,它的引用计数是 1,持有它的是它的 superview,当 UI 控件是 strong 时,它的引用计数是 2,持有它的有两个地方,一个是它的 superview,另一个是这个 strong 的指针。UI 控件并不会持有别的对象,所以,不管是手写代码还是 Storyboard,UI 控件是 strong 都不会有循环引用的。

      • 那么回到我们的最初的问题,自己写的 view 成员,应该用 weak 还是 strong?我个人觉得应该用 strong,因为用 weak 并没有什么特别的优势,其实 weak 变量会有额外的系统维护开销的,如果你没有使用它的特别的理由,那么用 strong 的话应该更好。另外如果你要做 Lazy 加载,那么你也只能选择用 strong。当然,如果你非要用 weak,其实也没什么问题,只需要注意在赋值前,先把这个对象用 addSubView 加到父 view 上,否则可能刚刚创建完,它就被释放了。

    11、简述对 UIView、UIWindow 和 CALayer 的理解

    • UIView 对象定义了屏幕上的一个矩形区域,用于构建用户界面和响应用户触屏事件。一个 UIView 的实例可以包含和管理若干个子 UIView。UIView 的直接父类为 UIResponder 类,可以响应用户事件。

    • UIWindow 对象是所有 UIView 的根,管理和协调应用程序的显示。UIWindow 类是 UIView 的子类,可以看作是特殊的 UIView。一般应用程序只有一个 UIWindow 对象,即使有多个 UIWindow 对象,也只有一个 UIWindow 可以接受到用户的触屏事件。

    • UIViewController 对象负责管理所有 UIView 的层次结构,并处理用户的触摸事件。

    • UIScreen 可以获取设备屏幕的大小。

    • CALayer 直接从 NSObject 继承,因为缺少了 UIResponder 类,所以 CALayer 不能响应任何用户事件。QuartzCore 是 iOS 中提供图像绘制的基础库,并且 CALayer 是定义该框架中。CALayer 定义了 position、size、transform、animations 等基本属性。UIView 是基于 CALayer 的高层封装。UIView 相比 CALayer 最大区别是 UIView 可以响应用户事件,而 CALayer 不可以。UIView 侧重于对显示内容的管理,CALayer 侧重于对内容的绘制。UIView 和 CALayer 是相互依赖的关系。UIView 依赖与 calayer 提供的内容,CALayer 依赖 UIView 提供的容器来显示绘制的内容。归根到底 CALayer 是这一切的基础,如果没有 CALayer,UIView 自身也不会存在,UIView 是一个特殊的 CALayer 实现,添加了响应事件的能力。UIView 来自 CALayer,高于 CALayer,是 CALayer 高层实现与封装。UIView 的所有特性来源于 CALayer 支持。

  • 相关阅读:
    SSD报告
    House of Spirit学习调试验证与实践
    怎样改动SharePoint管理中心的语言
    PuTTY连接Linuxserver常常断线解决方式
    HDU 2819 Swap (行列匹配+输出解)
    HDOJ--1061--Rightmost Digit
    POJ Cow Exhibition
    程序员之---C语言细节24(段错误、类型提升、sizeof &#39;A&#39;)
    java之 ------ 图形界面(三)
    Oracle 安装报错 [INS-06101] IP address of localhost could not be determined 解决方法
  • 原文地址:https://www.cnblogs.com/QianChia/p/5746902.html
Copyright © 2011-2022 走看看