QuartzFun(1)

2011. 08. 07
iOSアプリケーションでの描画には、これまでのようにUIKitによって予め提供されている部品を組み合わせて使用する方法の他に、一からビューを構築できるQuartz 2DとOpenGL ESの2つの方法があります。

Quartzは2D専用で、OpenGL ESは2D/3Dの両方をサポートしています。

本書では同じ内容の描画アプリケーションを、Quartz版(QuartzFun)とOpenGL ES版(GLFun)で作成し、それぞれの描画方法とその違いを勉強します。


●描画アプリケーションの概要

7452

画面上部のナビゲーションバーには描画色を選択するセグメンテッドコントロールが、画面下部のツールバーには描画図形を選択するセグメンテッドコントロールがあり、中央のグレー部分が描画するキャンバスとなっています。

7453

7454

7455

描画色はRed、Blue、Yellow、Green、Randomから選択でき、Randomの場合は描画する毎に不特定の色に変わります。

描画図形はLine、Rect、Ellipse、Imageから選択できます。

Image以外は、グレーの描画領域をドラッグすることによって、ドラッグした始点と終点を結ぶ直線、または矩形、矩形に内接する楕円が描画されます。

7456

Imageを選択した場合はナビゲーションバーのセグメンテッドコントロールが非表示になり、タップするとiPhoneの小さな図形が現れ、ドラッグすると追従して動き、話すとその場に固定されます。

描画後に再度ドラッグすると、前の描画図形は消去され、新たな図形が描画されます。


●プロジェクトの作成

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

7458


●ファイルの追加

View-basedテンプレートで作成したQuartzFunプロジェクトには、アプリケーションデリゲートのQuartzFunAppDelegateクラスと、ビューコントローラのQuartzFunViewControllerクラスが予め組み込まれています。

7459

今回は上記のアプリケーションの概要で述べたようなカスタム描画を行うので、以下のファイルを追加します。

1)指定した色と図形でカスタム描画を行うビュー(QuartzFunViewクラス)
2)色や図形を識別する定数(Constants.hヘッダファイル)
3)ランダムな色を生成するメソッド(UIColor-Randomカテゴリ)

1)QuartzFunViewクラスファイルの追加

カスタム描画を行うビューの処理なので、UIViewのサブクラスとしてヘッダおよびソースファイルを生成します。

XcodeのClassesを右クリックしコンテキストメニューから『追加』→『新規ファイル...』を選択します。

7460

『iOS』の『Cocoa Touch Class』グループにある『Objective-C class』を選択し、『Subclass of』を『UIView』として、ファイル名を『QuartzFunView』とします。

2)Constants.hヘッダファイルの追加

ナビゲーションバー(描画色)とツールバー(描画図形)のセグメンテッドコントロールの識別に使用する定数を定義するファイルなので、ヘッダファイルのみとなります。

XcodeのClassesを右クリックしコンテキストメニューから『追加』→『新規ファイル...』を選択します。

7461

『Mac OS X』の『C and C++』グループにある『Header File』を選択し、ファイル名を『Constants』とします。

3)UIColor-Randomカテゴリファイルの追加

描画色の選択肢にあるランダム色を生成するメソッドをUIColorクラスのカテゴリとして追加します。

カテゴリのテンプレートはありませんが、クラスファイルと似ていますし、UIColorはUIViewと同じくUIKitフレームワークのクラスなので、UIViewサブクラスのテンプレートを使用します。

XcodeのClassesを右クリックしコンテキストメニューから『追加』→『新規ファイル...』を選択します。

7460

『iOS』の『Cocoa Touch Class』グループにある『Objective-C class』を選択し、『Subclass of』を『UIView』として、ファイル名を『UIColor-Random』とします。


●UIColor-Randomカテゴリファイルの編集

図形の描画色をランダムで決定するメソッドは、ビュークラス内で実装するのではなく、UIColorのカテゴリとして実装します。
(カテゴリについての詳細は『Sections(2)~カテゴリ』や『詳解 Objective-C 2.0』を参照してください)

UIColor-Random.hの編集)

UIColorクラスにカテゴリ名を『Random』として、randomColorメソッドを宣言します。
(太字が追加・修正した部分)

#import <UIKit/UIKit.h>

@interface UIColor (Random)

+ (UIColor *)randomColor;


@end

7462

UIColor-Random.mの編集)

UIViewのテンプレートを使用したので、initWithFrame:やdrawRect:、deallocメソッドが自動生成されていますが全て削除し、randomColorメソッドを実装します。
(太字が追加・修正した部分)

#import "UIColor-Random.h"

@implementation UIColor (Random)

+ (UIColor *)randomColor {
    static BOOL seeded = NO;
    if (!seeded) {
        seeded = YES;
        srandom(time(NULL));
    }
    CGFloat red = (CGFloat)random() / (CGFloat)RAND_MAX;
    CGFloat blue = (CGFloat)random() / (CGFloat)RAND_MAX;
    CGFloat green = (CGFloat)random() / (CGFloat)RAND_MAX;
    return [UIColor colorWithRed:red green:green blue:blue alpha:1.0f];
}


@end

7463

randomColorはRGB各成分を乱数で決定し、colorWithRed:green:blue:alpha:メソッドでUIColorオブジェクトを生成して返します。

乱数はstdlibの関数random()を使用しますが乱数発生用のシードを現在時刻で初回のみ定義しています。

これは描画色を『Random』に設定した場合、図形を描画する度にrandomColorメソッドが呼び出されるので、毎回シードを生成する必要が無いように処理をしています。

その判別子seededはstaticで宣言されているため、randomColorメソッドが終了しても値を保持しており、2回目以降は初期化処理がスルーされるので、初回のみシードを作ることになっています。
(staticの変数についての詳細は『C言語入門講座/4.記憶クラス』を参照してください)

colorWithRed:green:blue:alpha:メソッドの成分値は0.0~1.0の値で指定する必要がありますが、生成される乱数値をRAND_MAX(乱数の最大値で、0x7fffffffと定義されています)で割ることで、範囲内に収まるようにしています。

colorWithRed:green:blue:alpha:

+ (UIColor *)colorWithRed:(CGFloat)red green:(CGFloat)green blue:(CGFloat)blue alpha:(CGFloat)alpha

指定した不透明度とRGB成分の値を使用してカラーオブジェクトを生成して返します。

戻り値はカラーオブジェクトです。

このオブジェクトによって表される色情報は、デバイスのRGB色空間です。

0.0未満の値は0.0として、1.0より上の値は1.0として解釈されます。

red:カラーオブジェクトの赤成分で、0.0から1.0の値で指定します。

green:カラーオブジェクトの緑成分で、0.0から1.0の値で指定します。

blue:カラーオブジェクトの青成分で、0.0から1.0の値で指定します。

alpha:カラーオブジェクトの不透明度で、0.0から1.0の値で指定します。


●Constants.hヘッダファイルの編集

ナビゲーションバーとツールバーに設置するセグメンテッドコントロールを識別する定数を定義します。

typedef enum {
    kLineShape = 0,
    kRectShape,
    kEllipseShape,
    kImageShape
} ShapeType;

typedef enum {
    kRedColorTab = 0,
    kBlueColorTab,
    kYellowColorTab,
    kGreenColorTab,
    kRandomColorTab
} ColorTabIndex;

#define degreesToRadian(x) (M_PI * (x) / 180.0)

7464

描画図形を示す列挙型ShapeTypeと、描画色を示す列挙型ColorTabIndexを定義しています。

degreesToRadian(x)の定義は、旧版では円周率を数値で記述していますが、ここでは新版以降と同様に数学関数math.hのマクロM_PIに置き換えています。
(degreesToRadian(x)は、このQuartzFunでは使用せず、OpenGL ES版のGLFunでのみ使用されます)



参考文献

C言語入門講座/4.記憶クラス

iOSアプリケーションプログラミングガイド

詳解 Objective-C 2.0 第3版詳解 Objective-C 2.0 第3版
(2011/12/28)
荻原 剛志

商品詳細を見る

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

商品詳細を見る

Beginning Ios 6 Development: Exploring the Ios SdkBeginning Ios 6 Development: Exploring the Ios Sdk
(2012/12/26)
David Mark、Jack Nutting 他

商品詳細を見る






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