今回は、見た目をよくしまぁ〜す。
使用するアイコンはこれ




このアイコンファイルを、Xcodeのここ「Supporting Files」にドラッグ&ドロップ
まずは、「gu.png」をドロップ!


おっ!
ウィンドウが出た!
迷わず「Finish」をクリック
「gu.png」が追加された。

同じ要領で、「tyo.png」「pa.png」「again.png」を追加
次は、追加したグラフィックをButtonに適用。
「ぐー」Buttonをクリックして、右側のViewの「Attributes...」を選んで
Background「gu.png」を選択
Type「Custom」を選択

同じViewの「Size...」を選んで
アイコンのサイズと同じ「Width:90」「Height:90」に変更。

こんな感じ
こぶしがいい感じ♪
文字がじゃまですけど・・・。
同じ要領で、「ちょき」「ぱー」を
「もういっかい」は、サイズだけ「Width:160」「Height:80」
よし!シミュレータ Run!

文字とアイコンが間違っていいない事を確認
しかし・・。
相手が文字だと・・・。
よし、ここにもグラフィックを追加だ!
「Objects」から「Image View」を選んで、相手の上あたりにドロップ
サイズを「Width:90 / Height:90」に変更

そして、連携!

Nameは「View_aite」でConnectをクリック
連携完了。
さて、ここに「ぐー」「ちょき」「ぱー」のアイコンを表示させるには
と
・
・
結構、めんどくさい。
まずは、変数を宣言
ViewController.hのここに
gu_img、tyo_img、pa_imgを宣言

次は、宣言した変数にアイコンのファイル名を入力。
ViewController.hの- (void)viewDidLoadの所に

これで、アイコンを自由に使えるぞ!
と、言っても地道な
作業が・・・。
まずは、「ぐー」の所をプログラム追加していきます。
lbl_aiteが
「ぐー」の時は gu_img
「ちょき」の時は tyo_img
「ぱー」の時は pa_img

よし!シミュレータ Run!

あら!
相手が表示したままだ。
修正、
修正「もういっかい」Buttonを押した時に「相手」を消して

「ぐー」Buttonを押した時に「相手」を再表示と

「ちょき」「ぱー」も同じ要領で追加。
コピペで対応!
シミュレータ Run!

う〜ん、勝ち負けもグラフィック表示にしたくなった。
同じように ImageViewを追加して
Nameは「view_kekka」

使用するアイコンはこれ
サイズは、100×100



「相手」と同じ要領で
変数
宣言!ViewController.h

ViewController.m

これで宣言が
終わり!まずは「ぐー」
「相手」の時と同じ要領で

うぅ〜ん!こうなったら!
バックグラウンドも変更
「Image View」をドロップ
全体いっぱいに広げて
このままでは、表示がこのImageViewだけになってしまうので
ここの部分で移動して、表示順番を一番したにするんだけど、上に移動・・・。
なんか、ややこしいぃ〜。

このViewは連携なし
Imageに、これを「bg01.png」適用して

「じゃんけん・・・」のLabel文字を白色に変更して
「bg01.png」に合うように位置関係もを修正して
グラフィックと文字「ぐー」「ちょき」「ぱー」「もういっかい」を削除(空白)
これで、
よし!シミュレータ Run!

おぉ〜、いい感じだ!
しかし、プログラミングよりアイコンのデータ作りに時間がかかったなぁ〜
これで、じゃんけんゲーム作りおわりで〜す。
-* じゃんけんゲーム まとめ *-1.
iPhoneアプリをまねして作ってみよう!「じゃんけんゲーム#1」2.
iPhoneアプリをまねして作ってみよう!「じゃんけんゲーム#2」3.
iPhoneアプリをまねして作ってみよう!「じゃんけんゲーム#3」4.
iPhoneアプリをまねして作ってみよう!「じゃんけんゲーム#4」5.
iPhoneアプリをまねして作ってみよう!「じゃんけんゲーム#5」