UIView的常見屬性
-
NSSArray *subviews
- 所有的子控件
- 子控件是以數(shù)組形式展現(xiàn)，并且數(shù)組的順序是：越往后的控件，越在上面
frame
控件的大小、位置（每一個控件都有frame屬性）
x,y值以父控件的左上角為坐標原點的
bounds
以自己左上角為坐標原點，所以bounds的x,y為0
center
以自己中心店角為坐標原點
UIView的常見方法
- addSubview：
- 添加一個子控件
- 可以用下面的方法調(diào)整界面上的順序（view數(shù)組代碼寫在越在前面，界面顯示越在下面）
// 將子控件放在siblingSubview 的下面， 也就是界面的siblingSubview控件的上面
- (void) insertSubview:(UIView *) view belowSubview:(UIView *) siblingSubview;
// 將子控件放在siblingSubview 的上面， 也就是界面的siblingSubview控件的上面
- (void) insertSubview:(UIView *) view aboveSubview:(UIView *) siblingSubview;
// 將子控件放在代碼（數(shù)組）的最后面，界面上顯示最上面
- (void) bringSubviewToFront:(UIView *)view;
// 將子控件放在代碼（數(shù)組）的最后面，界面上顯示最下面
- (void) bringSubviewToBack:(UIView *)view;
UI控件概覽
IButton 按鈕
UILabel 文本標簽
UITextField 文本輸入框
UIImageView 圖片顯示
UIProgressView 進度條
UISlider 滑塊
UISwitch 開關(guān)
UISegmentControl 選項卡
UIActivityIndicator 圈圈
UIAlertView 對話框（中間彈框）
UIActionSheet 底部彈框
UIScrollView 滾動的控件
UIPageControl 分頁控件
UITextView 能滾動的文字顯示控件
UITableView 表格
UICollectionView 九宮格
UIPickerView 選擇器
UIDatePicker 日期選擇器
UIWebView 網(wǎng)頁顯示控件
UIToolbar 工具條
UINavigationBar導(dǎo)航條
案例
- 01界面顯示 ‘添加/刪除’按鈕
-
- (void)viewDidLoad視圖（view）加載完畢，要在界面顯示的控件。
- (void)viewDidLoad {
[super viewDidLoad];
// 創(chuàng)建一個添加按鈕
[self addButtonWithImage:@"add" higImage:@"add_highlighted" disabledImage:@"add_disable" frame:CGRectMake(20, 20, 50, 50) tag:10 action:@selector(add)];
// 創(chuàng)建一個刪除按鈕
[self addButtonWithImage:@"remove" higImage:@"remove_highlighted" disabledImage:@"remove_disable" frame:CGRectMake(300, 20, 50, 50) tag:20 action:@selector(remove)];
}
// 簡化創(chuàng)建按鈕的代碼 “抽取代碼”
- (void)addButtonWithImage:(NSString *)image higImage:(NSString *) higImage disabledImage:(NSString *)disabledImage frame:(CGRect)frame tag:(NSInteger)tag action:(SEL)action {
// 創(chuàng)建按鈕并設(shè)置按鈕屬性
UIButton *btn = [[UIButton alloc]init];
[btn setBackgroundImage:[UIImage imageNamed:image] forState:UIControlStateNormal];
[btn setBackgroundImage:[UIImage imageNamed:higImage] forState:UIControlStateHighlighted];
[btn setBackgroundImage:[UIImage imageNamed:disabledImage] forState:UIControlStateDisabled];
btn.frame = frame;
// 監(jiān)聽按鈕
[btn addTarget:self action:action forControlEvents:UIControlEventTouchUpInside];
// Tag
btn.tag = tag;
// 顯示在 View 視圖中
[self.view addSubview:btn];
}
- 02 ‘添加/刪除’按鈕的 方法
/** 添加按鈕 方法*/
- (void)add {
// 添加一個modeView 的塊。把圖片和文字控件添加到modeView，這樣就能只算modeView的x，y軸了
UIView *modeView = [[UIView alloc]init];
modeView.backgroundColor = [UIColor redColor];
modeView.frame = CGRectMake(shopsX, shopsY, shopsWitch, shopsHeight);
[self.shopView addSubview:modeView];
// 添加圖片
UIImageView *iconIamge = [[UIImageView alloc]init];
iconIamge.image = [UIImage imageNamed:@"danjianbao"];
iconIamge.frame = CGRectMake(0, 0, shopsWitch, shopsWitch);
[modeView addSubview:iconIamge];
// 添加按鈕
UILabel *label = [[UILabel alloc]init];
label.text = @"DanJan";
label.frame = CGRectMake(0, shopsWitch, shopsWitch, shopsHeight-shopsWitch);
label.font = [UIFont systemFontOfSize:11];
label.textAlignment = NSTextAlignmentCenter;
[modeView addSubview:label]; // 顯示到modeVeiw這個界面
NSLog(@"add---");
}
/** 刪除按鈕 方法*/
- (void)remove {
NSLog(@"remove---");
}
- 03 九宮格
/** 添加按鈕 方法*/
- (void)add {
// self.shopView.clipsToBounds = YES; // 超出 shopView 的隱藏
/** 九宮格 開始 */
// 設(shè)置顯示列數(shù)
int cols = 4;
CGFloat shopsWitch = 50; // 商品的寬度
CGFloat shopsHeight = 70; // 商品的高度：圖片+文字
// 商品間隔的寬度
CGFloat marginW = (self.shopView.frame.size.width - cols * shopsWitch) / (cols -1);
// 商品間隔的高度
CGFloat marginH = 20;
//index索引不能為負值，所以要用NSUInteger，用int 會報錯。添加一個modeView count為0。再添加一個modeView count為1。
NSUInteger index = self.shopView.subviews.count; // subviews 是NSArray類型
// CGFloat：浮點型； col：當前列數(shù)。 col = 索引(index) % 設(shè)置的列數(shù)(cols)
CGFloat col = index % cols;
// shopsX：商品的x軸
CGFloat shopsX = col * (shopsWitch + marginW);
// 行數(shù) row = 索引數(shù)(index) 除以(/) 設(shè)置行數(shù)(cols)
NSUInteger row = index / cols;
// shopsY：商品的Y軸
CGFloat shopsY = row * (shopsHeight + marginH);
/** 九宮格 結(jié)束 */
// 添加一個modeView 的塊。把圖片和文字控件添加到modeView，這樣就能只算modeView的x，y軸了
UIView *modeView = [[UIView alloc]init];
modeView.backgroundColor = [UIColor redColor];
modeView.frame = CGRectMake(shopsX, shopsY, shopsWitch, shopsHeight);
[self.shopView addSubview:modeView];
// 添加圖片
UIImageView *iconIamge = [[UIImageView alloc]init];
iconIamge.image = [UIImage imageNamed:@"danjianbao"];
iconIamge.frame = CGRectMake(0, 0, shopsWitch, shopsWitch);
[modeView addSubview:iconIamge];
// 添加按鈕
UILabel *label = [[UILabel alloc]init];
label.text = @"DanJan";
label.frame = CGRectMake(0, shopsWitch, shopsWitch, shopsHeight-shopsWitch);
label.font = [UIFont systemFontOfSize:11];
label.textAlignment = NSTextAlignmentCenter;
[modeView addSubview:label]; // 顯示到modeVeiw這個界面
NSLog(@"add---");
}
- 04 控制‘添加/刪除’按鈕的不可點擊狀態(tài)
- 添加按鈕屬性
-
self.removeBtn.enabled = NO;按鈕不可點擊
/** 添加按鈕 */
@property (weak,nonatomic) UIButton *addBtn;
/** 刪除按鈕 */
@property (weak,nonatomic) UIButton *removeBtn;
// if (self.shopView.subviews.count == self.shops.count) {
// self.addBtn.enabled = NO;
// }else{
// self.addBtn.enabled =YES;
// }
//
self.addBtn.enabled = (self.shopView.subviews.count < self.shops.count);
// if (self.shopView.subviews.count == 0) {
// self.removeBtn.enabled = NO;
// }else{
// self.removeBtn.enabled = YES;
// }
self.removeBtn.enabled = (self.shopView.subviews.count > 0);
- 全部代碼
//
// ViewController.m
// 02-UIView2
//
// Created by xcode on 16/1/30.
// Copyright (c) 2016年 xcode. All rights reserved.
//
#import "ViewController.h"
@interface ViewController ()
// 彈出框
@property (weak, nonatomic) IBOutlet UILabel *hud;
@property (weak, nonatomic) IBOutlet UIView *shopView;
/** 添加按鈕 */
@property (weak,nonatomic) UIButton *addBtn;
/** 刪除按鈕 */
@property (weak,nonatomic) UIButton *removeBtn;
// 創(chuàng)建商品的數(shù)據(jù)
@property (strong, nonatomic) NSArray *shops;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 創(chuàng)建一個添加按鈕
self.addBtn = [self addButtonWithImage:@"add" higImage:@"add_highlighted" disabledImage:@"add_disable" frame:CGRectMake(20, 20, 50, 50) tag:10 action:@selector(add)];
// 創(chuàng)建一個刪除按鈕
self.removeBtn = [self addButtonWithImage:@"remove" higImage:@"remove_highlighted" disabledImage:@"remove_disable" frame:CGRectMake(300, 20, 50, 50) tag:20 action:@selector(remove)];
self.removeBtn.enabled = NO;
// 數(shù)據(jù)
self.shops = @[
@{@"icon" : @"danjianbao", @"imageName" : @"單肩包"},
@{@"icon" : @"liantiaobao", @"imageName" : @"鏈條包"},
@{@"icon" : @"qianbao", @"imageName" : @"錢包"},
@{@"icon" : @"shoutibao", @"imageName" : @"手提包"},
@{@"icon" : @"shuangjianbao", @"imageName" : @"雙肩包"},
@{@"icon" : @"xiekuabao", @"imageName" : @"斜跨包"},
];
}
// 簡化創(chuàng)建按鈕的代碼 “抽取代碼”
- (UIButton *)addButtonWithImage:(NSString *)image higImage:(NSString *) higImage disabledImage:(NSString *)disabledImage frame:(CGRect)frame tag:(NSInteger)tag action:(SEL)action {
// 創(chuàng)建按鈕并設(shè)置按鈕屬性
UIButton *btn = [[UIButton alloc]init];
[btn setBackgroundImage:[UIImage imageNamed:image] forState:UIControlStateNormal];
[btn setBackgroundImage:[UIImage imageNamed:higImage] forState:UIControlStateHighlighted];
[btn setBackgroundImage:[UIImage imageNamed:disabledImage] forState:UIControlStateDisabled];
btn.frame = frame;
// 監(jiān)聽按鈕
[btn addTarget:self action:action forControlEvents:UIControlEventTouchUpInside];
// Tag
btn.tag = tag;
// 顯示在 View 視圖中
[self.view addSubview:btn];
return btn;
}
/** 添加按鈕 方法*/
- (void)add {
// self.shopView.clipsToBounds = YES; // 超出 shopView 的隱藏
/** 九宮格 開始 */
// 顯示列數(shù)
int cols = 3;
CGFloat shopsWitch = 80; // 商品的寬度
CGFloat shopsHeight = 100; // 商品的高度：圖片+文字
// 商品間隔的寬度
CGFloat marginW = (self.shopView.frame.size.width - cols * shopsWitch) / (cols -1);
// 商品間隔的高度
CGFloat marginH = 20;
//index索引不能為負值，所以要用NSUInteger，用int 會報錯。添加一個modeView count為0。再添加一個modeView count為1。
NSUInteger index = self.shopView.subviews.count; // subviews 是NSArray類型
// CGFloat：浮點型； col：當前列數(shù)。 col = 索引(index) % 設(shè)置的列數(shù)(cols)
CGFloat col = index % cols;
// shopsX：商品的x軸
CGFloat shopsX = col * (shopsWitch + marginW);
// 行數(shù) row = 索引數(shù)(index) 除以(/) 設(shè)置行數(shù)(cols)
NSUInteger row = index / cols;
// shopsY：商品的Y軸
CGFloat shopsY = row * (shopsHeight + marginH);
/** 九宮格 結(jié)束 */
// 添加一個modeView 的塊。把圖片和文字控件添加到modeView，這樣就能只算modeView的x，y軸了
UIView *modeView = [[UIView alloc]init];
modeView.backgroundColor = [UIColor redColor];
modeView.frame = CGRectMake(shopsX, shopsY, shopsWitch, shopsHeight);
[self.shopView addSubview:modeView];
NSDictionary *shop = self.shops[index];
// 添加圖片
UIImageView *iconIamge = [[UIImageView alloc]init];
iconIamge.image = [UIImage imageNamed:shop[@"icon"]];
iconIamge.frame = CGRectMake(0, 0, shopsWitch, shopsWitch);
[modeView addSubview:iconIamge];
// 添加按鈕
UILabel *label = [[UILabel alloc]init];
label.text = shop[@"imageName"];
label.frame = CGRectMake(0, shopsWitch, shopsWitch, shopsHeight-shopsWitch);
label.font = [UIFont systemFontOfSize:11];
label.textAlignment = NSTextAlignmentCenter;
[modeView addSubview:label]; // 顯示到modeVeiw這個界面
// 每次添加按鈕都 執(zhí)行 checkState 這個方法檢查 shopsView 有多少個
[self checkState];
// if (self.shopView.subviews.count == self.shops.count) {
// // 添加滿了
// self.addBtn.enabled = NO;
// }
//
// self.removeBtn.enabled = YES;
NSLog(@"add---");
}
/** 刪除按鈕 方法*/
- (void)remove {
[[self.shopView.subviews lastObject] removeFromSuperview];
[self checkState];
// if (self.shopView.subviews.count == 0) {
// self.removeBtn.enabled = NO;
// }
// self.addBtn.enabled = YES;
//
NSLog(@"remove---");
}
- (void)checkState {
// if (self.shopView.subviews.count == self.shops.count) {
// self.addBtn.enabled = NO;
// }else{
// self.addBtn.enabled =YES;
// }
//
self.addBtn.enabled = (self.shopView.subviews.count < self.shops.count);
// if (self.shopView.subviews.count == 0) {
// self.removeBtn.enabled = NO;
// }else{
// self.removeBtn.enabled = YES;
// }
self.removeBtn.enabled = (self.shopView.subviews.count > 0);
// if (self.shopView.subviews.count == self.shops.count) {
// // 添加滿了
// self.addBtn.enabled = NO;
// }
//
// self.removeBtn.enabled = YES;
//
//
//
// if (self.shopView.subviews.count == 0) {
// self.removeBtn.enabled = NO;
// }
// self.addBtn.enabled = YES;
if (self.addBtn.enabled == NO) {
self.hud.alpha = 1.0;
self.hud.text = @"添加滿了！";
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
self.hud.alpha = 0.0;
});
}else if (self.removeBtn.enabled == NO) {
self.hud.alpha = 1.0;
self.hud.text = @"沒有了";
dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(1.5 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
self.hud.alpha = 0.0;
});
}
}
@end
