07.學習Kivy:Button text文字、大小、顏色以及按鈕的大小(size_hint)、位置(pos_hint)

更新於 2024/12/02閱讀時間約 3 分鐘

本篇開始:

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


以我實際開發的APP為例,

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

命名app叫 「CountInMind」。


前言:

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


1.加入 Button物件(字首要大寫)


2.設定文字內容:加法

text:'加法'


3.設定語法:引用中文字體

font_name: './font/TW-Kai-98_1.ttf'


4.設定文字大小:23

font_size: 23


5.設定文字顏色:深灰

color: (30/255, 30/255, 30/255)



6.設定按鈕大小:寬為視窗0.3、長為視窗0.1

size_hint:0.3, 0.1


7.設定按鈕位置:寬的中心位置在視窗0.5處、長的中心位置在視窗0.36處

pos_hint: {'center_x':0.5, 'center_y':0.36}

以下為本篇程式碼(.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}
raw-image

▲按鈕顏色為預設的


8.本篇小結

加入 Button物件基本功能,如 text文字、大小、顏色以及按鈕的大小(size_hint)、位置(pos_hint)。


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


本篇結束:

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



avatar-img
0會員
10內容數
主要分享應用程式開發過程、遭遇困難及解決技巧,提供給自學或獨立開發者做為參考,希望能對您們有所幫助。 工作繁忙,無法及時回覆留言請多包涵。
留言0
查看全部
avatar-img
發表第一個留言支持創作者!
艾肯比工程師 的其他內容
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 本篇說明如何於Label內加入canvas(帆布背景)。
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 本篇說明如何增加Label文字框、調整文字(水平垂直)位置及調整顏色。
在Win11以python及kivy開發APP應用程式,本篇文章說明如何改變Label文字字型。
在Win11以python及kivy開發APP應用程式,本篇文章說明如何設定canvas(帆布、背景)大小、顏色、位置。
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 我想做的是可以訓練基本加(減)法的心算工具, 這個創意起源是我在國小高年級時,
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 1.開發專案: 首先要有開發的創意點子,以我實際開發的APP為例, 我想做的是可以訓練基本加(減)法的心算
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 本篇說明如何於Label內加入canvas(帆布背景)。
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 本篇說明如何增加Label文字框、調整文字(水平垂直)位置及調整顏色。
在Win11以python及kivy開發APP應用程式,本篇文章說明如何改變Label文字字型。
在Win11以python及kivy開發APP應用程式,本篇文章說明如何設定canvas(帆布、背景)大小、顏色、位置。
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 以我實際開發的APP為例, 我想做的是可以訓練基本加(減)法的心算工具, 這個創意起源是我在國小高年級時,
本篇開始: 我的開發環境是win11 python是3.10.7版本 kivy我設定在2.1.0版本 編碼的工具是Visual Studio Code(VS Code) 1.開發專案: 首先要有開發的創意點子,以我實際開發的APP為例, 我想做的是可以訓練基本加(減)法的心算
你可能也想看
Google News 追蹤
Thumbnail
本文探討了複利效應的重要性,並藉由巴菲特的投資理念,說明如何選擇穩定產生正報酬的資產及長期持有的核心理念。透過定期定額的投資方式,不僅能減少情緒影響,還能持續參與全球股市的發展。此外,文中介紹了使用國泰 Cube App 的便利性及低手續費,幫助投資者簡化投資流程,達成長期穩定增長的財務目標。
Thumbnail
這篇內容,將會講解什麼是表達式(Expression),什麼是陳述式(Statement)。有了這些概念,各位會更容易理解,要如何設計程式碼。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
這篇內容,將簡單介紹Asset Browser、Workspace、Inspector、Code Browser,作為入門的介面導覽。
Thumbnail
這篇內容,將教你如何開啟新的GameMaker專案,並調整畫面佈局。也會講解,為何建議用英文語系,來進行遊戲開發。
Thumbnail
這篇內容,將教你如何安裝GameMaker,並更改語言設定。包括GameMaker的下載說明、版本說明、安裝說明、語系更改。
Thumbnail
本文利用pyqt5,使用pyttsx3將QLineEdit(單行輸入框)的字串,轉成語音呈現出來。
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
Thumbnail
IDE 升級後出現了一樣的錯誤,手上程式碼沒有 pylint black-format 檢查上不了 gitlab,我又點開了那個很小很小的 x 符號,裡面 logs 提示的解決方式是升級..
Thumbnail
本文探討了複利效應的重要性,並藉由巴菲特的投資理念,說明如何選擇穩定產生正報酬的資產及長期持有的核心理念。透過定期定額的投資方式,不僅能減少情緒影響,還能持續參與全球股市的發展。此外,文中介紹了使用國泰 Cube App 的便利性及低手續費,幫助投資者簡化投資流程,達成長期穩定增長的財務目標。
Thumbnail
這篇內容,將會講解什麼是表達式(Expression),什麼是陳述式(Statement)。有了這些概念,各位會更容易理解,要如何設計程式碼。
Thumbnail
這篇內容,將會講解什麼是函式,以及與函式相關的知識。包括函式的簡介、Runtime Function、自訂函式、Script Function 腳本函式、Method 方法。
Thumbnail
打開 jupyter notebook 寫一段 python 程式,可以完成五花八門的工作,這是玩程式最簡便的方式,其中可以獲得很多快樂,在現今這種資訊發達的時代,幾乎沒有門檻,只要願意,人人可享用。 下一步,希望程式可以隨時待命聽我吩咐,不想每次都要開電腦,啟動開發環境,只為完成一個重複性高
Thumbnail
這篇內容,將簡單介紹Asset Browser、Workspace、Inspector、Code Browser,作為入門的介面導覽。
Thumbnail
這篇內容,將教你如何開啟新的GameMaker專案,並調整畫面佈局。也會講解,為何建議用英文語系,來進行遊戲開發。
Thumbnail
這篇內容,將教你如何安裝GameMaker,並更改語言設定。包括GameMaker的下載說明、版本說明、安裝說明、語系更改。
Thumbnail
本文利用pyqt5,使用pyttsx3將QLineEdit(單行輸入框)的字串,轉成語音呈現出來。
Thumbnail
理解一個全新的操作環境有時候可能是一個挑戰,尤其對於那些剛開始接觸VS Code的開發者來說,即便具備一定的英文閱讀能力,可能也會對這個陌生的操作環境感到徬徨和不安。不過,沒有必要擔心,我們接下來就來一起用短短的一分鐘時間,將VS Code轉換成最熟悉的中文環境吧! 安裝繁體中文語言包 由於VS
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
Thumbnail
IDE 升級後出現了一樣的錯誤,手上程式碼沒有 pylint black-format 檢查上不了 gitlab,我又點開了那個很小很小的 x 符號,裡面 logs 提示的解決方式是升級..