今回は初めてAndroidStudioで簡単なアプリを作ってみようかなと。何を作成してみようか考えてたところ、今回は簡単なじゃんけんアプリを作ってみました。まずはものすごく単純な仕組みで作成。
作成するアプリについて
今回作成するじゃんけんアプリはプレイヤー(人間)とコンピュータがじゃんけん対決するものです。
アプリの動作
- コンピュータが裏向きにカードを１枚出します。
- プレイヤー（アプリを実行する人）が「グー」、「チョキ」、「パー」のいずれかのカードを選択します。
- コンピュータのカードをひっくり返し結果を表示。
もしかすると何となく見たことがあるような感じですが、あえて寄せてます。
作成準備編
まずはアプリを作成する下準備から
プロジェクト作成と設定
AndroidStudioを起動して新規でプロジェクトを作成。[Empty Activity]を選択。NameをJanken、Minimum API levelをAPI 16に。後は初期値でFinish。
画像準備と保存
今回、画像を使うのでフリーの素材サイトからダウンロードしたのと自分で適当に作ったのを用意。用意した画像は「グー」「チョキ」「パー」「カード裏面」の４枚。
全ての画像をresフォルダの[drawable]にドラッグ＆ドロップ。保存先を指定する画面が出てくるのでdrawableに。drawable-24ってのはAPIレベル２４以降だとかなんとかみたいなので、drawableに保存。これで前準備は完了。
レイアウトエディタで画面作成
次に画面の作成
背景色の設定
まずは自動作成されるHelloWorldを削除して背景色を変更。All Attributes内にある[background]を変更。色は適当に好きなものを指定。
TextViewの配置
次に「勝ち」、「負け」の結果を表示するテキスト領域を配置。文字列のリソースにWinとLoseを追加。文字のサイズはtextAppearanceで文字サイズを指定。文字列は引き分けもあるのでdrawも追加ですね。
Buttonの配置
次はボタンの配置。プレイヤーが押す「グー」、「チョキ」、「パー」のボタンと「ＯＰＥＮ（決定）」ボタンを追加。文字列は全てリソースに追加。ボタンの文字サイズもtextAppearanceでテキストと同じサイズに設定。
ImageViewの配置
次にカードを表示するImageViewを配置。PaletteにあるImageViewをドラッグ＆ドロップ。画像を選択する画面が出てくるので裏面のカード画像を選択。
人間側とＣＰＵ側の二つの画像を追加してとりあえず画面の作成は完了。画面のイメージとしてはとりあえずこんな感じ。
プログラム処理の作成
次にプログラム（動作）の作成
流れとしてはonCreate()->onStart()->onResume()の順にメソッドが呼ばれ実行状態になります。onCreate()は一回だけ呼び出される処理なのでここに初期化処理。onResume()にゲームの処理を記述し繰り返し実行させることでゲームが何度もできるって感じ。
ゲーム開始時の初期処理
まずは勝ち、負け、引き分けを表示するテキストとゲーム開始フラグを初期化して、そのあとにトランプを配布する処理。
トランプ配布処理では自分のカードをnullにして表示なし。ＣＰＵ側には裏面のカードを置いてます。自分側のトランプは初期でグーとかを配っても良いかもしれません。ここまでのコードを記述して、とりあえず起動してみた画面もセットで載せておきます。
override fun onResume() {
super.onResume()
textView.text = ""
bGameStart = true //ゲーム開始フラグ
handout() //トランプ配布
}
private fun handout(){
imageView.setImageDrawable(null)
imageView2.setImageResource(R.drawable.ura)
}
ゲーム開始フラグの変数はMainActivityクラス内に宣言。
ボタンを押したときの処理
次はグー、チョキ、パー、ＯＰＥＮの各ボタンを押したときの処理です。まずはグー、チョキ、パーのボタンを押したとき、これはそれぞれ対応する画像を表示するだけ。onCreate内にボタンを押したときの処理を追加します。mycardと言うメソッドを呼び出します。
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
button.setOnClickListener {
if (bGameStart) {
mycard('g')
}
}
button2.setOnClickListener {
if (bGameStart) {
mycard('c')
}
}
button3.setOnClickListener {
if (bGameStart) {
mycard('p')
}
}
}mycard内の処理ではそれぞれの画像を表示する処理を記述し、選んだカードに対応する数値（グーを１、チョキを２、パーを３）をセットして、カードを選択したフラグを立てます。ゲーム開始処理と同様にフラグ初期化処理も追加。
private fun mycard(cselectCard:Char) {
if(cselectCard == 'g'){
nmyCard = 1
imageView.setImageResource(R.drawable.gu)
}
if(cselectCard == 'c'){
nmyCard = 2
imageView.setImageResource(R.drawable.choki)
}
if(cselectCard == 'p'){
nmyCard = 3
imageView.setImageResource(R.drawable.pa)
}
bSelectCard =true
}ここまでの全体のソースは下記のような感じ。idが初期のままでわかりにくいのはご了承。不要なところは折りたたんであります。
最後にＯＰＥＮボタンを押したときの処理です。ボタンを押したときにカードが選択済みならばopencardメソッドを呼び出します。
button4.setOnClickListener {
if(bGameStart && bSelectCard)
{
opencard()
}
}判定処理
opencardの処理は下記の感じ。ランダムでＣＰＵ側のカードを選んで表示した後にじゃんけんの判定に応じて結果表示。ゲーム開始フラグを終了に。
じゃんけんの判定処理は３すくみを数値で簡単に場合分けするプログラム。一個一個場合分けする方がわかりやすいですがコードが長くなるので今回はこれで。
private fun opencard(){
nCpuCard = (1..3).random()
when(nCpuCard) {
1 -> imageView2.setImageResource(R.drawable.gu)
2 -> imageView2.setImageResource(R.drawable.choki)
3 -> imageView2.setImageResource(R.drawable.pa)
}
//判定
if((nmyCard - nCpuCard + 3 ) % 3 == 0) {
textView.text = getString(R.string.draw_text)
}else if ((nmyCard - nCpuCard + 3 ) % 3 == 1) {
textView.text = getString(R.string.lose_text)
}else{
textView.text = getString(R.string.win_text)
}
bGameStart = false //ゲーム開始フラグ
}さいごに
色々と修正する箇所は多いですが、これで一応動くようになりました。単純とはいえ、初めて作るのに簡単に作れたのはものすごく前向き。いきなり難しいのを作って挫折して放置ってのは悲しいですからね。
このゲームの機能的なことでは[終了]ボタン、[もう一度]ボタンを追加して何度も実行と終了ができるようにするとか、ソースの記述的はidがデフォルトだったり、コメントもないし、汚いので直すところは多々ありますが、誰かが見るわけでもないので・・・。