iOS开发——基本控件（UIButton，UILabel，UITextField，UISwitch，UISlider，UISegmentedControl）

关注

原创最新推荐文章于 2026-08-08 17:29:56 发布 528 阅读 AI 写同款· GEO 优化 ›

iOS14+Swift5.x+Xcode12学习笔记（3）——可视化控件 UIKit坐标系以视窗的左上角为坐标原点，向右增加x的值，向下增加y的值。每个控件有两个和坐标与控件大小有关的属性，分别是frame和bounds。这两个属性中都包含了origin和size结构体。结构体size中包含width和height两个属性，分别记录了控件的宽度和高度，frame和bounds中的size属性是一样的。结构origin包含x和y两个属性，分别记录了控件的x坐标和y坐标。在frame中origin存储的值是控件左上角到父容器（superview）的左上角的举例，而bounds中or 阅读详情

<pre name="code" class="objc"><p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UIButton<span style="font-family: 'Heiti SC Light';">定制：</span></p>

UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.frame = CGRectMake(240, 20, 80, 30);
    button.tag = 10;
    [button setTitle:@"Next"
            forState:UIControlStateNormal];
    [button addTarget:self
               action:@selector(buttonPressed:)
     forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button];


    /* UIButton定制 */
    // 定制按钮时采用类型UIButtonTypeCustom
    UIButton *customButton = [UIButton buttonWithType:UIButtonTypeCustom];
    customButton.frame = CGRectMake(20, 20, 50, 50);
    customButton.backgroundColor = [UIColor clearColor];
    
    // 定制标题文本
    [customButton setTitle:@"1" forState:UIControlStateNormal];
    [customButton setTitle:@"2" forState:UIControlStateHighlighted];
    
    // 定制标题文本色
    [customButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
    [customButton setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
    
    // 定制标题文本类型
    customButton.titleLabel.font = [UIFont systemFontOfSize:30];
    
    // 定制图片显示
    // 1.配置图片
    [customButton setImage:[UIImage imageNamed:@"开灯"] forState:UIControlStateNormal];
    [customButton setImage:[UIImage imageNamed:@"关灯"] forState:UIControlStateHighlighted];
    [customButton setImage:[UIImage imageNamed:@"关灯"] forState:UIControlStateSelected];
    // 2.配置背景图
    // [customButton setBackgroundImage:[UIImage imageNamed:@"开灯"] forState:UIControlStateNormal];
    // [customButton setBackgroundImage:[UIImage imageNamed:@"关灯"] forState:UIControlStateHighlighted];
    
    // 配置选中状态，默认为NO
    customButton.selected = NO;
    // 配置是否启用控件，默认为YES
    customButton.enabled = YES;
    customButton.tag = 11;
    
    [customButton addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
    
    [self.view addSubview:customButton];

<pre name="code" class="objc">/* UILabel文本自适应 */
    UIFont *font = [UIFont systemFontOfSize:15];
    // 普通标签
    UILabel *leftLabel = [[UILabel alloc] initWithFrame:CGRectMake(5, 300, 150, 30)];
    leftLabel.text = LONG_STRING;
    leftLabel.font = font;
    leftLabel.backgroundColor = [UIColor greenColor];
    [self.view addSubview:leftLabel];
    [leftLabel release];
    
    // 计算文本所占用空间大小
    // 定义计算空间边界大小
    CGSize constraintSize = CGSizeMake(150, 300);
    // 配置文本绘制选项
    NSStringDrawingOptions options = NSStringDrawingTruncatesLastVisibleLine | NSStringDrawingUsesFontLeading | NSStringDrawingUsesLineFragmentOrigin;
    // 配置计算属性参数
    NSDictionary *attributes = @{NSFontAttributeName: font};
    CGRect rect = [LONG_STRING boundingRectWithSize:constraintSize
 options:options attributes:attributes context:nil];

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UILabel定制：</p>
    // 适应标签
    UILabel *rightLabel = [[UILabel alloc] initWithFrame:CGRectMake(CGRectGetMaxX(leftLabel.frame) + 5, leftLabel.frame.origin.y, CGRectGetWidth(rect), CGRectGetHeight(rect))];
    rightLabel.text = LONG_STRING;
    rightLabel.font = font;
    rightLabel.backgroundColor = [UIColor greenColor];
    // 配置可显示的行数，0表示不限制行数
    rightLabel.numberOfLines = 0;
    // 配置换行模式
    rightLabel.lineBreakMode = NSLineBreakByCharWrapping;
    [self.view addSubview:rightLabel];
    [rightLabel release];

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UITextField<span style="font-family: 'Heiti SC Light';">定制：</span></p>

<pre name="code" class="objc">/* UITextField定制 */
    UITextField *textField = [[UITextField alloc] init];
    textField.bounds = CGRectMake(0, 0, 200, 25);
    textField.center = CGPointMake(160, 200);
    textField.borderStyle = UITextBorderStyleLine;
    textField.placeholder = @"请输入文本...";
    textField.font = font;
    // 配置委托对象
    textField.delegate = self;
    // 配置键盘显示类型
    textField.keyboardType = UIKeyboardTypeDefault;
    // 配置是否使用安全输入
    textField.secureTextEntry = NO;
    // 配置清除按钮显示逻辑
    textField.clearButtonMode = UITextFieldViewModeWhileEditing;
    // 配置是否自动大小写
    textField.autocapitalizationType = UITextAutocapitalizationTypeNone;
    // 配置是否自动更正
    textField.autocorrectionType = UITextAutocorrectionTypeNo;
    [self.view addSubview:textField];
    [textField release];

#pragma mark - UITextFieldDelegate methods

<pre name="code" class="objc">// 每次键盘文本输入时调用
// 文本限制：文本长度限制、文本输入内容限制
- (BOOL)textField:(UITextField *)textField shouldChangeCharactersInRange:(NSRange)range replacementString:(NSString *)string {

    NSLog(@"range = %@ string = %@", NSStringFromRange(range), string);
    
    // 处理退格键
    if (string.length == 0) {
        return YES;
    }
    
    // 限制文本长度10
    if (range.location > 9) {
        return NO;
    }
    
    // 限制文本输入
    if ([@"1234567890" rangeOfString:string].location == NSNotFound) {
        return NO;
    }

    return YES;
}

// 是否可以开始编辑
- (BOOL)textFieldShouldBeginEditing:(UITextField *)textField {
    
    NSLog(@"%@", NSStringFromSelector(_cmd));
    return YES;
}

// 开始编辑
- (void)textFieldDidBeginEditing:(UITextField *)textField {
    
    NSLog(@"%@", NSStringFromSelector(_cmd));
}

// 点击确认按钮时调用
- (BOOL)textFieldShouldReturn:(UITextField *)textField {
    
    NSLog(@"%@", NSStringFromSelector(_cmd));
    
    // 关闭键盘
    [textField resignFirstResponder];
    return YES;
}

// 编辑完成
- (void)textFieldDidEndEditing:(UITextField *)textField {
    
    NSLog(@"%@", NSStringFromSelector(_cmd));
}

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UISwitch <span style="font-family: 'Heiti SC Light';">开关定制：</span></p>

    // UISwitch 开关
    UISwitch *switchControl = [[UISwitch alloc] init];
    switchControl.bounds = CGRectMake(0, 0, 50, 30);
    switchControl.center = CGPointMake(160, 100);
    
    switchControl.onTintColor = [UIColor redColor];
    switchControl.tintColor = [UIColor darkGrayColor];
    switchControl.thumbTintColor = [UIColor blackColor];
    
    [switchControl addTarget:self action:@selector(processControl:) forControlEvents:UIControlEventValueChanged];
    
    [self.view addSubview:switchControl];
    [switchControl release];

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UISlider <span style="font-family: 'Heiti SC Light';">滑条定制：</span></p>
    // UISlider 滑条
    UISlider *slider = [[UISlider alloc] init];
    slider.bounds = CGRectMake(0, 0, 200, 30);
    slider.center = CGPointMake(160, 180);
    slider.minimumValue = 0.0;
    slider.maximumValue = 1.0;
    slider.value = 1.0;
    slider.maximumTrackTintColor = [UIColor grayColor];
    slider.minimumTrackTintColor = [UIColor redColor];
    [slider addTarget:self action:@selector(processControl:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:slider];
    [slider release];

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);"> UISegmentedControl <span style="font-family: 'Heiti SC Light';">分段控件定制：</span></p>
    // UISegmentedControl 分段控件
    UISegmentedControl *segmentedControl = [[UISegmentedControl alloc] initWithItems:@[@"白色", @"红色", @"绿色", @"黄色"]];
    segmentedControl.bounds = CGRectMake(0, 0, 200, 30);
    segmentedControl.center = CGPointMake(160, 284);
    segmentedControl.tintColor = [UIColor blackColor];
    // 配置当前分段选中索引
    segmentedControl.selectedSegmentIndex = 0;
    [segmentedControl addTarget:self action:@selector(processControl:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:segmentedControl];
    [segmentedControl release];

<p style="margin-top: 0px; margin-bottom: 0px; font-size: 18px; font-family: Menlo; color: rgb(75, 209, 87);">UIActivityIndicatorView <span style="font-family: 'Heiti SC Light';">进度指示器定制：</span></p>  
    // UIActivityIndicatorView 进度指示器

<pre name="code" class="objc">    <pre name="code" class="objc">UIActivityIndicatorView *<span style="font-family: Arial, Helvetica, sans-serif;">activityIndicatorView = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleGray];</span>

activityIndicatorView.center = CGPointMake(CGRectGetMidX(self.view.bounds), CGRectGetMidY(self.view.bounds)); [self.view addSubview:activityIndicatorView];

}- (void)processControl:(UIControl *)sender { // 开关 if ([sender isKindOfClass:[UISwitch class]]) { UISwitch *switchControl = (UISwitch *)sender; self.view.backgroundColor = switchControl.isOn ? switchControl.onTintColor : [UIColor whiteColor]; } // 滑条 else if ([sender isKindOfClass:[UISlider class]]) { UISlider *slider = (UISlider *)sender; self.view.alpha = slider.value; } // 分段控件 else if ([sender isKindOfClass:[UISegmentedControl class]]) { UISegmentedControl *segmentedControl = (UISegmentedControl *)sender; NSArray *colors = @[[UIColor whiteColor], [UIColor redColor], [UIColor greenColor], [UIColor yellowColor]]; self.view.backgroundColor = colors[segmentedControl.selectedSegmentIndex]; }}