Autosize(1)~Autosizing

2010. 08. 21
はじめてのiPhoneプログラミング』の次のお題は、オートローテーション(Autorotation)とオートサイジング(Autosizing)です。

デバイスの向きに合わせてビューを回転させると同時に、アスペクト比の変化に伴うオブジェクトパーツのレイアウトやサイズを調整するものです。

本書では三通りの方法が紹介されており、

1)Interface BuilderのInspectorウィンドウのSizeタブにある『Autosizing』の設定
2)コード記述によるオブジェクトパーツの手動調整
3)ポートレート/ランドスケープの各ビューの切り替え

となっています。

今回は1のAutosizingによる設定を説明します。


●プロジェクトの作成

View-based Applicationテンプレートで、プロジェクト名を『Autosize』とします。

703


●オートローテーションの有効化

AutosizeViewController.mを開き、テンプレートで自動生成されてコメントアウトしてあるshouldAutorotateToInterfaceOrientation:メソッドを有効にします。

このメソッドは、ビューコントローラがデバイスの向きに対応するかどうかをブール値で返すメソッドです。
(shouldAutorotateToInterfaceOrientation:メソッドと、interfaceOrientationパラメータについての詳細は『Button Fun』を参照してください)


デフォルトは通常のポートレート(UIInterfaceOrientationPortrait)のみ有効となっています。

今回はこれに加えて左右のランドスケープ(UIInterfaceOrientationLandscapeLeft/UIInterfaceOrientationLandscapeRight)も有効にします。

上下逆のポートレート(UIInterfaceOrientationPortraitUpsideDown)は非推奨とのことですので、無効とします。
(太字が追加した部分)

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

704

旧版の本文では、既存のポートレートに左右のランドスケープを加え、論理和で表しています。
(C言語の基本的な演算子については、ecbさんの目指せプログラマー!/C言語入門:基本的な決まり/1-6. 簡単な演算』などを参照してください)

Apress社のサイト内にサンプルコードの『Beginning iPhone Development Projects Oct 12 2009/05 Autosize 1』では、4つのパラメータの内1つのみ除外していることから、

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

と、上下逆のポートレートを否定で表しています。


●6つのボタンの設置

AutosizeViewController.xibを開き、LibraryウィンドウからRound Rect Buttonをドラッグ&ドロップで6つViewウィンドウに設置します。

各ボタンの位置とサイズは下表の通りです。

 XYWH
Rounded Rect Button (1)20207237
Rounded Rect Button (2)228207237
Rounded Rect Button (3)202127237
Rounded Rect Button (4)2282127237
Rounded Rect Button (5)204037237
Rounded Rect Button (6)2284037237

ButtonのTitleは左上から1~6の番号を設定します。

705

本書にもあるように、この時点では左右ランドスケープモードでビューの回転には対応するものの、ボタンが2つ隠れてしまいます。

706


●Autosizingの設定

Interface Builderでボタンを選択した状態で、InspectorウィンドウのSizeタブを開くと『Autosizing』という項目があります。

ここでビューのアスペクトが変更された場合における、選択されているオブジェクトのレイアウトとサイズを調整することができます。

707

・レイアウトの調整

Autosizingの左側にある二重の四角で、外側と内側の間にある『I』型の記号は支柱(Struts)と呼ばれるもので、ビューの端からオブジェクトを固定するかどうかを表します。

実線の『I』ではその端に固定され、破線では非固定となります。

・サイズの調整

内側の四角内にある『←→』記号はバネ(Spring)と呼ばれるもので、ビューのサイズ変化に対してオブジェクトのサイズを拡大縮小するかを表します。

実線の『←→』では拡大縮小し、破線ではサイズ固定となります。

・本書での記述内容

本書(およびサンプルコード)ではサイズ調整はせず、レイアウトの調整のみ行っています。

各ボタンの隣接するビューの端(『1』は『上と左』、『3』は『左』、『5』は『左と下』)に支柱を設定しています。

708

709

支柱はポートレート/ランドスケープに関わらず20ピクセルとなっています。

色々設定して試すと分かりますが、バネや支柱による自動調整は必ずしもレイアウトやサイズが期待している通りにはなるわけではないので、きっちり設定したい場合は手動調整やビューの切り替えを行う必要があります。


●ビューの自動サイズ調整の動作設定

ユーザがウィンドウのサイズを変更した時、システムはオートサイジングの規則に従って、自動的にウィンドウ内のビューをリサイズします。
(オートサイジングはビューにも適用され、例えば分割ビューではそれ自身が動的にサイズ変更することができます)

全てのiOSとMac OS Xアプリケーションはオートサイジング規則をサポートしており、ビューのリサイズにおいて手動でコードを記述する必要が無いようにしています。

オートサイジング規則は、ビューが拡大または縮小された新しい領域を満たすように、フレームと親ビューのフレーム間の領域を固定または可変値によって決定します。

Interface BuilderではInspectorのSizeを使って、下図に示すようにデフォルトでのビューのオートサイジング規則を構成することができます。

オートサイジングの制御はバネ(Springs)と支柱(Structs)を用いて、選択したビューと親フレームとの関係を定義します。

バネはスーパービューの幅と高さを元に、リサイズしたビューに比例して変更されます。

支柱はスーパービューでの縁からの固定された距離を、ビューでも保持します。

Inspectorでは、バネと支柱の変更によるビューのオートサイジングの動作結果を、アニメーションとして視覚的描写でコントロールの右側に表示します。

図:ビューのオートサイジング規則の構成

711

Interface Builderでのビューのオートサイジングの動作に、プログラミングによって構成を追加することができます。

UIViewオブジェクトの場合は、ビューのautoresizingMaskプロパティを使います。

NSViewオブジェクトの場合は、ビューのsetAutoresizingMask:メソッドを使います。

CarbonではHIViewSetLayoutInfo関数を使います。

重要:Cocoaのnibファイルで、Interface Builderでビューのバネや支柱を設定しない状態で、setAutoresizingMask:メソッドを使って実行時にオートサイジングの動作を追加しても、ビューはオートリサイジングの動作を訂正して提示することができません。
その理由は、Interface Builderにおいて親ビューの子がバネや支柱の設定をしていないと、オートサイジングが無効になるからです。
オートサイジングを再び有効にするには、親ビューにsetAutoresizesSubviews:メソッドでYESを渡す必要があります。
つまり、子ビューは正しくautosizeの設定をする必要があります。



参考文献

目指せプログラマー!/C言語入門:基本的な決まり/1-6. 簡単な演算

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

商品詳細を見る






bose_soundsport_free
0 Comments
Leave a comment
管理者にだけ表示を許可する
Top
0 Trackbacks
Top
Calendar
09 | 2017/10 | 11
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

bose_soundsport_free
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