08.學習Kivy:加入 Button物件基本功能，並自由地改變其背景顏色(background_color)

本篇開始:

• 我的開發環境是win11
• python是3.10.7版本
• kivy我設定在2.1.0版本
• 編碼的工具是Visual Studio Code(VS Code)

以我實際開發的APP為例，

我想做的是可以訓練基本加(減)法的心算工具。

命名app叫 「CountInMind」。

前言:

繼續製作app首頁，編寫countinmind.kv，在底下使用FloatLayout版面。

1.接續上一篇07內容，先設定 Button物件基本功能，如text文字的大小、顏色以及按鈕大小、位置

以下為上一篇程式碼(.kv):

Button:
            text:'加法'
            font_name: './font/TW-Kai-98_1.ttf'  
            font_size: 23
            color: (30/255, 30/255, 30/255)
            size_hint:0.3, 0.1
            pos_hint: {'center_x':0.5, 'center_y':0.36}

2.改變 Button background顏色:米色

background_normal: ''
background_color: (252/255, 236/255, 231/255)

★★★注意!!!這邊不能沒有background_normal: ''這行，否則會無法改變顏色。

(rgb數值可以參考其他網站說明，或參03.以Python和Kivy開發APP|Kivy-canvas|設定canvas(帆布、背景)大小、顏色、位置)

以下為程式碼(.kv):

Button:
            text:'加法'
            font_name: './font/TW-Kai-98_1.ttf'  
            font_size: 23
            color: (30/255, 30/255, 30/255)
            size_hint:0.3, 0.1
            pos_hint: {'center_x':0.5, 'center_y':0.36}
            background_normal: ''
            background_color: (252/255, 236/255, 231/255)

3.若再新增減法及加(減)法的 Button，作法相同，減法Button的示範如下

以下為減法按鈕的程式碼(.kv):

Button:
            text:'減法'
            font_name: './font/TW-Kai-98_1.ttf'  
            font_size: 23
            color: (30/255, 30/255, 30/255)
            size_hint:0.3, 0.1
            pos_hint: {'center_x':0.5, 'center_y':0.25}
            background_normal: ''
            background_color: (252/255, 236/255, 231/255)

4.本篇小結

加入 Button物件基本功能，並自由地改變其背景顏色(background_color)。

本篇所使用程式碼(.py):請參考01內容。

其他程式碼(.kv):請參考06內容。

本篇結束

在自學路上遇到困難是很正常的事，只要堅持到底，相信就會有所成果，期勉大家一同努力。