Getting EditableText to wrap its text

Question

I want to create an EditableText that adjusts its width to the length of its text. However, my EditableText always takes over all available horizontal space.

My Widget:

                    EditableText(
                        controller: TextEditingController(),
                        cursorColor: MyColors.black,
                        textDirection: TextDirection.ltr,
                        focusNode: FocusNode(),
                        style: TextStyle(),
                    )

Is there any way to fix this problem? Any help is appreciated.

Hope [this answer](https://stackoverflow.com/a/54351773/7604775) will be helped. — librajt, Apr 20 '19 at 07:44

score 0 · Answer 1 · answered May 13 '18 at 16:20

0

Wrap your Widget inside a Expanded.

answered May 13 '18 at 16:20

Amit Wani

109
1
2
6

From the documentation: "Using an Expanded widget makes a child of a Row, Column, or Flex expand to fill the available space in the main axis." That's exactly the thing I **don't** want to achieve. I want the TextField to be as small as possible, but the text should fit in ("wrap"). I'm sorry if my question was misleading. – malte-v May 13 '18 at 17:08
Try using `TextField` widget without `Expanded` wrapped around. – Amit Wani May 13 '18 at 17:16

score 0 · Answer 2 · answered Apr 07 '23 at 07:44

0

Use a forceLine property. By default it's true and forces a line to take the whole available horizontal space. Just change it to false.

answered Apr 07 '23 at 07:44

Anton

1
2

Expanded needed, not necessary to use forceLine – alperefesahin Apr 14 '23 at 05:55

Getting EditableText to wrap its text

2 Answers2