自定义控件复选框和单选框的实现

系统 1401 0

我们先实现单个按钮,为了复用,不管单选还是复选按钮都是使用同一个类来实现,为了区别单选还是复选,我们用一个自定义枚举类型 CheckButtonStyle属性style来区别,当其值设置为CheckButtonStyleDefault或CheckButtonStyleBox时,为复选按钮:

当其值设为 CheckButtonStyleRadio时,为单选按钮:

当按钮在选中/反选状态间切换时 ,文字左边的图片自动转换。

整个控件是由一个 ImageView、一个Label、一个BOOL变量及其他变量组成,.h文件如下:

typedef enum {

CheckButtonStyleDefault = 0 ,

CheckButtonStyleBox = 1 ,

CheckButtonStyleRadio = 2

} CheckButtonStyle;

#import <Foundation/Foundation.h>

@interface CheckButton : UIControl {

//UIControl* control;

UILabel * label ;

UIImageView * icon ;

BOOL checked ;

id value , delegate ;

CheckButtonStyle style ;

NSString * checkname ,* uncheckname ; // 勾选/反选时的图片文件名

}

@property ( retain , nonatomic ) id value,delegate;

@property ( retain , nonatomic )UILabel* label;

@property ( retain , nonatomic )UIImageView* icon;

@property ( assign )CheckButtonStyle style;

-( CheckButtonStyle )style;

-( void )setStyle:( CheckButtonStyle )st;

-( BOOL )isChecked;

-( void )setChecked:( BOOL )b;

@end

具体实现如下:

#import "CheckButton.h"

@implementation CheckButton

@synthesize label,icon,value,delegate;

-( id )initWithFrame:( CGRect ) frame

{

if ( self =[ super initWithFrame : frame ]) {

icon =[[ UIImageView alloc ] initWithFrame :

CGRectMake ( 10 , 0 , frame . size . height , frame . size . height )];

[ self setStyle : CheckButtonStyleDefault ]; // 默认风格为方框(多选)样式

//self.backgroundColor=[UIColor grayColor];

[ self addSubview : icon ];

label =[[ UILabel alloc ] initWithFrame : CGRectMake ( icon . frame . size . width + 24 , 0 ,

frame . size . width - icon . frame . size . width - 24 ,

frame . size . height )];

label . backgroundColor =[ UIColor clearColor ];

label . font =[ UIFont fontWithName : @"Arial" size : 20 ];

label . textColor =[ UIColor

colorWithRed : 0xf9 / 255.0

green : 0xd8 / 255.0

blue : 0x67 / 255.0

alpha : 1 ];

label . textAlignment = UITextAlignmentLeft ;

[ self addSubview : label ];

[ self addTarget : self action : @selector ( clicked ) forControlEvents : UIControlEventTouchUpInside ];

}

return self ;

}

-( CheckButtonStyle )style{

return style ;

}

-( void )setStyle:( CheckButtonStyle )st{

style =st;

switch ( style ) {

case CheckButtonStyleDefault :

case CheckButtonStyleBox :

checkname = @"checked.png" ;

uncheckname = @"unchecked.png" ;

break ;

case CheckButtonStyleRadio :

checkname = @"radio.png" ;

uncheckname = @"unradio.png" ;

break ;

default :

break ;

}

[ self setChecked : checked ];

}

-( BOOL )isChecked{

return checked ;

}

-( void )setChecked:( BOOL )b{

if (b!= checked ){

checked =b;

}

if ( checked ) {

[ icon setImage :[ UIImage imageNamed : checkname ]];

} else {

[ icon setImage :[ UIImage imageNamed : uncheckname ]];

}

}

-( void )clicked{

[ self setChecked :! checked ];

if ( delegate != nil ) {

SEL sel= NSSelectorFromString ( @"checkButtonClicked" );

if ([ delegate respondsToSelector :sel]){

[ delegate performSelector :sel];

}

}

}

-( void )dealloc{

value = nil ; delegate = nil ;

[ label release ];

[ icon release ];

[ super dealloc ];

}

@end

使用 CheckButton类很简单,构造、设置标签文本等属性,然后addSubview:

CheckButton * cb=[[ CheckButton a lloc ] initWithFrame : CGRectMake ( 20 , 60 , 260 , 32 )];

cb. label . text = @"checkbutton1" ;

cb. value =[[ NSNumber alloc ] initWithInt : 18 ];

cb. style = CheckButtonStyleDefault ;

[ self . view addSubview :cb];

二、单选按钮组的实现

复选按钮无所谓“组”的概念,单选按钮则不同。在同一个组中,单选按钮只允许同时选择一个按钮,不能选多个,因此我们要实现一个单选按钮组的类:

#import <Foundation/Foundation.h>

#import "CheckButton.h"

