UISegmentedControl方便使用者來做選擇,
參考網頁 http://furnacedigital.blogspot.tw/2011/08/uisegmentedcontrol.html
UISegmentedControl 可以製作出多選項的按鈕物件,有點類似 Radio Button
的感覺,使用者在同一組選項中,一次只能選擇一個項目,每一個項目的背後都會有一個對應值,它們可以是該項目的 Title 、Index
或是自行設定的 Array 參數。
實作上有靜態及動態設定,因此在實作上使用一個靜態來選擇三個動態的UISegmentedControl元件,並以動態的UISegmentedControl元件來選擇圖檔。
以下是我的實作例
1. 開啓一個專案
2. 拉入一個UISegmentedControl元件到storyBoard,並設定Tag為 100
3. 加入圖檔到專案內,此處使用Mac上的圖檔
4. 將UISegmentedControl元件註冊到mainViewController.h,並加入三個UISegmentedControl給動態設定使用。
#import <UIKit/UIKit.h>
@interface mainViewController : UIViewController
@property (weak, nonatomic) IBOutlet UISegmentedControl *segmentSelector;
@property (nonatomic) UISegmentedControl *selector1;
@property (nonatomic) UISegmentedControl *selector2;
@property (nonatomic) UISegmentedControl *selector3;
@end
5. 將相關的程式碼加到mainViewController.m
#import "mainViewController.h"
@interface mainViewController ()
@end
@implementation mainViewController
@synthesize segmentSelector;
@synthesize selector1, selector2, selector3;
- (void)viewDidLoad
{
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (IBAction)selectOtherSegment:(id)sender {
NSNumber *value = [NSNumber numberWithInt:[sender selectedSegmentIndex]];
switch ([sender selectedSegmentIndex]) {
case 0:
[self setSelector1];
break;
case 1:
[self setSelector2];
break;
case 2:
[self setSelector3];
break;
default:
[self setSelector1];
break;
}
}
- (void) setSelector1
{
[self removeSubViewByLabelClass];
NSArray *itemArray =[NSArray arrayWithObjects:@"Green Apple", @"Orange", @"Pear",@"Red Apple", @"Strawberry",nil];
//使用陣列來建立UISegmentedControl
selector1 = [[UISegmentedControl alloc] initWithItems:itemArray];
//設定外觀大小與初始選項
selector1.segmentedControlStyle = UISegmentedControlStyleBar;
selector1.frame = CGRectMake(20.0, 100.0, 500.0, 44.0);
selector1.selectedSegmentIndex = 0;
selector1.tag = 1;
//設定所觸發的事件條件與對應事件
[selector1 addTarget:self action:@selector(chooseOne:) forControlEvents:UIControlEventValueChanged];
//加入畫面中並釋放記憶體
[self.view addSubview:selector1];
}
- (void) setSelector2
{
[self removeSubViewByLabelClass];
NSArray *itemArray =[NSArray arrayWithObjects:@"Bluehound", @"Doggie", @"Pointy",@"PurpGuy",@"RedDog",@"Woof", nil];
//使用陣列來建立UISegmentedControl
selector2 = [[UISegmentedControl alloc] initWithItems:itemArray];
//設定外觀大小與初始選項
selector2.segmentedControlStyle = UISegmentedControlStyleBar;
selector2.frame = CGRectMake(20.0, 200.0, 600.0, 44.0);
selector2.selectedSegmentIndex = 0;
selector1.tag = 2;
//設定所觸發的事件條件與對應事件
[selector2 addTarget:self action:@selector(chooseOne:) forControlEvents:UIControlEventValueChanged];
//加入畫面中並釋放記憶體
[self.view addSubview:selector2];
}
- (void) setSelector3
{
[self removeSubViewByLabelClass];
NSArray *itemArray =[NSArray arrayWithObjects:@"African Daisy", @"Dandelion", @"Ixia", @"Spiked",@"Sunflower",nil];
//使用陣列來建立UISegmentedControl
selector3 = [[UISegmentedControl alloc] initWithItems:itemArray];
//設定外觀大小與初始選項
selector3.segmentedControlStyle = UISegmentedControlStylePlain; //UISegmentedControlStyleBar;
selector3.frame = CGRectMake(20.0, 300.0, 550.0, 44.0);
selector3.selectedSegmentIndex = 0;
selector1.tag = 3;
//設定所觸發的事件條件與對應事件
[selector3 addTarget:self action:@selector(chooseOne:) forControlEvents:UIControlEventValueChanged];
//加入畫面中並釋放記憶體
[self.view addSubview:selector3];
}
- (void)chooseOne:(id)sender {
[self removeSubViewByTag:101];
//NSLog(@"%@", [sender titleForSegmentAtIndex:[sender selectedSegmentIndex]]);
UIImageView *a1 = [[UIImageView alloc]initWithFrame:CGRectMake(100, 500, 200,200)];
[a1 setImage: [UIImage imageNamed:[NSString stringWithFormat:@"%@.gif",[sender titleForSegmentAtIndex:[sender selectedSegmentIndex]]]]];
//a1.alpha = 0.3f;
a1.tag = 101;
[self.view addSubview:a1];
[self.view sendSubviewToBack:a1];
}
- (void) removeSubViewByTag:(int)tag
{
for(UIView *subview in [self.view subviews]) {
if (subview.tag == tag)
[subview removeFromSuperview];
}
}
- (void) removeSubViewByLabelClass
{
for(UIView *subview in [self.view subviews]) {
if([subview isKindOfClass:[UISegmentedControl class]]) {
if (subview.tag != 100)
[subview removeFromSuperview];
} else {
// Do nothing - not a UIButton or subclass instance
}
}
}
@end
6. 執行結果,選擇右邊的UISegmentedControl,來產生左邊的UISegmentedControl,再以左邊的選擇來展示同名的圖檔。





