Androidの授業 11 [ 簡単なアプリ② ]
【色当てゲーム】
概要
・文字の色ではなく文字の意味通りに色を選択していく
・赤い文字で青と表記→正解は青
表示
・正解数/問題数
・アナウンス用領域
・問題内容の表示
・選択ボタンの表示
手順
①まず、画面を作ります。(main.xml)
②コメントにあった処理内容の追記
③完成後、機能拡張してみる
②の内容。↓を埋めていく
------------------------------------------------
package test.colorselect;
import android.app.Activity;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends Activity implements View.OnClickListener {
/** 問題文字用配列 **/
/** 問題色用配列 **/
/** 乱数発生用 **/
/** 正解のIDを保持用 **/
/** 選択結果の表示用 **/
/** 問題数 **/
/** 正解数 **/
/** 効果音 **/
/** 効果音ID(正解) **/
/** 効果音ID(不正解) **/
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// イメージビューの取得
// リスナーの設定
// 効果音の設定
// 問題の表示
}
/**
* 画面が表示されなくなった時
*/
@Override
protected void onPause() {
super.onPause();
// SoundPoolの開放
}
/**
* ボタンを押した時の処理
*/
@Override
public void onClick(View v) {
// 押されたボタンによって色を判定する
// 赤を押した時
// 青を押した時
// 緑を押した時
// 黄を押した時
// 灰を押した時
// 黒を押した時
// 選択した色と正解が同じだった場合
// 正解音
// 正解数のカウントを更新
// 不正解音
// 次の問題を表示
}
/**
* 効果音の設定
*/
private void setSound() {
}
/**
* 次の問題を表示
*/
private void nextQuestion() {
// 問題数・正解数を更新
}
/**
* 赤・青・緑・黄・灰・黒の中からランダムな文字列を取得
*/
private String getQuestionStr() {
// 正解を保持しておく
return null;
}
/**
* 赤・青・緑・黄・灰・黒の中からランダムな色を取得
*/
private int getQuestionColor() {
// 正解の色と重複している場合別の色を設定する
return 0;
}
/**
* 問題数・正解数の表示内容を更新
*/
private void updateQuestionView() {
// 問題数の更新
// 正解数の更新
// 問題数のカウントを更新
}
}
-------------------------------------------
授業中埋めていった順に記述しておきます。
/** 選択結果の表示用 **/
TextView tv;
//テキストビューの取得
tv =(TextView)findViewById(R.id.tv_result);
// リスナーの設定
findViewById(R.id.btn_red).setOnClickListener(this);
findViewById(R.id.btn_blue).setOnClickListener(this);
findViewById(R.id.btn_green).setOnClickListener(this);
findViewById(R.id.btn_yellow).setOnClickListener(this);
findViewById(R.id.btn_gray).setOnClickListener(this);
//同じ内容の違う書き方
((ImageButton)findViewById(R.id.btn_black))
.setOnClickListener(this);
//効果音の設定
setSound();
//問題の表示
nextQuestion();
ひとまず今日はここまで。続きは次回以降。
余力のある人が半数ほどいるので以下をヒントに考えてみて下さいとのこと。
/** 問題文字用配列 **/
private static final String[] quesStringArray =
{"赤","青","緑","黄","灰","黒"};
/** 問題色用配列 **/
private static final int[] quesColorArray =
{Color.RED, Color.BLUE, Color.GREEN,
Color.YELLOW, Color.GRAY, Color.BLACK};
/** 乱数発生用 **/
private static final Random rnd = new Random();
一応main.xmlの内容
-----------------------------------
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android
"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:background="#FFFFFF" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dip"
android:orientation="horizontal" >
<TextView
android:id="@+id/tv_question_correct"
android:text="0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#00FF00"
android:textSize="25px"
/>
<TextView
android:text="/"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25px"
android:textColor="#00FF00"
/>
<TextView
android:id="@+id/tv_question_count"
android:text="0"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#00FF00"
android:textSize="25px"
/>
</LinearLayout>
<TextView
android:id="@+id/tv_result"
android:text="文字通りに選んでください"
android:textSize="25px"
android:textColor="#808080"
android:layout_width="match_parent"
android:layout_height="100dip"
android:gravity="center" />
<TextView
android:id="@+id/tv_question"
android:text="あか"
android:textSize="90px"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height= "120dip"
android:gravity="center" />
<View
android:layout_width="match_parent"
android:layout_height="50dip" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center" >
<ImageButton
android:id="@+id/btn_red"
android:src="@drawable/red"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
<ImageButton
android:id="@+id/btn_blue"
android:src="@drawable/blue"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
<ImageButton
android:id="@+id/btn_green"
android:src="@drawable/green"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center" >
<ImageButton
android:id="@+id/btn_yellow"
android:src="@drawable/yellow"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
<ImageButton
android:id="@+id/btn_gray"
android:src="@drawable/gray"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
<ImageButton
android:id="@+id/btn_black"
android:src="@drawable/black"
android:scaleType="centerInside"
android:layout_width="75dip"
android:layout_height="75dip"
/>
</LinearLayout>
</LinearLayout>
---------------------------------------------------
Androidの授業 10 [ 簡単なアプリ①-2 ]
【 EasyQuestion 続き 】
・問題を出し○か×を押す
・ダイアログが出て解説
・終了するとトースト表示でボタンを押せなくなる
前回の続き。
・問題をリストに追加
・ボタンにリスナーを設（・ボタンを押した時の処理を加えて行く。）
前回のコメント部分を埋めていく
-----------------------------------------------------------------
//TextViewに問題内容を設定する
TextView tv = (TextView)findViewById(R.id.tv_question);
QuestionData data = list.get(index);
String question = data.getQuestion();
tv.setText(question);
//上記3行を1行で書く
//tv.setText(list.get(index).getQuestion());
//ボタンにリスナーを設定する→次回追記
findViewById(R.id.btn_maru).setOnClickListener(this);
findViewById(R.id.btn_batu).setOnClickListener(this);
-----------------------------------------------------------------
・onClickメソッドのオーバーライド
----------------------------------------
@Override
public void onClick(View arg0) {
//○、×ボタンのいずれが押されたか判定
//正解・不正解の判定
//正解の場合
//showDialog(ture);
//不正解の場合
//showDialog(false);
----------------------------------------
・ダイアログの表示の追加
----------------------------------------
private void showDialog(boolean flg) {
//タイトルの決定（正解 or 不正解)
//ダイアログの生成
// OKボタンを押した時
// 次の問題へ
//終了判定（3問目が終わったかどうか）
//終了の場合
//○・×ボタンを操作不可にする
//トーストで終了の通知
//終了でない場合
//問題を表示
}
------------------------------------------
上記を作成していく。
完成
------------------------------------------
package test.easyquestion;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.TextView;
import android.widget.Toast;
public class MainActivity extends Activity
implements OnClickListener {
//問題のデータを格納しておくクラスを用意する
private List<QuestionData> list;
private int index = 0;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
//問題の生成
list = createQuestion();
//TextViewに問題内容を設定する
TextView tv = (TextView)findViewById(R.id.tv_question);
QuestionData data = list.get(index);
String question = data.getQuestion();
tv.setText(question);
//上記3行を1行で書く
//tv.setText(list.get(index).getQuestion());
//ボタンにリスナーを設定する→次回追記
findViewById(R.id.btn_maru).setOnClickListener(this);
findViewById(R.id.btn_batu).setOnClickListener(this);
}
/**
* 問題生成
* @return
*/
private List<QuestionData> createQuestion() {
//リストのインスタンス化
List<QuestionData> list
= new ArrayList<QuestionData>();
QuestionData data = null;
//1問目
data = new QuestionData();
data.setQuestion("AndroidはOSの名前である");
data.setResult(false);
data.setExplanation("ライブラリの名前です。"+
"OSはLinuxが使われています。");
list.add(data);
//2問目
data = new QuestionData();
data.setQuestion("DalvikとJREは最終的に実行されるファイルは"+
"classファイルである");
data.setResult(false);
data.setExplanation("Dalvikはdex、JREはclassです。");
//問題をリストに追加
list.add(data);
//3問目
data = new QuestionData();
data.setQuestion("初代iphoneの発売日は2007年6月29日である");
data.setResult(true);
data.setExplanation("発表は2007年1月9日に行われ、"+
"批判的な意見が多く出ていました。");
list.add(data);
//4問目
data = new QuestionData();
data.setQuestion("Androidバージョン2.2のFroyoは"+
"フローズンヨーグルトの略である");
data.setResult(true);
data.setExplanation("2,3はジンジャーブレッドというように" +
"お菓子の名前がつけられています。");
list.add(data);
// おまけ：問題表示順のランダム化
Collections.shuffle(list);
return list;
}
@Override
public void onClick(View v) {
boolean select = false;
//○、×ボタンのいずれが押されたか判定
switch(v.getId()) {
case R.id.btn_maru: //○が押された時
select = true;
break;
case R.id.btn_batu:
select =false;
break;
}
// index = 0 list.get(0) ⇒ １問目の情報
QuestionData data = list.get(index);
boolean judge = data.isResult();
//正解・不正解の判定
if(select == judge) {
//正解の場合
showDialog(true);
} else {
//不正解の場合
showDialog(false);
}
}
/**
* ダイアログの表示
*/
private void showDialog(boolean flg) {
String title = null;
//タイトルの決定（正解 or 不正解)
if(flg) {
title = "正解!";
} else {
title ="不正解!";
}
//説明内容を取得
QuestionData data = list.get(index);
String explanation = data.getExplanation();
//ダイアログの生成
AlertDialog.Builder builder = new AlertDialog.Builder(this);
builder.setTitle(title)
.setMessage(explanation)
.setPositiveButton
// OKボタンを押した時
("OK",new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
// 次の問題へ
index++;
//終了判定（3問目が終わったかどうか）
if(index == list.size()) {
//終了の場合
//○・×ボタンを操作不可にする
findViewById(R.id.btn_maru).setEnabled(false);
findViewById(R.id.btn_batu).setEnabled(false);
//トーストで終了の通知
//※thisだとエラーの為getApplicationContext()でcontextの情報を取ってやる
Toast.makeText(getApplicationContext(), "終了です", Toast.LENGTH_SHORT).show();
//おまけ：アプリ自動終了
finish();
} else {
//終了でない場合
TextView tv = (TextView)findViewById(R.id.tv_question);
//問題を表示
tv.setText(list.get(index).getQuestion());
}
}
}).show();
}
}