[SuperTextField] - Add vertical alignment to SuperTextField

[lucasarcouto]

Note from Matt: This is a feature request, not a bug. The poster would like for SuperTextField to support vertical alignment. It's unclear how that would work in conjunction with viewport sizing, but maybe there's a way.

Steps to reproduce

Code:

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Container(
            color: Colors.black,
            child: const SuperTextField(
              lineHeight: 16,
              minLines: 2,
              textAlign: TextAlign.center,
            ),
          ),
        ),
      ),
    );
  }
}

• Run the app
• Tap black rectangle (the text field)
• Type "abc"

Actual behavior

Text stays at the top of the text field.

5_vertical_alignment_issue.mp4

Expected behavior

If user types less paragraphs than minLines, text should be displayed at the center of the widget.

Platform

Flutter 2.10.3 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 7e9793dee1 (4 weeks ago) • 2022-03-02 11:23:12 -0600
Engine • revision bd539267b4
Tools • Dart 2.16.1 • DevTools 2.9.2

CC @venkatd

[matthew-carroll]

I think you're confusing vertical and horizontal alignment. TextAlign.center means horizontal center, not vertical center.

As for the horizontal center, can you check the width of your SuperTextField? I can't tell whether horizontal centering is working or not, because I can't see the actual bounds of the text field.

[lucasarcouto]

Hi @matthew-carroll! Yes, I'm aware that TextAlign.center means horizontal alignment. I left it there as a reference to show that this is the only option available for text alignment for the SuperTextField widget.

Looks like horizontal alignment is not working as well. As you can see in the screenshot below, the SuperTextField widget has a width of 411.4px, which is the same as the parent Container.