简体   繁体   中英

Flutter: Vertical Text widget

I looked up here and pub.dev and flutter docs but could not find(or could not word my query) any solution for this simple task.

I want to display a String with its letters going from up to down while keeping the letter orientations default. So a rotated Text() would not work.

My desired outcome is this:

H
E
L   T
L   H
O   A
    N
W   K
O   S
R   ❤️
L
D

Also, I would need to wrap the String to the next line(column in this case) A height parameter is necessary to limit the number of letters from top to down for each column.

If this last part is too hard to implement, I am open to ideas for the single column solution.

Screenshot:

在此处输入图像描述


Code:

// Create a custom widget like this
class MyVerticalText extends StatelessWidget {
  final String text;

  const MyVerticalText(this.text);

  @override
  Widget build(BuildContext context) {
    return Wrap(
      runSpacing: 30,
      direction: Axis.vertical,
      alignment: WrapAlignment.center,
      children: text.split("").map((string) => Text(string, style: TextStyle(fontSize: 22))).toList(),
    );
  }
}

And use it like:

MyVerticalText("HELLO WORLD THANKS❤️")

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM