Nav(4)~Disclosure Buttons(1)

2011. 01. 03
●Disclosure Buttonsの概要

一つ目のサブビューとなるDisclosure Buttonsの概要を説明します。

1009

ルートビューテーブルの1行目にある『Disclosure Buttons』をタップするとサブビューのテーブルに移行します。

1012

各行の右側には詳細ビューを示すアクセサリアイコン(UITableViewCellAccessoryDetailDisclosureButton)があります。

このアクセサリは行と独立して応答することができ、タップすると詳細ビューが表示されます。

1010

アクセサリ以外の行の領域をタップするとアラートが表示されます。

1013

階層構造は以下のようになります。

ルートコントローラ(ナビゲーションコントローラ):NavAppDelegate
|
∟ルートビューコントローラ:FirstLevelViewController
|
∟Disclosure Buttons:DisclosureButtonController
|
∟詳細ビュー:DisclosureDetailController


●アイコン画像の追加

ルートビューのテーブルに表示するサブビューのリストで、セルの左側に表示するアイコンを追加します。

Apress社のサイト内のサンプルコードの『09 Nav』フォルダ内にある『Images』フォルダを自身のNavプロジェクトのフォルダにコピーし、XcodeのResources下にフォルダごとドラッグ&ドロップしてプロジェクトに追加します。

button_doen.pngとbutton_up.pngは旧版の本書では使用しませんが、サンプルコードのRow Controlsでスイッチの代わりとして設置するボタンで使用する画像です。

1009


●詳細ビュー画像の追加

本書やサンプルコードにはありませんが、Disclosure Buttonsでの詳細ビューが殺風景なので背景画像を埋め込んでみます。

1010

先のImagesフォルダ下に『Background』フォルダを作成し、使用する画像ファイルを追加、XcodeのResourcesのImages下にBackgroundフォルダごと追加します。

1011


●DisclosureButtonControllerとDisclosureDetailControllerクラスの作成

ルートビューで『Disclosure Buttons』をタップした時に応答するサブビューコントローラDisclosureButtonControllerと、そのサブビューのテーブルにあるアクセサリをタップした時に応答する詳細ビューコントローラDisclosureDetailControllerクラスを作成します。

本書では両クラスともUIViewController subclassテンプレートで生成するように説明されていますが、ここではDisclosureButtonControllerをUITableViewController subclassテンプレートで生成します。

DisclosureDetailControllerはテーブルではありませんので、UIViewController subclassテンプレートで生成します。

1014


●詳細ビューのヘッダファイルDisclosureDetailController.hの編集

詳細ビューでは画面をnibファイルで構成するので、画面に文字列と画像を表示するアウトレットが必要になります。

また、親ビューとなるサブビューDisclosureButtonControllerから、選択した行の情報を受け渡しするための変数も用意します。
(太字が追加した部分)

#import <UIKit/UIKit.h>

@interface DisclosureDetailController : UIViewController {
UILabel *label;
NSString *message;
UIImageView *imageView;
NSString *imageName;

}

@property (nonatomic, retain) IBOutlet UILabel *label;
@property (nonatomic, retain) NSString *message;
@property (nonatomic, retain) IBOutlet UIImageView *imageView;
@property (nonatomic, retain) NSString *imageName;


@end

1015

画面に表示するアウトレットとして、文字列はlabel、画像はimageViewを宣言します。

DisclosureButtonControllerから引き継ぐ文字列として、文字用にmessage、画像用にimageNameを宣言します。


●詳細ビューのソースファイルDisclosureDetailController.mの編集

親ビューコントローラであるDisclosureButtonControllerから受け取った文字列のプロパティmessageとimageNameを使って、詳細ビューの表示を行います。
(太字が追加・修正した部分)

#import "DisclosureDetailController.h"

@implementation DisclosureDetailController

@synthesize label;
@synthesize message;
@synthesize imageView;
@synthesize imageName;


// The designated initializer. Override if you create the controller programmatically and want to perform customization that is not appropriate for viewDidLoad.
- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil {
self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
if (self) {

// Custom initialization.
}
return self;
}

- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
label.text = message;
imageView.image = [UIImage imageNamed:imageName];
}


// Override to allow orientations other than the default portrait orientation.
- (BOOL)shouldAutorotateToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation {
// Return YES for supported orientations.
return (interfaceOrientation == UIInterfaceOrientationPortrait);
}


- (void)didReceiveMemoryWarning {
// Releases the view if it doesn't have a superview.
[super didReceiveMemoryWarning];

// Release any cached data, images, etc. that aren't in use.
}

- (void)viewDidUnload {
[super viewDidUnload];
// Release any retained subviews of the main view.
// e.g. self.myOutlet = nil;

self.label = nil;
self.message = nil;
self.imageView = nil;
self.imageName = nil;

}

- (void)dealloc {
[label release];
[message release];
[imageView release];
[imageName release];

[super dealloc];
}

@end

1016

1)4つのプロパティの実装

ヘッダファイルで宣言したlabel、message、imageView、imageNameの4つのプロパティを実装します。

2)initWithNibName:bundle:の実装

Apress社のサイト内のサンプルコードでは省略されていますが、旧版の本書にはあるのでinitWithNibName:bundle:のコメントアウトを解除しています。

デフォルトのままで編集はしていません。

3)viewWillAppear:の実装

UITableViewController subclassテンプレートで作ったDisclosureButtonController.m内にあるviewWillAppear:メソッドをコピーして追記します。

本書やサンプルコードではスーパークラスによる初期化を最後に行っていますが、Apple公式のサンプルコードをいくつか見てもスーパークラスでの初期化を先に行っているので、それに従います。

viewWillAppear:メソッドはビューを表示する直前の処理で、詳細ビューに表示するラベルをtextプロパティで、画像はimageプロパティにimageNamed:メソッドで設定しています。

4)不要なメソッド

UIViewController subclassテンプレートで自動生成されるloadViewviewDidLoadメソッドは、今回使用しないので削除します。

5)shouldAutorotateToInterfaceOrientation:の実装

サンプルコードでは省略されていますが本書にはあるので、shouldAutorotateToInterfaceOrientation:のコメントアウトを解除してデフォルトのまま実装しています。

6)viewDidUnloadの実装

viewDidUnloadで4つのプロパティの所有権放棄を追加しています。

7)deallocの実装

deallocで4つのプロパティの解放を追加しています。


●詳細ビューのnibファイルの作成

DisclosureDetailControllerで使用するnibファイルDisclosureDetail.xibを作成します。

XcodeのResourcesを右クリックして『追加』→『新規ファイル...』を選択し、左ペインでiOSのUser Interfaceを、右上ペインで『View XIB』を選択し、ファイル名をDisclosureDetailとします。

1017

作成したDisclosureDetail.xibをダブルクリックし、Interface Builderで開きます。

1018

自動生成されるViewはW:320、H:460で固定になっていますが、実際に表示されるビューはナビゲーションバーを除いたH:416になるので入れ替えます。

LibraryウィンドウからDocumentウィンドウへViewをドラッグ&ドロップし、InspectorウィンドウのSizeパネルでH:416に変更し、元のViewは削除します。

次にラベルとイメージビューを設定します。

入れ替えたViewをダブルクリックしてViewウィンドウを開き、そこにLibraryウィンドウからLabelとImage Viewをドラッグ&ドロップで追加します。

InspectorウィンドウのSizeパネルを開き、LabelはX:20、Y:100、W:280、H:21に、Image Viewは(表示する画像のサイズが320x200ピクセルの場合)X:0、Y:216、W:320、H:200に設定します。

それとAttributesパネルでLabelのLayoutのAlignmentを中央揃えに設定します。

1019

部品の配置が終わったらクラスの設定とアウトレットの接続を行います。

DocumentウィンドウでFile's Ownerを選択し、InspectorウィンドウのIdentiryパネルで、Class IdentityのClassをDisclosureDetailControllerに設定します。

そしてConnectionsパネルを開き、OutletsのimageViewとlabel、viewをそれぞれ接続し、ファイルを保存します。

1020



参考文献

はじめてのiPhone3プログラミングはじめてのiPhone3プログラミング
(2009/12/17)
Dave Mark、Jeff LaMarche 他

商品詳細を見る






SoundSport Pulse wireless headphones
0 Comments
Leave a comment
管理者にだけ表示を許可する
Top
0 Trackbacks
Top
Calendar
04 | 2017/05 | 06
Sun Mon Tue Wed Thu Fri Sat
- 1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31 - - -
Recent Articles
iTunes


