如何在 Flutter App 的文本域右侧添加美元符号

Question

how can we achieve like... Added Below Example for it..

https://i.imgur.com/fzwvHte.mp4

This is the Code I am Working on it.

Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text("Exchange"),
                      SizedBox(width: 20),
                      Container(
                        width: width / 2,
                        child: TextFormField(
                          textAlign: TextAlign.right,
                          keyboardType: TextInputType.number,
                          textDirection: TextDirection.rtl,
                          decoration: const InputDecoration(
                              border: InputBorder.none,
                              hintText: "0",
                              isDense: true,
                              prefix: Text(
                                "\$",
                                textAlign: TextAlign.right,
                                textDirection: TextDirection.rtl,
                              ),
                              prefixStyle: TextStyle()),
                        ),
                      ),
                    ],
                  ),

Answer 1

你不能只使用 suffixIcon 属性吗？

suffixIcon: Text('$')

Answer 2

**This is how can u do it on your code . thanks**

 Row(
                        mainAxisAlignment: MainAxisAlignment.spaceBetween,
                        children: [
                          Text("Exchange"),
                          SizedBox(width: 20),
                          Container(
                            width: width / 2,
                            child: TextFormField(
                              textAlign: TextAlign.right,
                              keyboardType: TextInputType.number,
                              textDirection: TextDirection.rtl,
                              decoration: const InputDecoration(
                                  border: InputBorder.none,
                                  hintText: "0",
                                  isDense: true,
                                  suffixIcon: Text('$'),
                                  ),
                            ),
                          ),
                        ],
                      )

Answer 3

If your keyboard doesn't have a dollar sign then you could use the unicode character:\$

Container(
        width: MediaQuery.of(context).size.width,
        height: MediaQuery.of(context).size.height,
        color: Colors.white,
        child: Center(
          child: Text("\u0024 2500"),
        ),
      ),

Answer 4

I think you can use the inputFormatters to achieve this as follows:

                Row(
                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
                    children: [
                      Text("Exchange"),
                      SizedBox(width: 20),
                      Container(
                        width: width / 2,
                        child: TextFormField(
                          textAlign: TextAlign.right,
                          keyboardType: TextInputType.number,
                          textDirection: TextDirection.rtl,
                          inputFormatters: [
                            TextInputFormatter.withFunction(oldValue,newValue)=>
                              newValue.copyWith(text:newValue.text.contains("$") ?newValue.text : "\$ ${newValue.text}")
                             ]
                    
                      ),
                    ],
                  ),