Objective-C 基本講座

独自画面の描画にベジェ曲線を使う

全334コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
独自の画面の表示でベジェ曲線を使う方法を学習します。
講師:
06:01

字幕

このレッスンではベジェ曲線を使って 曲線を描いたり塗りつぶしたりする方法や オフスクリーンの仕組みを紹介します UIView から派生したクラスを用意し オーバーライドした drawRect メソッド内で ベジェ曲線を使って僧侶の帽子を描いてみます ベジェ曲線は2点間を 2つの制御点に従う曲線で描画します Adobe Illustrator や PDF でも利用されている曲線です ベジェ曲線の管理には UIBezierPath という オブジェクトを使います まず UIBezierPath を作成し movetoPoint で起点を指定し その後 addCurvetoPoint で 争点と制御点を追加していきます こうやってUIBezierPath に ベジェ曲線を定義していけば 後は UIBezierPath に Fill メッセージを送れば 曲線内を塗りつぶし ストロークメッセージを送れば 輪郭線を描きます 具体的な座標でベジェ曲線を 定義してもいいのですが 今回はまず縦横 1 pt の矩形内で ベジェ曲線を定義することにしました そしてそのベジェ曲線を applyTransform メッセージで 任意の大きさに拡大します applyTransform の引数は Affin 行列を表現した― CGAffinTransform といった構造体です Affin 行列は座標変換に用いられる行列で 線形代数学を知っている人なら 自分で値を設定することもできますが 最初から拡大用・ 移動用 回転用の affin 行列を作る関数が 用意されているので そちらを使うといいでしょう CGAffinTransformMakeScale は 拡大用です 引数で縦横の倍率を指定します それでは実際に動かしてみましょう Xcode の画面に切り替えます UIView から派生しdrawRect メソッドをオーバーライドした― カスタム UIView は先に用意しておきました 名前を BishopView としています drawRect メソッド内には 先ほど説明したベジェ曲線を扱った 描画を追加しています 拡大率には bounds の width と height を指定します これで bounds 一杯の曲線になるはずです UIBezierPath の lineWidth プロパティで 輪郭線の太さも指定できます 10 pt に指定してみました viewController では 比較用の UIView を1 つと BishopView を1 つ すでにセルフビューに貼り付けた状態です また背景色にclearColor という 特別な色を指定しています この色を指定した場合背景は透明となります そして drawRect メソッドで 描画した部分だけが残ります 輪郭線の一部が欠けてしまいました このように自分の bounds から はみ出した描画は表示されません もっとはっきりわかるように 縦長に拡大してみましょう 説明画面に切り替えます これは IOS の画面表示の 仕組みに関係します IOS では drawRect による描画を 直接表示画面には行わせず オフスクリーンと呼ばれる 表示されない画面に描画させます その上で実際の画面に このオフスクリーンを合成します そのためオフスクリーンからはみ出した描画は 実際の画面に現れることはありません オフスクリーンを実際に管理しているのは CALayer というオブジェクトです UIView は自分の初期化時に CALayer インスタンスを 1つ作成しレイヤープロパティに保持し 画面表示の担当として使います UIView が実行する画面アニメーションも 実際は下請けとして CALayer が行っています きめ細やかな画面を作りあげる時には ぜひこの CALayer についても 調べてみてください オフスクリーンは画面表示が必要になった時に その時の bounds プロパティの 大きさで作られます そして一度作られると要求されない限り そのまま利用され続けます オフスクリーンが作られた後で bounds や frame プロパティを変更しても drawRect は呼ばれず オフスクリーンが拡大縮小されて 使われることになります IOS はこの仕組みで スムーズな画面アニメーションを 実現しているわけです オフスクリーンを再構築させたい時は UIView に setNeedDisplay メッセージを送ってください drawRect を直接使ってはいけません オフスクリーンの準備などは こちらでは制御できないからです setNeedDisplay が送られた UIView は その時の bounds の大きさで オフスクリーンを作り直し drawRect を呼びなおします このレッスンではベジェ曲線を使って 曲線を描いたり塗りつぶしたりする方法や オフスクリーンの仕組みを紹介しました

Objective-C 基本講座

このコースはプログラミング初心者でもObjective-CによるiOSアプリ開発の体系的な理解が得られるように構成されています。プログラムの動作の原理、Objective-C言語の役割、そこで利用されるCocoa touchオブジェクトの役割、基本的なiOSアプリの作成方法などを学習します。ぜひこのコースをアプリ開発に踏み出すさいの第一歩としてください!

6時間39分 (69 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 3,990
発売日:2015年11月18日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。