じゃんけんアプリ03

アプリ開発 iOS Xcode

ブラッシュアップ

見栄えがよくなるように、じゃんけんアプリに画像を設定します。
静的な画像の表示（Storyboardからの画像表示設定）は成功しましたが、ソースコードの記述によるUIImageを使った動的な画像表示に失敗している状況です。

  • 静的に表示するにはどうすればよいか
  • 動的に表示する処理のどこでひっかかっているか

について書きます。

ボタンへの静的画像設定

  1. もとまかさんのページにはプロジェクトファイルのフォルダに画像を置く、となっていましたが、Xcode4.4ではNavigatorにドラッグ&ドロップすれば追加できます。
  1. StoryBoardを開き、ボタンの選択して、Utilities -> Attributes inspectorのTypeをRounded Rect -> Customに変更します。これによりボタンの枠線が消えます。
  1. Imageを画像名に設定します
  1. Utilities -> inspectorから画像のwidthとheightを手動で設定します

相手表示部分の動的な画像設定

次に、相手が何を出したかという表示も、既存のテキストだけの表示に加えて画像でも表示するようにします。
（もとまかさんのページでは、テキストだけの表示を変更するようになっていましたが、余計なバグに悩まされるのを避けるために「追加」という形で実装します）

  1. StoryboardにImageViewを追加します
  2. AssistantEditorを開き、ImageViewとコードをOutletで関連づけます
  3. ViewController.mの@synthesizeと関数定義の間に、画像をグローバルで使うための変数を定義します
  4. viewDidLoad内で画像を読み込みます
    • 注意：もとまかさんのページでは保持指定オプションのretainを指定して、解放も明示的に書くようにと書かれていますが、Xcode4.4では'retain' is unavailableと言われるので指定しません。
      • ここで問題が発生したので、ひとまず手順はここまでで中断。

問題点１

UIImageViewでの画像表示。
retain が使えないと言われ、じゃあ消そうと消したら次は「Parse Issue Expected identifier」エラーが出る。
エラーメッセージで探してもそれらしいものが見つからず、「UIImage　画像表示」で検索して、UIImageを使った画像表示の基本から勉強することにしました。

UIImage - iPhoneアプリ開発の虎の巻
によると、

UIImageクラスは、画像を管理するクラスです。

背景に画像を表示したり、ボタン内に画像を表示したりとプログラム中で画像を扱う場合には、画像ファイルをUIImageオブジェクトにしてから、UIImageViewやUIButton等のコントロールに渡す必要があります。

ということなので、UIImageオブジェクトを事前に定義して、それに画像を読み込もうとしたことは正しかったようです。

気になっていたのが、

img_pa = [[UIImage imageNamed:@"pa.png"]];

ここが二重カッコの最後のカッコを外すとエラーが一度消えたように見えることでした。

原因はここでした。

もとまかさんのページでは

img_pa = [[UIImage imageNamed:@"pa.png"] retain];

となっていた部分から単純にretainを消した結果、「オプションをつけないならカッコは二つもいらない」と言われてエラーになっていたようです。

解決策は、

img_pa = [UIImage imageNamed:@"pa.png"];

というようにカッコを一つにすることでした。

問題点２

ビルドは通るようになりましたが実行に失敗します。
viewDidLoadの下記１行目でブレークしてしまいます。

    img_gu = [UIImage imageNamed:@"gu.png"];
    img_cyoki = [UIImage imageNamed:@"ch.png"];
    img_pa = [UIImage imageNamed:@"pa.png"];

ちなみに、上記変数は、

//画像をグローバルで扱うための変数定義
UIImage *img_gu;
UIImage *img_cyoki;
UIImage *img_pa;

と定義しています。

画像の事前読み込み部分で失敗しているようです。引き続き調査します。

2012/09/12 22:10追記

ブレークしてしまっていた理由は、ブレークポイントがいつのまにか設定されていたためでした。
トラックパッドの操作の中で、気づかないうちにブレークが設定されている場合がときどきあるので気をつけたいです。
ブレークポイントを解除したら、無事、画像を動的に切り替えることに成功しているのを確認しました。
(2012/9/17追記)
「いつのまにかブレークポイントが設定される」原因の一つが判明しました。
「Xcodeでは、Command + Yでブレークポイントが挿入される」ためです。
「Ctrl + Z(元に戻す)」の逆のショートカットキーがMacでは異なることに気づかずに「Command + Y」を押していたためだと思われます。

課題

imageNamedを使うと画像がキャッシュされるらしく、それが問題を引き起こす場合もあるそうです。
ここはまた別途調査します。