1. 程式人生 > >iOS-自定義單選複選按鈕

iOS-自定義單選複選按鈕

我們先實現單個按鈕,為了複用,不管單選還是複選按鈕都是使用同一個類來實現,為了區別單選還是複選,我們用一個自定義列舉型別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 ;

}

執行效果: