プログラミング入門1

作業について

今回の課題は以下のパッケージに作成してください。

作成するクラスの名前は問題ごとに指示があります。下記を参照してください

• クラスを作成する

課題の提出方法については下記を参照してください。

• 課題の提出方法

また、別のコンピューター上に移動する際には、下記を参考にプログラムを持ち帰ってください。

• プログラムを持ち帰る

新しい内容

フォーム

選択問題の画面を生成するプログラムを以下に示します。これまでと同じやり方でパッケージ「j1.lesson06」にクラス「ExampleForm」と「FormResult」を作成して下さい。クラスを作成したら、次のようなプログラムを作成します。

package j1.lesson06;

import gpjava.WebPage;

public class ExampleForm {

    public static void main(String[] args) {
        new ExampleForm().start();
    }

    void start() {
        WebPage.open("フォームの例");

        WebPage.createForm("FormResult");

        WebPage.textbox("textbox", "テキストボックス", 20);

        String[] options = new String[3];
        options[0] = "1つ目の選択肢";
        options[1] = "2つ目の選択肢";
        options[2] = "3つ目の選択肢";
        WebPage.selection("selection", options);

        WebPage.value("value", "表示されない入力");

        WebPage.button("送信ボタン");

        WebPage.endOfForm();

        WebPage.close();
    }
}

package j1.lesson06;

import gpjava.WebPage;

public class FormResult {

    public static void main(String[] args) {
        new FormResult().start();
    }

    void start() {
        WebPage.open("フォームの結果");

        WebPage.createTable();

        WebPage.createRow();
        WebPage.cell("リクエストパラメーター");
        WebPage.cell("値");
        WebPage.endOfRow();

        WebPage.createRow();
        WebPage.cell("textbox");
        WebPage.cell(WebPage.getInput("textbox"));
        WebPage.endOfRow();

        WebPage.createRow();
        WebPage.cell("selection");
        WebPage.cell(WebPage.getInput("selection"));
        WebPage.endOfRow();

        WebPage.createRow();
        WebPage.cell("value");
        WebPage.cell(WebPage.getInput("value"));
        WebPage.endOfRow();

        WebPage.endOfTable();

        WebPage.close();
    }
}

上記のURLにアクセスすると、テキストボックス、選択肢、ボタンがそれぞれ表示されます。

テキストボックスに文字列を入力し、選択肢を選んでボタンを押すと、次のようなテーブルが表示されます。

この例題のプログラムの詳細について以下に説明します。

フォームを作る

入力フォームを作成するには、次のように書きます。

例では、「WebPage.createForm("FormResult");」のように書いているため、ここで入力した結果はFormResultクラスで処理されます。ここから、「WebPage.endOfForm();」までの間に入力用のフィールドやボタンを配置します。

フォームを送信する

フォームに入力した内容を別のプログラムに渡すには、次のようにフォーム内にボタンを配置します。

このボタンがブラウザーからクリックされると、フォームの先頭で指定したクラスにジャンプします。その際に、フォームに入力された内容がリクエストパラメーターとして渡されます。

例では、「WebPage.endOfForm()」の直前にボタンを配置しています。そのため、ブラウザーから見るとフォームの一番下の方にボタンが表示されています。

テキストを入力する

フォーム内でテキストを入力させるには、「テキストボックス」という部品を配置します。

「リクエストパラメーターの名前」には、フォームを処理するプログラムで、ここに入力した値を取り出すためのリクエストパラメーターの名前を指定します。「ラベル」の部分にはテキストボックスの左側に書くラベルを指定し、「大きさ」にはテキストボックスの大きさをおおよそのアルファベット数で指定します。

例では「WebPage.textbox("textbox", "テキストボックス", 20);」という形で、テキストボックスを配置しました。FormResultではこのテキストボックスの入力を次のように取り出しています。

WebPage.createRow();
WebPage.cell("textbox");
WebPage.cell(WebPage.getInput("textbox"));
WebPage.endOfRow();

選択肢を選ぶ

フォーム内で選択肢を選ばせるには、「ラジオボタン」という部品を配置します。

「リクエストパラメーターの名前」はテキストボックスのときと同様です。「選択肢の配列」には、選択肢の一覧を文字列の配列で指定します。

例では、次のように3つの選択肢を表示していました。

String[] options = new String[3];
options[0] = "1つ目の選択肢";
options[1] = "2つ目の選択肢";
options[2] = "3つ目の選択肢";
WebPage.selection("selection", options);

実際に選ばれた選択肢は、リクエストパラメーターを受け取る側で「配列のインデックス」として取り出せます。

WebPage.createRow();
WebPage.cell("selection");
WebPage.cell(WebPage.getInput("selection"));
WebPage.endOfRow();

ただし、「WebPage.getInput()」は文字列を返すため、「Integer.parseInt()」などで整数に変換してからの方が使いやすい場合が多いです。

リクエストパラメーターを直接指定する

フォームを受け取る先にリクエストパラメーターの値を直接送るには、次のようにフォーム内に記述します。

例では「WebPage.value("value", "表示されない入力");」のように書いているため、FormResultで「WebPage.getInput("value")」とすると「表示されない入力」という文字列を取り出せます。

この部品は、ページが3つ以上あるようなウェブアプリケーションでフォームを使う際に便利です。

「A -> B -> C」のようにページを移動するようなプログラムがある場合、Aのフォームで入力した値はBのリクエストパラメーターとして受け取れますが、Cのページには届きません。そこで、BがAから受け取った値をもう一度「WebPage.value()」で追加しておくと、Cでもその値を取り出せます。

問題

クイズを自由に作成するプログラムを作成します。

a. クイズを作成する

クイズの問題文と選択肢の一覧、解答をそれぞれフォームに入力するプログラムを作成してください。

クイズの問題文、選択肢、解答はそれぞれテキストボックスに入力する形式で、選択肢はカンマ区切りで複数の選択肢を入力できるようにしてください。

このフォームを処理するプログラムは、次で作成する「QuizShow」を指定しておいてください。また、フォームを送信するためのボタンも作成しておいてください。

b. クイズを出題する

QuizInputで入力されたクイズを表示するプログラムを作成してください。

QuizShowの画面には、クイズの問題文と、ラジオボタン形式の選択肢、クイズの答えを送信するボタンを配置してください。

このフォームを処理するプログラムは、次で作成する「QuizResult」を指定しておいてください。

c. クイズの結果を判定する

最後に、QuizShowで入力されたクイズの結果を判定するプログラムを作成してください。

クイズに正解した場合には、QuizResultの画面に「正解です」と表示します。

クイズに正解しなかった場合には、QuizResultの画面に「不正解です」と表示します。

余力がある人は、不正解だった場合にさらに正解を表示するようにしてください。

なお、文字列の比較は次のように「[文字列].equals([文字列])」の形式で書けます。

String a = ...;
String b = ...;
if (a.equals(b)) {
    ... (aとbが同じ文字列の場合の処理)
}
else {
    ... (aとbが異なる文字列の場合の処理)
}

ヒント

ここで必要になる情報は、次の2つです。

1. 選択された選択肢
2. 正解の選択肢

このうち、「選択された選択肢」はQuizShowからリクエストパラメーターとして渡されますが、「正解の選択肢」はQuizShowからは渡されていません。