【Demo】UIKit重写UIButton自定义复选框UICheckBox

UIKit复选框自定义

最新推荐文章于 2018-05-14 20:02:13 发布

原创最新推荐文章于 2018-05-14 20:02:13 发布 · 1.7k 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#uikit #uibutton #checkbox #框架

iOS沉思录专栏收录该内容

55 篇文章

订阅专栏

本文介绍如何在UIKit框架中自定义复选框组件。利用UIButton的状态特性，创建UICheckBox类，实现复选框的功能。文中提供了详细的类定义及使用示例。

思路：

UIKit框架中没有checkbox复选框的组件，但是UIButton组件有UIControlStateNormal和UIControlStateSelected两个状态，并且有selected属性纪录按钮是否被选中，因此可以继承按钮组件实现一个复选框的组件。

自定义UICheckBox类

这里定义了使用frame初始化复选框的函数和几种初始化复选框按钮图片的方法，初始化函数可以根据需要自己设计添加，也就是按照‘万能初始化’设计方式来设计完善这个复选框组件。

UICheckBox.h

//
//  UICheckBox.h
//  demo
//
//  Created by Jiangxh on 15/9/23.
//  Copyright © 2015年 Jiangxh. All rights reserved.
//
/************************************
 * 重写UIButton成复选框组件
 ************************************/
#import <UIKit/UIKit.h>

@interface UICheckBox : UIButton

/**
 *  复选框选中状态
 */
@property (nonatomic)BOOL isChecked;

/**
 *  用frame初始化checkbox按钮
 */
- (UICheckBox *)initWithFrame:(CGRect)frame;
/**
 *  设置未选中图片
 */
- (void)setNormalImage:(UIImage*)normalImage;
/**
 *  设置选中图片
 */
- (void)setSelectedImage:(UIImage*)selectedImage;
/**
 *  设置选中和未选中图片
 */
- (void)setImage:(UIImage*)normalImage andSelectedImage:(UIImage*)selectedImage;


/**
 *  用字符串设置未选中图片
 */
- (void)setNormalImageWithName:(NSString*)normalImageName;
/**
 *  用字符串设置选中图片
 */
- (void)setSelectedImageWithName:(NSString*)selectedImageName;
/**
 *  用字符串设置图片
 */
- (void)setImageWithName:(NSString*)normalImageName andSelectedName:(NSString*)selectedImageName;
/**
 * 按钮点击事件，点击后取反按钮状态
 */
-(void)checkboxClick;
@end

UICheckBox.m

//
//  UICheckBox.m
//  demo
//
//  Created by Jiangxh on 15/9/23.
//  Copyright © 2015年 Jiangxh. All rights reserved.
//
#import "UICheckBox.h"

@implementation UICheckBox

/**
 * 初始化checkbox按钮
 */
- (UICheckBox *)initWithFrame:(CGRect)frame {
    if ([super initWithFrame:frame]) {
        // 开始的时候设置复选框是未选中的
        self.selected = NO;
        _isChecked = NO;
        // 设置checkobx的监听事件
        [self addTarget:self action:@selector(checkboxClick) forControlEvents:UIControlEventTouchUpInside];
        return self;
    }
    return nil;
}

/**
 *  设置未选中图片
 */
- (void)setNormalImage:(UIImage*)normalImage {
    [self setImage:normalImage forState:UIControlStateNormal];
}
/**
 *  设置选中图片
 */
- (void)setSelectedImage:(UIImage*)selectedImage {
    [self setImage:selectedImage forState:UIControlStateSelected];
}
/**
 *  设置图片
 */
- (void)setImage:(UIImage*)normalImage andSelectedImage:(UIImage*)selectedImage {
    [self setNormalImage:normalImage];
    [self setSelectedImage:selectedImage];
}

/**
 *  用字符串设置未选中图片
 */
- (void)setNormalImageWithName:(NSString*)normalImageName {
    [self setNormalImage:[UIImage imageNamed:normalImageName]];
}
/**
 *  用字符串设置选中图片
 */
- (void)setSelectedImageWithName:(NSString*)selectedImageName {
    [self setSelectedImage:[UIImage imageNamed:selectedImageName]];
}
/**
 *  用字符串设置图片
 */
- (void)setImageWithName:(NSString*)normalImageName andSelectedName:(NSString*)selectedImageName {
    [self setNormalImageWithName:normalImageName];
    [self setSelectedImageWithName:selectedImageName];
}

/**
 *按钮点击事件，点击后取反按钮状态
 */
-(void)checkboxClick {
    // 取反复选框状态，通过取按钮的selected属性可以判断复选框当前有没有选中
    self.selected = !self.selected;
    _isChecked = self.selected;
    //后台打印调试
    if (self.selected) {
        NSLog(@"1");
    }else{
        NSLog(@"0");
    }
}

@end

组件使用测试

#define boxSize 50 //复选框尺寸
    
    // 定义复选框
    UICheckBox *checkbox = [[UICheckBox alloc] initWithFrame:CGRectMake(ApplicationW/2 - boxSize/2, ApplicationH/3, boxSize, boxSize)];
    // 设置复选框选中和未选中时的图片
    [checkbox setImageWithName:@"checkbox_off" andSelectedName:@"checkbox_on"];
    // 添加到当前视图
    [self.view addSubview:checkbox];