すこし本格的なゲームアプリ開発（８）・・画面切替の説明

こんにちわ。

そういえば、画面の切替の実装について説明をする！と言っておきながら、してませんでしたヽ(;´Д｀)ノ

今回はその説明をしたいと思います。
ちょっと長いかもしれないけど、最初は何もわかっていない状態から、
自分ではなんとか納得したつもりで書いてますので、僕と同じ状態の人には参考になるかもしれませんよ！(・ω・)/

この記事で「タイトル画面」から「ヘルプ画面」へ画面の切替をやりましたね。

真ん中らへんに GamePPoiViewController.m

(IBAction)showHelpView　メソッドを記述しました。

↑クリックで拡大表示

- (IBAction)showHelpView {

     HelpViewController *controller = [[HelpViewController alloc]
          initWithNibName:@"HelpViewController" bundle:nil];

     controller.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal;

     [self presentModalViewController:controller animated:YES];

     [controller release];

}

これはヘルプ画面を表示するメソッドです。

まず、ひとつめのカタマリです。
これは、ヘルプ画面のビューを管理するためのコントローラを作成しています。
initWithNibNameというメソッドで、Interfce Builder で作ったHelpViewController
が指定されているのがわかりますでしょうか？
これで、HelpViewController.xibファイルのビューが読み込まれています。

そしてふたつめ、
ヘルプ画面を表示するときに使用するアニメーションの効果を指定しています。
UIModalTransitionStyleFlipHorizontal
今回指定している↑は水平方向に回転して画面表示という意味で、
今回iPhoneは横向きで使用しているので縦向きに回転ということになります。

みっつめ、
これで実際にタイトル画面から、ヘルプ画面へ切替を行っています。
selfとは、このメソッドを記述しているGamePPoiViewControllerをあらわしています。
で、一つ目のカタマリで作ったcontroller を引数にして、
presentModalViewControllerメソッドを実行しています。アニメーション効果ありで。
これで、くるりんと画面の切り替えが行われます。

最後のよっつめ、
これはここで作って使っているヘルプ画面へのビューコントローラ（controller）を削除しています。
でもここで、直ちに削除するわけではないです。
これから使うものですので。。
これは、ヘルプ画面を表示し、またタイトル画面へ戻ってきたときに実行されるみたいです。
使わなくなった時の削除予約といったところでしょうか？

ヘルプ画面を閉じるときの実装は HelpViewController.mに以下を追加しました。

- (IBAction)showTitleView
{
    [self dismissModalViewControllerAnimated:YES];
}

これは１行で画面の切替が実現できていまいました。
なぜでしょう？
調べてみると、
今回の「タイトル画面」→「ヘルプ画面」への切替というのは「ヘルプ画面」をモーダルビューとして表示していて、
元々作業していた画面に戻ってくるというものです。
元々作業していた画面とは「タイトル画面」のことですよね。
イメージ的には「タイトル画面」が「ヘルプ画面」を一時的に表示したといったところでしょうか。
モーダルビューから元の画面に切り替えるにはモーダルビュー自身でdismissModalViewController:Animated:を実行すればよいらしいです。
つまり、画面を切替えるというより、画面を閉じるというほうがニュアンス的に近いんじゃないかな。

前述の実装内容には「Modal」という文字が何度かでてきていると思います。


どうでしょう？
なにかわかった気がしないでもなくもない。

では今日はこのあたりで～(ﾉﾟοﾟ)ﾉ.




ランキングに参加しています。下のクリックお願いしますー(*ﾟｰﾟ*)

すこし本格的なゲームアプリ開発（７）・・画面切り替えの続き

では、次はヘルプ画面からタイトル画面へ戻ってくるボタンを追加しましょう。

実はこっちのほうがもっと簡単なのですﾍ(ﾟ∀ﾟ*)ﾉ


ヘルプの画面は、「HelpViewController.xib」でしたね。

そこにボタンを追加しましょう。



追加しました。中身には「Back」とでもつけときました。要所要所での保存をお忘れなく(｀∀´)

「HelpViewController.h」にボタンのアクションを宣言します。

一行だけですよ。

　- (IBAction)showTitleView;
これだけ。ヘルプ画面にくるときも同じでした。

