主なGUIコンポーネントの利用 (1/4)

まずは、「UISwitch」についてです。これは、ON/OFFスイッチのGUIです。パソコンでいる「チェックボックス」に相当するものといっていいでしょう。これは、Interface Builderでは「Switch」というコンポーネントとして用意されています。コンポーネントの主な機能などは、InspectorウインドウのAttributes Inspector（一番左側のアイコン）から設定することができます。

On/OFFの状態は、「State」属性で設定することができます。これは、ポップアップメニューから「On」「Off」を選択できます。UISwitch自体は、このStateの操作さえ出来れば、基本的な利用は可能になります。表示されるサイズは「ON」「OFF」などの表示は固定と考えてください（サイズは調整は可能ですが、基本的にはそのままの大きさで使います）。

では、これを実際に利用する簡単なサンプルを挙げておきましょう。スイッチをタッチして動かすと、現在の状態が表示されるというシンプルなものです。

1. ◯◯ViewController.h（ここではMyIAppViewController.h）に、UILabel *label1とUISwitch * switch1というプロパティと、switch1Action:というメソッドを用意しておきます。

2. Interface Builderで、LabelとSwitchを配置し、それぞれを２つのプロパティに、またSwitchのイベント処理をswitch1Action:にそれぞれ関連付けます。

3. ◯◯ViewController.m（ここではMyIAppViewController.m）に、メソッドの実装を行います。

各ソースコードは下にまとめてありますので、これを参考に記述をしてください。エミュレータで実行し、スイッチをタッチして動かしてみましょう。タッチしてON/OFFするごとに、上のLabelの表示テキストが「Switch:YES」「Swith: NO」と切り替わります。

UISwitchは、メソッドと接続する場合、標準で「Value Changed」という種類のイベントにメソッドが接続されます。これは、値が変化したときに発生するイベントで、ユーザーがタッチして操作するなどしてON/OFF状態が変化すると実行されます。実行されるメソッドでは、以下のような形でON/OFF状態を調べています。

BOOL 変数 = [《UISwitch*》 isOn];

このisOnメソッドで、スイッチがONならばYES、OFFならばNOが取得できます。また、逆に値を変更するためのメソッドとしてsetOn:というものも用意されています。

[《UISwitch*》 setOn:《BOOL》];

これも引数でYESを指定すればONに、NOならばOFFに設定変更されます。非常に簡単なメソッドですので、改めて説明の必要もないでしょう。

(by. SYODA-Tuyano.)

※リストが表示されない場合

AddBlockなどの広告ブロックツールがONになっているとリストなどが表示されない場合があります。これらのツールをOFFにしてみてください。

※MyIAppViewController.h

#import <UIKit/UIKit.h>

@interface MyIAppViewController : UIViewController {
	UILabel * label1;
	UISwitch * switch1;
}

@property (nonatomic, retain) IBOutlet UILabel *label1;
@property (nonatomic, retain) IBOutlet UISwitch * switch1;

- (IBAction)switch1Action:(id)sender;

@end


※MyIAppViewController.m

#import "MyIAppViewController.h"

@implementation MyIAppViewController

@dynamic label1;
@dynamic switch1;
@dynamic slider1;
@dynamic segment1;

- (IBAction)switch1Action:(id)sender {
	BOOL swth = [switch1 isOn];
	NSString* swstr = swth ? @"YES" : @"NO";
	NSString* msg = [NSString stringWithFormat:@"Switch: %@",swstr];
	[label1 setText:msg];
}

……中略……

@end