2023年8月27日 星期日

Kivy UIX篇 widget篇 TextInput類 attribute篇 講解

簡述

根據官方解釋:

The TextInput widget provides a box for editable plain text.Unicode, multiline, cursor navigation, selection and clipboard features are supported.

意思是TextInput部件提供了一個可編輯純文本的框。支持 Unicode、多行、光標導航、選擇和剪貼板功能。

示意圖如下:

基本範例

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

from kivy.app import App
from kivy.uix.gridlayout import GridLayout


#先讓MyLayout繼承GridLayout
class MyLayout(GridLayout):
    pass


class Myapp(App):

    def build(self):
        return MyLayout()


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

在以上程式碼中,我讓MyLayout類繼承GridLayout類,使得在my.kv中的<MyLayout>:可以繼承GridLayout類的特性。

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

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:

執行結果如下:

Text Input使用技巧:

1.禁用多行模式

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        multiline: False

執行結果如下:

在第一個TextInput裡按下Enter會換行,但是在第二個TextInput裡按下Enter會使得此TextInput不再具焦

2.改變文字出現的方向

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        base_direction: 'rtl'

執行結果如下:

3.決定游標的寬度、顏色以及是否閃爍

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        cursor_color: 0.246,0.810,0.121
        cursor_blink: False 
        cursor_width: 15

執行結果如下:

4.決定文字大小與顏色

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        font_size: 30 #決定文字大小
        foreground_color: 0, 1, 0, .9 #決定文字顏色

執行結果如下:

5.決定背景顏色

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        background_color: 0.135,0.791,0.113

執行結果如下:

6.決定提示字串的內容與顏色

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        hint_text: '1234'
        hint_text_color: .3, .4, .9, .8

執行結果如下:

7.指定哪一個TextInput會直接被選擇

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        focus: True

執行結果如下:

8.將此TextInput設定為密碼模式

程式碼如下:

<MyLayout>:

    rows: 2

    TextInput:

    TextInput:
        password: True #開啟密碼模式
        password_mask: '!' #設定密碼模式下每個字元的顯示,預設為'*'

執行結果如下:


沒有留言:

張貼留言

精選文章

Kivy UIX篇 widget篇 TabbedPanel類 event篇 講解