本篇開始:
- 我的開發環境是win11
- python是3.10.7版本
- kivy我設定在2.1.0版本
- 編碼的工具是Visual Studio Code(VS Code)
我想做的是可以訓練基本加(減)法的心算工具。
命名app叫 「CountInMind」。
1.延續上兩篇，繼續編輯countinmind.kv，在<Secondscreen>下 FloatLayout版面，將難易程度添加各個題數存放，例如易(4)、中(7)、難(10)
☆目的:按下程度 Button同時呼叫類別中方法，終端機列印確認，並將題數內容儲存下來在後面他用(在第3頁可以綜合顯示出前面選擇的內容)
.py程式碼同上一篇
以下為.kv程式碼:
from kivy.properties import ColorProperty, ObjectProperty, NumericProperty
class Secondscreen(Screen):
text_color = Firstscreen.text_color
btn_bg_color = Firstscreen.btn_bg_color
description_of_degree = "程度說明:\n(易)適合國小中年級\n(中)適合國小高年級\n(難)適合國中一年級\n\n\n~~請點擊以下程度~~"
degree = NumericProperty()
def select_degree(self, num):
Secondscreen.degree = num
print(self.degree)
▲說明:使用調用屬性，從 Firstscreen類別調用 text_color及 btn_bg_color兩種屬性來調用。另外定義 select_degree這個方法。
以下為.kv程式碼:
DegreeButton:
text: '易'
font_name: './font/TW-Kai-98_1.ttf'
font_size: 23
color: root.text_color
size_hint: 0.2, 0.15
pos_hint: {'center_x':0.27, 'center_y':0.3}
on_release: root.manager.current = 'third'; root.select_degree(4)
▲說明:root代表根物件(Secondscreen類別)，呼叫類別中 select_degree方法，並將'4'回傳至.py該方法的參數num，並列印4出來。
DegreeButton:
text: '中'
font_name: './font/TW-Kai-98_1.ttf'
font_size: 23
color: root.text_color
size_hint: 0.2, 0.15
pos_hint: {'center_x':0.5, 'center_y':0.3}
on_release: root.manager.current = 'third'; root.select_degree(7)
▲說明:root代表根物件(Secondscreen類別)，呼叫類別中 select_degree方法，並將'7'回傳至.py該方法的參數num，並列印7出來。
DegreeButton:
text: '難'
font_name: './font/TW-Kai-98_1.ttf'
font_size: 23
color: root.text_color
size_hint: 0.2, 0.15
pos_hint: {'center_x':0.73, 'center_y':0.3}
on_release: root.manager.current = 'third'; root.select_degree(10)
▲說明:root代表根物件(Secondscreen類別)，呼叫類別中 select_degree方法，並將'10'回傳至.py該方法的參數num，並列印10出來。
★★★這邊沒有縮排(也就是沒有 tab鍵)
<DegreeButton@Button>
background_normal: ''
background_color: (0,0,0,0)
canvas.before:
Color:
rgb: (252/255, 236/255, 231/255)
RoundedRectangle:
size: self.size
pos: self.pos
radius: [65]
▲說明:以上<DegreeButton@Button>的用法，請參考第10篇內容，這邊就不再贅述
2.正式進入到app第3頁:繼續.kv，在<Thirdscreen>底下使用FloatLayout版面
2-1.延續前兩篇內容，直接設定類別的方法及屬性
☆目的:要在第3頁出現同時，綜合前2頁所點擊內容，然後在第3頁顯示一段玩法說明
記得:要先在前面導入StringProperty類別
以下.py程式碼
class Thirdscreen(Screen):
text_color = Firstscreen.text_color
btn_bg_color = Firstscreen.btn_bg_color
how_to_play = StringProperty()
def update_label(self):
self.how_to_play = f"玩法說明:\n進入測驗畫面，按下開始出題後，每2秒會隨機出現數字，每題有「{Secondscreen.degree}」個數字，總共「{Secondscreen.degree}」題，請使用「{Firstscreen.mode}」計算"
print(self.how_to_play)
▲說明1:使用調用屬性，從 Firstscreen類別調用 text_color及 btn_bg_color兩種屬性。設定how_to_play這個物件並繼承StringProperty()，另外定義 update_label這個方法。
▲說明2:將一段字串存入how_to_play，其中內容除了有既定字串，還有Secondscreen.degree、Firstscreen.mode 兩個屬性內容，這個時候就能發揮調用其他屬性的功效了!
2-2.設定on_enter方法
☆目的:使在進入第3頁(screen)時，同時觸發update_label 這個函式。
以下.kv程式碼
<Thirdscreen>:
name: 'third'
on_enter: root.update_label()
FloatLayout:
canvas:
Color:
rgb: (117/255, 220/255, 141/255)
Rectangle:
size: self.size
pos: self.pos
Label:
text:'歡迎使用心算大神'
font_name: './font/TW-Kai-98_1.ttf'
bold: True
font_size: 23
color: root.text_color
pos_hint: {'center_x':0.5, 'center_y':0.9}
Label:
text: '© farloveway ; version: 1.0'
font_size: 10
color: (0,0,0)
pos_hint:{'center_x':0.5, 'center_y':0.04}
Label:
text: root.how_to_play
text_size: self.width*0.8, self.height*0.5
halign: 'left'
font_name: './font/TW-Kai-98_1.ttf'
font_size:20
color: root.text_color
pos_hint: {'center_x':0.5, 'center_y':0.75}
Button:
text:'上一頁'
font_name: './font/TW-Kai-98_1.ttf'
front_size: 15
color: root.text_color
background_normal: ''
background_color: root.btn_bg_color
size_hint: 0.15, 0.1
pos_hint: {'center_x':0.1, 'center_y':0.9}
on_release: root.manager.current = 'second'
3.綜合測試，呈現成果如下圖
▲說明:隨機，先點擊"減法"
▲說明:隨機，再來點擊"中"
▲說明:就會出現在第3頁同步更新的玩法說明啦(同時也可以看一下終端機列印的成果)
4.本篇小結
設定類別的方法(函式)及屬性(變數)，運用調用屬性呈現內容，並且加入on_enter使其畫面進入就觸發函式。
為精簡篇幅，本篇所使用完整(.py)(.kv)程式碼，請參考第9~13篇內容
本篇結束:
在自學路上遇到困難是很正常的事，只要堅持到底，相信就會有所成果，期勉大家一同努力。
