首页 > 解决方案 > 如何在TextFormField的左上角开始文本

问题描述

我有 TextFormField 并且我增加了这个字段的高度。我想从左上角开始文本,并使该文本在行尾中断。因此,如果有人会放很多文本,那么字段将有 X 行,而不仅仅是一个。

现在的样子:

在此处输入图像描述

它应该是什么样子

在此处输入图像描述

代码:

 TextFormField(
                      controller: contentController,
                      decoration: InputDecoration(
                        contentPadding: new EdgeInsets.symmetric(
                            vertical: MediaQuery.of(context).size.height * .10,
                            horizontal: 10.0),
                        border: OutlineInputBorder(),
                        hintText: 'Treść',
                        fillColor: Color(0xffffffff),
                        filled: true,
                        prefixIcon: Icon(Icons.topic_rounded),
                      ),
                      validator: (value) {
                        if (value == null || value.isEmpty) {
                          return ErrorMessages.NO_CONTENT_MESSAGE;
                        }
                      },
                    ),

标签: flutterdart

解决方案


您需要指定prefix图标的高度,默认情况下它将位于中心。但是要让它在顶部,您需要添加Container()您将在其中添加这样的图标。

          TextFormField(
              minLines: 4,
              keyboardType: TextInputType.multiline,
              maxLines: 4,
              decoration: InputDecoration(
                border: OutlineInputBorder(),
                hintText: 'Treść',
                fillColor: Color(0xffffffff),
                filled: true,
                prefixIcon: Container(
                  width: 20,
                  height: 100,
                  child: Column(
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: [
                      Padding(
                        padding: const EdgeInsets.all(8.0),
                        child: Icon(Icons.topic_rounded),
                      ),
                      Container(),
                    ],
                  ),
                ),
                prefixIconConstraints: BoxConstraints(
                  minWidth: 35,
                  minHeight: 0,
                ),
              ),
              validator: (value) {
                if (value == null || value.isEmpty) {
                  return "error";
                }
                return null;
              },
            )

它看起来像这样

在此处输入图像描述


推荐阅读