tkinterを使って英単語学習アプリを作成しよう。

python

受講生(F氏)からのお題。tkinterを使って英単語学習アプリを作成してみよう。

仕様

1.起動すると一問目が表示され、ユーザーは答えを入力します
2.入力後、[答える]ボタンを押すと次の問題と先程答えた問題の成否も表示します
3.10問目を答えると10問中いくつ正解したかが表示されます

ウィンドウサイズはwidth=400,height=500です。 画像が大きいと思いますが、
img = tk.PhotoImage(“ああああ.png”)
img = img.subsample(2)
のようにすると良い感じのサイズになると思います

実行例

起動時

「ぞう」の英単語を入力し、「答える」を押す

○結果が下部に表示され、次の問題が出題される。(入力欄は空になっている)
この結果の文字は1.5秒後に自動的に消える

○間違った答えを入力すると…

○下部に正しい答えが表示される(これも1.5秒後に自動的に消える)

○以下を問題数(10問)繰り返すと最後に結果が表示され最初に戻る

ポイント

適度な難易度なので学習素材として良問だ。10問の問題をどのように扱うかがポイントとなるだろう。表示の演出の細部はとりあえずは置いておいて基本的な流れが実装できるか試してみてもらいたい。

準備

○まずは任意の場所(デスクトップなど)に今回のアプリ用のanimalフォルダを作成する。
○次に以下の画像素材をダウンロード&解凍して10枚の画像animalフォルダの直下に配置する

レッツ チャレンジ!

ではやってみよう!基本的な流れを実装できるだろうか!?

解答例

import tkinter as tk

animal=None
index=0
correct=0
root=tk.Tk()
root.geometry('400x500')
class Animal:
	def __init__(self,ja,en,img):
		self.ja=ja
		self.en=en
		self.img=img

animals=[
	Animal('ぞう','elephant',tk.PhotoImage(file='elephant.png').subsample(2)),
	Animal('しろくま','polarbear',tk.PhotoImage(file='polarbear.png').subsample(2)),
	Animal('くじら','whale',tk.PhotoImage(file='whale.png').subsample(2)),
	Animal('ペンギン','penguin',tk.PhotoImage(file='penguin.png').subsample(2)),
	Animal('ライオン','lion',tk.PhotoImage(file='lion.png').subsample(2)),
	Animal('カンガルー','kangaroo',tk.PhotoImage(file='kangaroo.png').subsample(2)),
	Animal('ひと','human',tk.PhotoImage(file='human.png').subsample(2)),
	Animal('いぬ','dog',tk.PhotoImage(file='dog.png').subsample(2)),
	Animal('ねこ','cat',tk.PhotoImage(file='cat.png').subsample(2)),
	Animal('あり','ant',tk.PhotoImage(file='ant.png').subsample(2)),
]
def clear_result():
	l_result['text']=''
	
def btn_click():
	global animal,correct,index
	user_ans=entry.get()
	if user_ans.lower()==animal.en:
		correct+=1
		msg='正解!'
	else:
		msg=f'不正解{animal.ja}の答えは{animal.en}'
	if index==len(animals)-1:
		msg+=f'\n{len(animals)}中{correct}問正解でした!'
		index=-1
		correct=0
	l_result['text']=msg
	root.after(1500,clear_result)
	index+=1
	animal=animals[index]
	l_ja['text']=animal.ja
	cvs.delete('ANI')
	cvs.create_image(100,100,image=animal.img,tag="ANI")
	entry.delete(0,tk.END)

fnt=('Arial',30)
animal=animals[index]
l_ja=tk.Label(text=animal.ja,font=fnt)
l_ja.pack(pady=(20,10))
entry=tk.Entry(font=('Arial',20))
entry.pack()
cvs=tk.Canvas(width=200,height=200)
cvs.pack(pady=20)
cvs.create_image(100,100,image=animal.img,tag="ANI")
btn=tk.Button(text='答える',font=fnt,command=btn_click)
btn.pack()
l_result=tk.Label(text='',font=('Arial',16))
l_result.pack(pady=(10,0))
root.mainloop()

ポイント解説

○今回はAnimalクラスを作成して、和名と英名と画像を管理した。

○root.after(1500,処理)を使って1.5秒後に文字を消している

別解

クラスにメソッドも持たせた例。ソースコードも長くなっているし、それほど見通しが改善してるわけでもないので微妙だが、クラスの練習としては有りだろう。

import tkinter as tk

animal=None
index=0
correct=0
root=tk.Tk()
root.geometry('400x500')

class Animal:
	def __init__(self,ja,en,img):
		self.ja=ja
		self.en=en
		self.img=img

	def show_quiz(self):
		l_ja['text']=animal.ja
		cvs.delete('ANI')
		cvs.create_image(100,100,image=self.img,tag="ANI")

animals=[
	Animal('ぞう','elephant',tk.PhotoImage(file='elephant.png').subsample(2)),
	Animal('しろくま','polarbear',tk.PhotoImage(file='polarbear.png').subsample(2)),
	Animal('くじら','whale',tk.PhotoImage(file='whale.png').subsample(2)),
	Animal('ペンギン','penguin',tk.PhotoImage(file='penguin.png').subsample(2)),
	Animal('ライオン','lion',tk.PhotoImage(file='lion.png').subsample(2)),
	Animal('カンガルー','kangaroo',tk.PhotoImage(file='kangaroo.png').subsample(2)),
	Animal('ひと','human',tk.PhotoImage(file='human.png').subsample(2)),
	Animal('いぬ','dog',tk.PhotoImage(file='dog.png').subsample(2)),
	Animal('ねこ','cat',tk.PhotoImage(file='cat.png').subsample(2)),
	Animal('あり','ant',tk.PhotoImage(file='ant.png').subsample(2)),
]
def clear_result():
	l_result['text']=''

def init_quiz():
	global animal,correct,index
	index=0
	correct=0
	clear_result()
	animal=animals[index]
	animal.show_quiz()
	
def btn_click():
	global animal,correct,index
	is_last=index==len(animals)-1
	user_ans=entry.get()
	if user_ans.lower()==animal.en:
		correct+=1
		msg='正解!'
	else:
		msg=f'不正解{animal.ja}の答えは{animal.en}'
	if is_last:
		msg+=f'\n{len(animals)}中{correct}問正解でした!'
	l_result['text']=msg
	entry.delete(0,tk.END)
	if is_last:
		root.after(1500,init_quiz)
	else:
		root.after(1500,clear_result)
		index+=1
		animal=animals[index]
		animal.show_quiz()

fnt=('Arial',30)
l_ja=tk.Label(font=fnt)
l_ja.pack(pady=(20,10))
entry=tk.Entry(font=('Arial',20))
entry.pack()
cvs=tk.Canvas(width=200,height=200)
cvs.pack(pady=20)
btn=tk.Button(text='答える',font=fnt,command=btn_click)
btn.pack()
l_result=tk.Label(text='',font=('Arial',16))
l_result.pack(pady=(10,0))
init_quiz()
root.mainloop()

完成

イラストの可愛さもあって楽しいアプリだ。作っている最中に登場する動物の英単語は完璧に覚えられた。Pythonでできたら他の言語でもやってみるとよいだろう。

python
スポンサーリンク
シェアする
mjpurinをフォローする
ジョイタスネット

コメント

タイトルとURLをコピーしました