Underline multiple lines in single TextField - Flutter/Dart

user_966263 0
Viewed 363

Looking to have a TextField which has multiple rows but also an underline for each row. When typing text it should continue to the next row without needing the return key.

Current:

TextField(
                    maxLines: 2,
                    decoration: InputDecoration(
                      enabledBorder: new UnderlineInputBorder(
                        borderSide: BorderSide(
                            color: Colors.black,
                            width: 1.0,
                            style: BorderStyle.solid),
                      ),
                    ),
                  )

Current Output:

enter image description here

Desired Output:

enter image description here

flutter-layout dart flutter mobile
1 Answers

this will work for you I guess

TextField(
              keyboardType: TextInputType.multiline,
              minLines: 100,
              maxLines: 500,
              style: TextStyle(
                decoration: TextDecoration.underline,
              ),
              decoration: InputDecoration(
                enabledBorder: InputBorder.none,
                hintText: 'Notes.....',
                hintStyle: TextStyle(color: Colors.black87),
              ),
            ),

If you'd still like to change the color or type or density of the underline use the decorationStyle,decorationColor, and decorationThickness properties.

Admin1
Related