【初心者向け】KivyによるWindowsアプリ作成33 難易度調整画面の見た目修正その1

今回の記事では、見た目が今一つであった難易度調整画面を修正していきます。

コード全量については、GitHubにアップしていますので、必要に応じてご参照下さい。

<スポンサーリンク>

難易度調整画面の完成形

今回の実装内容を説明する前に、まず何をしようとしているかをご理解頂くため、難易度調整画面の完成形を示します。

現在の難易度調整画面では、各難易度がどのような意味を持つのか分かりませんし、3つの難易度ボタンのいずれを押しても、内部的に難易度は変更されるものの、見た目が全く変わらず、現在どの難易度が選択されているのかが分かりません

そこで、これら問題を解消するため、難易度調整画面に以下2点、修正を加えたいと思います。

  • 難易度ボタンを押下した際、画面下部にその難易度の意味を表示するようにする
  • 加えて、押されたボタンの色を変えて、現在どの難易度が選択されているかが分かるようにする

今回はこの2点のうち、1点目の難易度説明に関する実装を行っていきます

実装

今回の実装は非常に簡単で、それほど量も多くありません。

まず、各難易度に対して、表示すべき説明文をPythonファイル側に定義しておきましょう。

これは、グローバル変数として定義しますが、CHARACTER_SETの定義文の後ろ辺りに置くのが良いと思います。

DIFFICULTY_DESCTIPTION = {
    "easy" : "only lower-case characters appear",
    "normal" : "mixed-case characters appear",
    "hard" : "mixed-case and numeric characters appear"
}

次に、難易度ボタンを押した時に、これら説明文のうち、押されたボタンに対応するものが表示されるようにします。記述するのは、DifficultyScreenクラスのdifficultySelectedメソッド内です。

def difficultySelected(self, btn):
    global difficulty
    difficulty = btn.text.lower()
    self.ids["difficulty_description"].text = DIFFICULTY_DESCTIPTION[difficulty] # この行を追加

難易度調整画面の下部には、Kvファイル上、id: difficulty_descriptionを持つLabelを設置していますが、このidを用いてLabelにアクセスし、text属性を対応する説明文に置き換えています。

今回の実装は以上です。早速実行してみましょう。

テスト実行

プログラムを起動し、難易度調整画面で各難易度ボタンを押してみます。

押されたボタン毎に、適切な説明文が表示されることが確認できましたでしょうか。

Easyボタンを押した場合

Normalボタンを押した場合

Hardボタンを押した場合

終わりに

今回の実装内容には特段難しい点もなく、理解が容易だったのではないかと思います。

もし難しいと思う点がありましたら、過去記事も見てみて下さいね。

さて、次回は修正すべきもう1つの点である、ボタン押下時の見た目変更処理の実装を行っていきたいと思います。

<スポンサーリンク>

シェアする

フォローする