LoginSignup
0
1

【Flet】TextFieldの入力文字チェック

Posted at

概要

  • input_filterを使うと関数を作らずに入力可能文字チェックが行える
  • 事前に正規表現でパターンを設定し、入力不可文字の場合、文字の置換で対応する
  • ユーザーからの入力操作時のみ、動作する

背景

  • TextFieldを用いる時、入力可能文字チェックを行っている
    • 実行ボタン押下時のon_clickでチェック処理を行っている
    • ただ、TextField項目が多くなるとコード量が多くなってしまう
  • また、実行ボタン押下よりも早くチェックしたい
    • TextFieldのon_changeでもよいが、on_clickと同じでメソッドを定義する必要あり

input_filterを使ってみる

  • TextFiledにはinput_filterというプロパティがバージョン0.13.0から搭載されている1
  • このプロパティはあらかじめ入力可能文字を設定し、想定していない文字入力を防ぐものである
    • ただし、ユーザーが文字入力を行う場合のみ動作する(プログラムの自動入力時は動作しない)

使い方

サンプルコード2

  • 半角数字のみの入力欄を作ってみる
  • 半角数字は受付、それ以外は入力しても何も起こらないというか空白に置き換えられる
    • 半角数字を打った後に、全角文字を入力すると入力欄がすべて空白になる
sample.py

import flet as ft


class SampleInputFilter(ft.UserControl):
    def __init__(self, page: ft.Page):
        super().__init__()
        self.page = page

    def build(self):
        self.input_item = ft.Ref[ft.TextField]()
        self.view = ft.Column(
            [
                ft.TextField(
                    ref=self.input_item,
                    width=300,
                    label="半角数字のみ受け付け",
                    input_filter=ft.InputFilter( # 事前に文字パターン設定
                      allow=True, regex_string=r"[0-9]+$", replacement_string=""
                    ),
                )
            ]
        )
        return self.view


def main(page: ft.Page):
    page.title = "Trial InputFilter"
    page.horizontal_alignment = ft.CrossAxisAlignment.START
    page.update()

    page.add(SampleInputFilter(page))


ft.app(target=main)

input_filter_sample.png

属性について

  • allow
    • regex_stringで設定したパターンのみ許可 or 拒否するか
    • デフォルトでは許可
  • regex_string
    • 文字パターン
    • 正規表現で記載
  • replacement_string
    • 禁止/拒否されたパターンを置き換えるための文字列
    • エラーメッセージとかではない
    • デフォルトは空白に置き換える

補足

  • よくある入力パターンには、以下のヘルパーメソッドも活用できる
    • NumbersOnlyInputFilter()
      • 数字のみ
    • TextOnlyInputFilter()
      • テキスト文字のみ

使ってみた感想

  • 事前に定義できることで、ある程度コード量は減らせそうだと感じた
  • ただ、エラーテキスト表示ではない(文字置換)ため、なんでもこれに当てはめるのは良くないかも
    • ユーザーからすれば、一瞬何がおこったかわからなくなってしまう

参考文献

  1. https://github.com/flet-dev/flet/blob/main/CHANGELOG.md#0130

  2. Python(3.10)、Flet(0.20.2)で実装

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1