2023年8月15日 星期二

Kivy UIX篇 widget篇 Label類 attribute篇 講解

簡述 

根據官方解釋:

......沒有,官方沒有解釋QQ(畢竟Label這個概念太好懂了)

示意圖如下

基本範例:

首先在main.py中寫上起手式:

from kivy.app import App
from kivy.uix.floatlayout import FloatLayout


#先讓MyLayout繼承FloatLayout
class MyLayout(FloatLayout):
    pass
    
    
class Myapp(App):

    def build(self):
        return MyLayout()


if __name__ == '__main__':
    Myapp().run()

在以上程式碼中,我讓MyLayout類繼承FloatLayout類,並在裡面加入Label物件。

在my.kv中寫上此段程式碼:

<MyLayout>:

    Label:
        text: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'

執行結果如下:

Label使用技巧:

1.我們可以利用text_size來更改文字方塊的大小

程式碼如下:

<MyLayout>:

    Label:
        text_size: 50,None #代表文字方塊的寬為50,長沒有指定
        text: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'

tip:通常text_size只會設定其中一個,另一個設為None,代表我們只限定其中一邊,另一邊的長度自動調整到可以容納所有文字。

2.我們可以設定在"全部"文字下加底線:

程式碼如下:

<MyLayout>:

    Label:
        text: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
        underline: True

執行結果如下:

其實還有許多其他設定,但全部略過(第四點會說明原因)

3.我們可以設定:Label中的文字

(1)水平方向:向左、置中、向右靠齊

(2)垂直方向:向上、置中、向下靠齊

程式碼如下:

<MyLayout>:

    Label:
        text_size: 50,None
        text: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'
        halign: 'right' #加上此程式碼
        #valign: 'top'

執行結果如下:

這邊我沒有試valign的部分,各位可以自己試試看

4.我們可以利用樣式標籤夾住文字來更改文字的樣式(樣式標籤種類請參考:https://kivy.org/doc/stable/api-kivy.uix.label.html#markup-text)

程式碼如下:

<MyLayout>:

    Label:
        markup: True #別忘記加上此程式碼
        text: '[color=ff3333]ABCDEFG[/color]HIJKLMNOPQR[color=ff3333]STUVWXYZ[/color]'#加上此程式碼

執行結果如下:

其實第二點與第四點的結果有重疊,在Label裡面我們可以用第二點的方式(函數方法)調整"全部"文字(除了加底線,也有函數改顏色(color)、調整字體大小(font_size)、改成斜體(italic)等等......),也可以用第四點的方式(Text Markup方法)調整"全部"或"部分"文字。

5.我們可以利用font_direction更改文字方向

程式碼如下:

<MyLayout>:

    Label:
        font_direction: 'rtl' #加上此程式碼
        text: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'

執行結果如下:

沒有留言:

張貼留言

精選文章

Kivy UIX篇 widget篇 TabbedPanel類 event篇 講解