@interface RadioGroup : NSObject {

NSMutableArray * children ;

NSString * text ;

id value ;

}

@property ( readonly )NSString* text;

@property ( readonly ) id value;

-( void )add:( CheckButton *)cb;

-( void )checkButtonClicked:( id )sender;

@end

#import "RadioGroup.h"

@implementation RadioGroup

@synthesize text,value;

-( id )init{

if ( self =[ super init ]){

children =[[ NSMutableArray alloc ] init ];

}

return self ;

}

-( void )add:( CheckButton *)cb{

cb. delegate = self ;

if (cb. checked ) {

text =cb. label . text ;

value =cb. value ;

}

[ children addObject :cb];

}

-( void )checkButtonClicked:( id )sender{

CheckButton * cb=( CheckButton *)sender;

if (!cb. checked ) {

// 实现单选

for ( CheckButton * each in children ){

if (each. checked ) {

[each setChecked : NO ];

}

}

[cb setChecked : YES ];

// 复制选择的项

text =cb. label . text ;

value =cb. value ;

}

NSLog ( @"text:%@,value:%d" , text ,[( NSNumber *) value intValue ]);

}

-( void )dealloc{

[ text release ];

value = nil ;

[ children release ];

[ super dealloc ];

}

@end

单选按钮组在 ViewController中的使用:

-( id )initWithNibName:( NSString *)nibNameOrNil bundle:( NSBundle *)nibBundleOrNil{

if ( self =[ super initWithNibName :nibNameOrNil bundle :nibBundleOrNil]){

// 单选按钮组

rg =[[ RadioGroup alloc ] init ];

// 1 个单选按钮

CheckButton * cb=[[ CheckButton alloc ] initWithFrame : CGRectMake ( 20 , 60 , 260 , 32 )];

// 把单选按钮加入按钮组

[ rg add :cb];

cb. label . text = @"★" ;

cb. value =[[ NSNumber alloc ] initWithInt : 1 ];

// 把按钮设置为单选按钮样式

cb. style = CheckButtonStyleRadio ;

// 加入视图

[ self . view addSubview :cb];

[cb release ]; //add 后,会自动持有,可以释放

// 2 个单选按钮

cb=[[ CheckButton alloc ] initWithFrame : CGRectMake ( 20 , 100 , 260 , 32 )];

[ rg add :cb];

cb. label . text = @"★★" ;

cb. value =[[ NSNumber alloc ] initWithInt : 2 ];

cb. style = CheckButtonStyleRadio ;

[ self . view addSubview :cb];

[cb release ];

// 3 个单选按钮

cb=[[ CheckButton alloc ] initWithFrame : CGRectMake ( 20 , 140 , 260 , 32 )];

// 各种属性必须在 [rg addv] 之前设置,否则 text value 不会被 populate

cb. checked = YES ;

cb. label . text = @"★★★" ;

cb. value =[[ NSNumber alloc ] initWithInt : 3 ];

cb. style = CheckButtonStyleRadio ;

[ self . view addSubview :cb];

[ rg add :cb]; // 属性设置完之后再 add

[cb release ];

// 4 个单选按钮

cb=[[ CheckButton alloc ] initWithFrame : CGRectMake ( 20 , 180 , 260 , 32 )];

[ rg add :cb];

cb. label . text = @"★★★★" ;

cb. value =[[ NSNumber alloc ] initWithInt : 4 ];

cb. style = CheckButtonStyleRadio ;

[ self . view addSubview :cb];

[cb release ];

// 5 个单选按钮

cb=[[ CheckButton alloc ] initWithFrame : CGRectMake ( 20 , 220 , 260 , 32 )];

[ rg add :cb];

cb. label . text = @"★★★★★" ;

cb. value =[[ NSNumber alloc ] initWithInt : 5 ];

cb. style = CheckButtonStyleRadio ;

[ self . view addSubview :cb];

[cb release ];

}

return self ;

}

运行效果:

自定义控件复选框和单选框的实现

自定义控件复选框和单选框的实现


更多文章、技术交流、商务合作、联系博主

微信扫码或搜索:z360901061

微信扫一扫加我为好友

QQ号联系: 360901061

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描下面二维码支持博主2元、5元、10元、20元等您想捐的金额吧,狠狠点击下面给点支持吧,站长非常感激您!手机微信长按不能支付解决办法:请将微信支付二维码保存到相册,切换到微信,然后点击微信右上角扫一扫功能,选择支付二维码完成支付。

【本文对您有帮助就好】

您的支持是博主写作最大的动力,如果您喜欢我的文章,感觉我的文章对您有帮助,请用微信扫描上面二维码支持博主2元、5元、10元、自定义金额等您想捐的金额吧,站长会非常 感谢您的哦!!!

发表我的评论
最新评论 总共0条评论