一、UIView基础概念
每个UI控件都是UIView的子类,核心属性如下:
| 属性 | 说明 |
|---|---|
frame |
视图在父坐标系中的位置和尺寸(CGRect: x, y, width, height) |
bounds |
视图在自身坐标系中的位置和尺寸(默认(0,0,width,height)) |
center |
视图中心点在父坐标系中的坐标(CGPoint) |
#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// 示例:创建红色视图
UIView *redView = [[UIView alloc] init];
redView.frame = CGRectMake(100, 100, 200, 150); // x,y,宽,高
redView.backgroundColor = [UIColor redColor];
[self.view addSubview:redView]; // 添加到主视图
NSLog(@"Center: %@", NSStringFromCGPoint(redView.center));
}
@end
二、基础控件详解
1. UILabel(文本标签)
UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(50, 300, 200, 40)];
label.text = @"Hello Objective-C!";
label.textColor = [UIColor blueColor];
label.font = [UIFont systemFontOfSize:18];
label.textAlignment = NSTextAlignmentCenter;
[self.view addSubview:label];
2. UIButton(按钮)
- (void)viewDidLoad {
[super viewDidLoad];
。。。。。。
UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
button.frame = CGRectMake(50, 400, 200, 50);
[button setTitle:@"点击我" forState:UIControlStateNormal];
[button setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
button.backgroundColor = [UIColor purpleColor];
// 添加点击事件
[button addTarget:self
action:@selector(buttonClicked)
forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:button];
}
// 按钮点击响应方法
- (void) buttonClicked {
NSLog(@"按钮被点击了!");
}
3. UITextField(输入框)
UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(50, 500, 200, 40)];
textField.placeholder = @"请输入内容";
textField.borderStyle = UITextBorderStyleRoundedRect;
textField.delegate = self; // 设置代理
[self.view addSubview:textField];
// 实现UITextFieldDelegate方法
- (BOOL)textFieldShouldReturn:(UITextField *)textField {
[textField resignFirstResponder]; // 收起键盘
NSLog(@"输入内容: %@", textField.text);
return YES;
}
4. UIImageView(图片视图)
用于显示图片的基础控件
// 创建并设置图片
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(50, 100, 200, 200)];
imageView.image = [UIImage imageNamed:@"demo_image"]; // 确保图片在Assets.xcassets中
imageView.contentMode = UIViewContentModeScaleAspectFit; // 图片缩放模式
imageView.layer.cornerRadius = 10; // 圆角半径
imageView.clipsToBounds = YES; // 裁剪超出部分
[self.view addSubview:imageView];
// 添加点击手势
imageView.userInteractionEnabled = YES;
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc]
initWithTarget:self
action:@selector(imageTapped)];
[imageView addGestureRecognizer:tap];
5. UISwitch(开关控件)
用于表示开/关状态的控件
UISwitch *toggleSwitch = [[UISwitch alloc] initWithFrame:CGRectMake(50, 320, 0, 0)];
toggleSwitch.on = YES; // 默认开启
[toggleSwitch addTarget:self
action:@selector(switchValueChanged:)
forControlEvents:UIControlEventValueChanged];
[self.view addSubview:toggleSwitch];
// 开关状态变化回调
- (void)switchValueChanged:(UISwitch *)sender {
NSLog(@"开关状态: %@", sender.on ? @"开" : @"关");
// 根据开关状态执行操作
}
6. UISlider(滑块控件)
用于选择某个范围内的值
UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(50, 380, 250, 40)];
slider.minimumValue = 0; // 最小值
slider.maximumValue = 100; // 最大值
slider.value = 50; // 当前值
slider.minimumTrackTintColor = [UIColor blueColor]; // 左侧轨道颜色
slider.maximumTrackTintColor = [UIColor lightGrayColor]; // 右侧轨道颜色
[slider addTarget:self
action:@selector(sliderValueChanged:)
forControlEvents:UIControlEventValueChanged];
[self.view addSubview:slider];
// 滑块值变化回调
- (void)sliderValueChanged:(UISlider *)sender {
NSLog(@"当前值: %.1f", sender.value);
}
7. UIActivityIndicatorView(加载指示器)
俗称"菊花"加载动画
// 创建加载指示器
UIActivityIndicatorView *spinner = [[UIActivityIndicatorView alloc]
initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleLarge];
spinner.center = self.view.center; // 居中显示
spinner.color = [UIColor purpleColor]; // 颜色设置
[self.view addSubview:spinner];
// 开始/停止动画
[spinner startAnimating]; // 显示加载动画
// [spinner stopAnimating]; // 停止动画
8. UIProgressView(进度条)
显示任务进度
UIProgressView *progressView = [[UIProgressView alloc]
initWithProgressViewStyle:UIProgressViewStyleDefault];
progressView.frame = CGRectMake(50, 450, 250, 20);
progressView.progress = 0.3; // 初始进度30%
progressView.progressTintColor = [UIColor greenColor]; // 进度条颜色
progressView.trackTintColor = [UIColor lightGrayColor]; // 背景条颜色
[self.view addSubview:progressView];
// 更新进度
[progressView setProgress:0.75 animated:YES]; // 动画更新到75%
9. UISegmentedControl(分段控件)
提供多个选项的选择器
NSArray *segments = @[@"选项1", @"选项2", @"选项3"];
UISegmentedControl *segmentedControl = [[UISegmentedControl alloc] initWithItems:segments];
segmentedControl.frame = CGRectMake(50, 500, 250, 40);
segmentedControl.selectedSegmentIndex = 0; // 默认选中第一个
[segmentedControl addTarget:self
action:@selector(segmentChanged:)
forControlEvents:UIControlEventValueChanged];
[self.view addSubview:segmentedControl];
// 分段选择变化回调
- (void)segmentChanged:(UISegmentedControl *)sender {
NSLog(@"选中了: %@", [sender titleForSegmentAtIndex:sender.selectedSegmentIndex]);
}
三、控件使用技巧总结
1. 通用属性
view.backgroundColor = [UIColor whiteColor]; // 背景色
view.alpha = 0.8; // 透明度
view.hidden = NO; // 显示/隐藏
view.userInteractionEnabled = YES; // 是否接受交互
调试助手
// 添加临时边框
view.layer.borderColor = [UIColor redColor].CGColor;
view.layer.borderWidth = 1.0;
// 打印控件信息
NSLog(@"Frame: %@", NSStringFromCGRect(view.frame));
布局建议
- 使用
CGRectMake(x, y, width, height)设置位置尺寸 - 对于居中元素:
view.center = self.view.center; - 使用
[UIScreen mainScreen].bounds获取屏幕尺寸
四、完整示例:登录界面组合
- (void)viewDidLoad {
[super viewDidLoad];
// 背景图
UIImageView *bgImage = [[UIImageView alloc] initWithFrame:self.view.bounds];
bgImage.image = [UIImage imageNamed:@"login_bg"];
bgImage.contentMode = UIViewContentModeScaleAspectFill;
[self.view addSubview:bgImage];
// 登录框容器
UIView *loginBox = [[UIView alloc] initWithFrame:CGRectMake(30, 150, self.view.frame.size.width-60, 300)];
loginBox.backgroundColor = [UIColor colorWithWhite:1.0 alpha:0.8];
loginBox.layer.cornerRadius = 10;
// 标题
UILabel *titleLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 20, loginBox.frame.size.width, 40)];
titleLabel.text = @"用户登录";
titleLabel.textAlignment = NSTextAlignmentCenter;
titleLabel.font = [UIFont boldSystemFontOfSize:24];
// 用户名输入框
UITextField *userField = [[UITextField alloc] initWithFrame:CGRectMake(20, 80, loginBox.frame.size.width-40, 40)];
userField.placeholder = @"请输入用户名";
userField.borderStyle = UITextBorderStyleRoundedRect;
// 密码输入框
UITextField *passField = [[UITextField alloc] initWithFrame:CGRectMake(20, 130, loginBox.frame.size.width-40, 40)];
passField.placeholder = @"请输入密码";
passField.secureTextEntry = YES; // 密码模式
passField.borderStyle = UITextBorderStyleRoundedRect;
// 记住密码开关
UISwitch *rememberSwitch = [[UISwitch alloc] initWithFrame:CGRectMake(20, 180, 0, 0)];
UILabel *switchLabel = [[UILabel alloc] initWithFrame:CGRectMake(70, 180, 100, 30)];
switchLabel.text = @"记住密码";
// 登录按钮
UIButton *loginBtn = [UIButton buttonWithType:UIButtonTypeSystem];
loginBtn.frame = CGRectMake(50, 230, loginBox.frame.size.width-100, 44);
[loginBtn setTitle:@"登 录" forState:UIControlStateNormal];
loginBtn.backgroundColor = [UIColor systemBlueColor];
[loginBtn setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];
loginBtn.layer.cornerRadius = 6;
// 组装登录框
[loginBox addSubview:titleLabel];
[loginBox addSubview:userField];
[loginBox addSubview:passField];
[loginBox addSubview:rememberSwitch];
[loginBox addSubview:switchLabel];
[loginBox addSubview:loginBtn];
[self.view addSubview:loginBox];
}
// 按钮点击响应方法
- (void) buttonClicked {
NSLog(@"登录成功!");
}
相关推荐
为何要学习Objective-C?从环境搭建开始-CSDN博客文章浏览阅读746次,点赞26次,收藏28次。在Objective-C开发中,你会频繁遇到以"NS"开头的类名和函数名,比如NSLog、NSString、NSArray等。这个"NS"前缀其实有着重要的历史渊源和技术含义。https://shuaici.blog.csdn.***/article/details/148535298【iOS初体验】Hello, UIKit! - 第一个iOS App保姆式教程-CSDN博客文章浏览阅读600次,点赞14次,收藏17次。本文系统梳理了Objective-C核心数据类型与操作,分为三大部分:1)回顾C语言基础(数据类型、运算符、控制流);类:对象的蓝图(定义属性和方法)对象:类的实例(内存中的具体实体)方法:对象的行为(实例方法 - / 类方法 +)(iOS 13+)负责管理应用窗口场景。Objective-C面向对象编程:类、对象、方法详解(保姆级教程)-CSDN博客。我们将创建一个简单的应用,点击按钮可以改变标签上的文字。https://shuaici.blog.csdn.***/article/details/148588751