Swift
Categories
Tips
Profile

水月杏香

Author:水月杏香
永遠の初心者プログラマ。

Wish List
WACOM


ARC
Technical Q&A
情報プロパティリストキー
Start Developing iOS Apps Today
BOSE

SoundSport Pulse wireless headphones
Reference
NSApplicationDelegateプロトコル
NSArrayクラス
NSAutoreleasePoolクラス
NSBundleクラス
NSBundle UIKit追加分
NSCalendarクラス
NSCoderクラス
NSCodingプロトコル
NSCopyingプロトコル
NSDataクラス
NSDateクラス
NSDateFormatterクラス
NSDictionaryクラス
NSEntityDescriptionクラス
NSEnumeratorクラス
NSErrorクラス
NSExceptionクラス
NSFetchRequestクラス
NSFileHandleクラス
NSFileManagerクラス
NSIndexPathクラス
NSIndexPath UIKit追加分
NSKeyedArchiverクラス
NSKeyedUnarchiverクラス
NSKeyValueCodingプロトコル
NSLocaleクラス
NSManagedObjectクラス
NSManagedObjectContextクラス
NSManagedObjectModelクラス
NSMutableArrayクラス
NSMutableCopyingプロトコル
NSMutableDictionaryクラス
NSMutableSetクラス
NSNotificationクラス
NSNotificationCenterクラス
NSNullクラス
NSNumberクラス
NSObjectクラス
NSObject UIKit追加分
NSObjectプロトコル
NSPersistentStoreクラス
NSPersistentStoreCoordinatorクラス
NSPredicateクラス
NSPropertyListSerializationクラス
NSRunLoopクラス
NSSetクラス
NSStringクラス
NSString UIKit追加分
NSTimerクラス
NSTimeZoneクラス
NSURLクラス
NSURLProtectionSpaceクラス
NSURLRequestクラス
NSUserDefaultsクラス
NSValueクラス

UIActionSheetクラス
UIActionSheetDelegateプロトコル
UIActivityIndicatorViewクラス
UIAlertViewクラス
UIAlertViewDelegateプロトコル
UIApplicationクラス
UIApplicationDelegateプロトコル
UIBarButtonItemクラス
UIBarItemクラス
UIButtonクラス
UIColorクラス
UIControlクラス
UIDatePickerクラス
UIDeviceクラス
UIEventクラス
UIFontクラス
UIGestureRecognizerクラス
UIImageクラス
UIImageViewクラス
UIKit Function
UILabelクラス
UINavigationControllerクラス
UINavigationItemクラス
UIPickerViewクラス
UIPickerViewDataSourceプロトコル
UIPickerViewDelegateプロトコル
UIPinchGestureRecognizerクラス
UIResponderクラス
UIScreenクラス
UIScrollViewクラス
UISearchBarクラス
UISearchBarDelegateプロトコル
UISegmentedControlクラス
UISliderクラス
UISwipeGestureRecognizerクラス
UISwitchクラス
UITableViewクラス
UITableViewCellクラス
UITableViewControllerクラス
UITableViewDataSourceプロトコル
UITableViewDelegateプロトコル
UITapGestureRecognizerクラス
UITextFieldクラス
UITextFieldDelegateプロトコル
UITextInputTraitsプロトコル
UITextViewクラス
UITextViewDelegateプロトコル
UIToolbarクラス
UITouchクラス
UIViewクラス
UIViewControllerクラス
UIWebViewクラス
UIWebViewDelegateプロトコル
UIWindowクラス

AVAudioPlayerクラス
AVAudioPlayerDelegateプロトコル

CADisplayLinkクラス
CAEAGLLayerクラス
CALayerクラス

CGAffineTransform
CGBitmapContext
CGColor
CGColorSpace
CGContext
CGGeometry
CGImage
CGPath

EAGLContextクラス
EAGLDrawableプロトコル

Foundation Constants
Foundation Data Types
Foundation Functions

MPMediaItemクラス
MPMediaItemArtworkクラス
MPMediaPlaylistクラス
MPMediaPropertyPredicateクラス
MPMediaQueryクラス
MPMusicPlayerControllerクラス

Randomization Services

System Sound Services
Amazon


OpenGL ES
SQLite
Monthly Archives
Recent Comments
Recent TrackBacks
RSS Link
Visitors
QR Code
QR