簡體   English   中英

如何在 Flutter 中向 TextFormField 添加靜態單元(文本)?

[英]How to add a static unit (text) to a TextFormField in Flutter?

我目前有一個帶有hintText的TextFormField

當前文本表單字段

目標是在 TextFormField 中添加 Units,無論用戶是否正在輸入。 它應該看起來像這樣:

目標

如何實現這一目標? 另外,如何將值居中?

這是我當前的 TextFormField 代碼:

TextFormField(
  decoration: InputDecoration(
    hintText: '0.0',
    contentPadding: EdgeInsets.symmetric(horizontal: 20.0, vertical: 5.0),
    filled: true,
    fillColor: Colors.white24,
    floatingLabelBehavior: FloatingLabelBehavior.never,
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(10.0),
      borderSide: BorderSide.none,
    ),
    counterText: '',
  ),
),

TextFormField修飾可以是一個suffixText屬性

     TextFormField(
       controller: c,
       // align to center
       textAlign: TextAlign.center,
       decoration:  InputDecoration(
         hintText: '0.0',
         // show kg
         suffixText: 'Kg',
     )

文本可以使用textAlign屬性居中

一種方法是在容器內的行內使用 TextFormField 和文本,這樣可以幫助

Container(
          child: Row(
            children: [TextFormField(), Text('Kg')],
          ),
        ),

另一種方法是你可以使用

TextFormField(
                decoration: InputDecoration(suffixText: 'Kg'),
              ),

但這里的問題是,當啟用 TextFormField 時,您只會獲得后綴文本,您可以嘗試使其始終可見的一種解決方法是使用autovalidate屬性,例如

TextFormField(
                autovalidateMode: AutovalidateMode.always,
                decoration: InputDecoration(suffixText: 'Kg'),
              ),

我還沒有測試過這個 autovalidateMode 但它應該可以正常工作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM