iOS開發--UIKit控制項之UIView(視圖)，--uikituiview

iOS開發--UIKit控制項之UIView(視圖)，--uikituiview

(註：本文只是本人記錄平時需要用到的一些東西，作為備忘)

UIView是iOS開發中最常見、常用的一個控制項。它是UIKit架構中封裝好的一個控制項，功能強大，實用！

UIView繼承自UIResponder，使用UIView需要匯入主標頭檔 <UIKit/UIKit.h> 一般我們建立工程，建立視圖等X-code都會預設協助我們匯入這個標頭檔。

建立UIView

 1 // 建立UIView 2     UIView *view = [[UIView alloc] init]; 3     // 設定座標和尺寸 4     /** 5      *  CGRect 6      *   1. X       : X軸座標值 7      *   2. Y       : Y軸座標值 8      *   3. Width   : 寬度 9      *   4. height  : 高度10      */11     [view setFrame:CGRectMake(110, 234, 100, 100)];12     // 也可以簡寫為13     view.frame = CGRectMake(110, 234, 100, 100);14     // 這一步合并了上兩步的代碼(建立View並設定了Frame)15     UIView *view = [[UIView alloc] initWithFrame:CGRectMake(110, 234, 100, 100)];16     // 將這個View添加到介面上，這樣我們才能看得見它17     [self.view addSubview:view];18     // 然而我們現在還看不見它，因為它預設是白色的，而我們的介面預設也是白色的19     // 我們需要修改其中一個的顏色，才看得見20     // 設定View的背景色 lightGrayColor(亮灰色)21     [view setBackgroundColor:[UIColor lightGrayColor]];

運行程式，效果如下：

屬性

現在能看見視圖了，接下來來設定屬性(其實Frame和BackgroundColor也是View的屬性)

 

 1 // 座標位置 2 struct CGPoint {   3   CGFloat x;   4   CGFloat y;   5 };   6 typedef struct CGPoint CGPoint;   7    8 // 尺寸大小 9   10 struct CGSize {  11   CGFloat width;  12   CGFloat height;  13 };  14 typedef struct CGSize CGSize;  15   16 // 地區範圍(包括座標、尺寸)17 struct CGRect {  18   CGPoint origin;  19   CGSize size;  20 };  21 typedef struct CGRect CGRect;  22   23   24   25 CGRect rect = CGRectMake(0,0,320,480);  26 UIView *view = [[UIView allow]initWithFrame:rect];  27   28 // 將String轉成CGPoint 如 @”{3.0,2.5}”    {x,y}  29 CGPoint CGPointFromString (  30    NSString *string  31 );  32   33 // 將String轉成CGRect  @”{{3,2},{4,5}}”  {{x,y},{w, h}}  34 CGRect CGRectFromString (  35    NSString *string  36 );  37   38 // 將String轉成CGSize @”{3.0,2.5}” {w, h}  39 CGSize CGSizeFromString (  40    NSString *string  41 );  42   43 // CGPoint轉成NSString  44 NSString * NSStringFromCGPoint (  45    CGPoint point  46 );  47   48 // CGRect轉成NSString  49 NSString * NSStringFromCGRect (  50    CGRect rect  51 );  52   53 // CGSize轉成NSString  54 NSString * NSStringFromCGSize (  55    CGSize size  56 );  57   58 // 對一個CGRect進行修改 以這個的中心來修改 正數表示更小(縮小) 負數表示更大(放大)  59 CGRect CGRectInset (  60    CGRect rect,  61    CGFloat dx,  62    CGFloat dy  63 );  64   65 // 判斷兩個矩形是否相交  66 bool CGRectIntersectsRect (  67    CGRect rect1,  68    CGRect rect2  69 );  70   71 // 初始為0的  72 const CGPoint CGPointZero;  73 const CGRect CGRectZero;  74 const CGSize CGSizeZero;  75   76 // 建立CGPoint  77 CGPoint CGPointMake (  78    CGFloat x,  79    CGFloat y  80 );  81 // 建立CGRect  82 CGRect CGRectMake (  83    CGFloat x,  84    CGFloat y,  85    CGFloat width,  86    CGFloat height  87 );  88 // 建立CGSize  89 CGSize CGSizeMake (  90    CGFloat width,  91    CGFloat height  92 ); 

 

 

 

（這裡只是列出了一部分，暫時只能想到這些，後續有在用到會再更新）

 

 1 // 屬性 2     //  設定tag值 3     view.tag = 0; 4     //  設定中心點 5     view.center = CGPointMake(160, 284); 6     //  設定顯示/隱藏(NO為顯示, YES為隱藏) 7     view.hidden = NO; 8     //  設定圓角(cornerRadius : 圓角半徑) 9     view.layer.cornerRadius = 10.0f;10     //  設定剪下超出的部分11     view.layer.masksToBounds = YES;12     //  設定邊框寬度13     view.layer.borderWidth = 1.0f;14     //  設定邊框顏色(purpleColor為紫色)15     //   borderColor : 只接受C語言的顏色，所以我們需要給他轉成CGColor16     view.layer.borderColor = [UIColor purpleColor].CGColor;

 

運行:

方法

 其實，我們之前用的addSubview就是View的一個方法(作用是加一個視圖到另一個視圖上)

 1 // 將一個視圖移到前面   2 [UIView bringSubviewToFront: ];    3 // 將一個視圖推送到背後   4 [UIView sendSubviewToBack: ]   5 // 把視圖移除   6 [UIView removeFromSuperview]   7 // 插入視圖 並指定索引   8 [UIView insertSubview: atIndex: ]   9 // 插入視圖在某個視圖之上  10 [UIView insertSubview: aboveSubview: ]  11 // 插入視圖在某個視圖之下  12 [UIView insertSubview: belowSubview: ] 13 // 交換兩個位置索引的視圖  14 [UIView exchangeSubviewAtIndex: withSubviewAtIndex: ]

 

動畫

其實，動畫也是View的方法之一，只是這個功能比較常用，實用，所以我單獨開了一個。

動畫代碼會在動畫時間長度內執行，

比如平移，我們直接設定Frame，會看到它一閃就過去了，但是在動畫方法內，可以看見它慢慢的移過去，這個移動時間就是我們的動畫時間長度

1 // 動畫2     //  Duration : 動畫時間長度3     //  animations : 動畫效果代碼4     [UIView animateWithDuration:0.3f animations:^{5         // 動畫代碼6     }];