次に「HelpViewController.m」にボタンのアクションを実装します。

最後の @end の前にこれだけ追加しました。

- (IBAction)showTitleView
{
     [self dismissModalViewControllerAnimated:YES];
}
前はもう少し書く量が多かったのですが、今回はこれだけです。

ではInterface Builderでボタンとの接続を行います。

ボタンから「File's Ownder」へ引っぱり「showTitleView」を選択します。


さぁ保存して実行してみましょ！

タイトル画面から、「How To Play」を押してヘルプ画面を表示して、
そこに表示されている「Back」ボタンを押してみましょう。


　　↓



タイトル画面にもどりましたねーーー(*^ー^)ノ

タイトル画面からヘルプ画面を行き来できるようになりました。o(^▽^)o


今日は簡単でしたが、今日はこのへんでーーー(*゜▽゜ノノ゛☆


ランキングに参加しています。下のクリックお願いしますー(*ﾟｰﾟ*)

すこし本格的なゲームアプリ開発（６）・・画面切り替え

こんにちわ(*＾ー＾)ノ

さて、今回は前回言いました様に、２画面間の切替えをやってみたいと思います。

この２画面です。


タイトル画面


　　　　　　　　　　↓ ↑
ヘルプ画面



お気づきの通り、タイトル画面からどうやってヘルプ画面へ遷移するのか？
というところを疑問に思いましたね。
もちろんボタンを押したら遷移するようにします。

ではボタンを作成しまょう。ヽ(ﾟ◇ﾟ )ﾉ

まず、「グループとファイル」から「GamePPoiViewController.xib」をダブルクリックして
Interface Builderを立ち上げます。

下のようにLibraryからボタン（Round Rect Button)を探して画面にドラッグします。



そうすると、画面にボタンが張り付きます。

で、この先のことを言いますと、

① GamePPoiViewController.h　にこのボタンを宣言する。
② GamePPoiViewController.m　にこのボタンの処理（動作）を記述する。
③ ボタンとこの宣言とか処理を書いたのを接続する。

です。ちょっとは覚えていますでしょうか。前にもやりましたね。

①
　ではXcodeに戻ってGamePPoiViewController.hを編集しましょう。
　下の様に１行追加します。メソッドの宣言ですね。



- (IBAction)showHelpView;

　(IBAction)というのはInterface Builderの部品と関連づけるための
　メソッドの宣言ということらしいです。ふむ。

②
　 GamePPoiViewController.m　にメソッドの中身を記述しましょー。

最後の @end の直前に追加しました。↓

---

- (IBAction)showHelpView {

HelpViewController *controller = [[HelpViewController alloc]
initWithNibName:@"HelpViewController" bundle:nil];

controller.modalTransitionStyle = UIModalTransitionStyleFlipHorizontal;

[self presentModalViewController:controller animated:YES];

[controller release];
}

---

あと、ヘッダファイルの読み込みも忘れない様に追加しときます。
GamePPoiViewController.mのコード部分の一番上ですよ。

#import "GamePPoiViewController.h"　//　←これは最初からある
#import "HelpViewController.h"　　//　←これを追加する。

③
　次はInterface Builderです。

さっき追加したボタンを右クリック＋ドラッグで青い矢印を出します。
下の図のように「File's Owner」へ持っていき、そこで離します。
あ、ボタンの文字を「How To Play」に変更しました！ダブルクリックでできるよ(＾ε＾)



「File's Owner」で離したとき、下のウインドウが出るので、宣言したshowHelpViewを選びます。
（出ない！という場合は、Xcodeでちゃんと保存できていないからと思う(ﾉﾟοﾟ)ﾉ。）


はい、できましたね。

ではこっちもちゃんと保存して、一回実行してみましょう。







きゃー。できました！ヾ(＠°▽°＠)ﾉ

今のところはヘルプ画面ではまだ「戻るためのボタン」を作ってないので、ホームボタンを押して、
いったんアプリを終了してから起動し直さないとだめなんですけどね。

キリがいいので今回はここまでにしたいと思います。

次回は、実装した部分の説明と、ヘルプ画面からタイトル画面へまた戻ってくるボタンの追加
をしたいと思います。



ランキングに参加しています。下のクリックお願いしますー(*ﾟｰﾟ*)