在Flutter中动态居中对齐输入文本字段

ca1c2owp  于 2022-12-30  发布在  Flutter
关注(0)|答案(1)|浏览(139)

我使用了文本表单域()在我的应用程序中,用于插入金额,用户可以通过插入数字来提取金额。但问题是,在框中插入金额后,输入的文本不会相对于框动态居中。我想像Google Pay应用程序中的文本那样动态居中输入的文本。我在此附上的Gpay应用程序的照片一样,我希望它在我的应用程序。
薪资金额录入页面

下面我附上了我的代码和我的应用程序的图像,我面临的问题对齐。

Center(
                child: Container(
                  height: 124,
                  width: 224,
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(4),
                    border: Border.all(
                      color: formInputFieldBortderColor,
                      width: 1,
                    ),
                  ),
                  child: Row(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: [
                      Padding(
                        padding: const EdgeInsets.only(left: 82),
                        child: SvgPicture.asset(AssetRewards.rupees),
                      ),
                      Expanded(
                        child: TextFormField(
                          textDirection: TextDirection.ltr,
                          textAlignVertical: TextAlignVertical.center,
                          maxLength: 3,
                          controller: _textControllor,
                          cursorColor: individualDateColor,
                          keyboardType: TextInputType.number,
                          inputFormatters: [
                            FilteringTextInputFormatter.digitsOnly
                          ],
                          style: GoogleFonts.mulish(
                            color: activeTextColor,
                            fontSize: 44,
                            fontWeight: FontWeight.w400,
                            letterSpacing: 2,
                          ),
                          decoration: const InputDecoration(
                            hintText: "0",
                            hintStyle: TextStyle(color: textLightColor),
                            border: InputBorder.none,
                            counterText: "",
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),

'我在我的应用程序中使用过这个方法,但它不能使输入的文本动态居中。

inn6fuwd

inn6fuwd1#

您无法将文本设置为居中,因为您的卢比图像不给予静态填充到您的图像尝试调整它,并给您的TextFormField textAlign值center。

textAlign: TextAlign.center,

相关问题