TextBaseline's alphabetic and ideographic enums do not work in Flutter

问题

I thought I understand how these enums work based on this post. When I tried it using the following code, it does not seem to work.

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.baseline,
  textBaseline: TextBaseline.ideographic,
  children: <Widget>[
    Text(
      'abcdefg',
      style: TextStyle(
          fontSize: 50.0, fontWeight: FontWeight.w900),
    ),
    Text(
      'hi',
      style: TextStyle(fontSize: 15.0),
    ),
  ],
),

However, whatever I choose to use as text baseline (ideographic or aphabetic), the result is always the same:

I expect that "hi" aligns to the ideographic baseline of "abcdefg", not to its alphabetic baseline like so:

What am I doing wrong?

EDIT:

There should be a difference between the two in the context of Row widget. I tried removing the line textBaseline: TextBaseline.ideographic, I got this error:

'package:flutter/src/widgets/basic.dart': Failed assertion: line 3791 pos 15: 'crossAxisAlignment != CrossAxisAlignment.baseline || textBaseline != null': is not true.

Requiring which baseline to use must be Flutter's way of knowing which baseline to align against.

回答1:

I dont no complatly your problem but i thing your problem solve by this parameter

mainAxisSize: MainAxisSize.min,

so we have:

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.baseline,
  mainAxisSize: MainAxisSize.min,
  textBaseline: TextBaseline.ideographic,
  children: <Widget>[
    Text(
      'abcdefg',
      style: TextStyle(
          fontSize: 50.0, fontWeight: FontWeight.w900),
    ),
    Text(
      'hi',
      style: TextStyle(fontSize: 15.0),
    ),
  ],
),

回答2:

Screenshot:

You don't need baseline.

Row(
  mainAxisAlignment: MainAxisAlignment.center,
  crossAxisAlignment: CrossAxisAlignment.end,
  children: <Widget>[
    Text(
      'abcdefg',
      style: TextStyle(fontSize: 50.0, fontWeight: FontWeight.w900),
    ),
    Text(
      'hi',
      style: TextStyle(fontSize: 15.0),
    ),
  ],
)

回答3:

So, I did some digging and found some info on this article here.

According to this article :

"alphabetic"

The text baseline is the normal alphabetic baseline. Default value.

"ideographic"

The text baseline is the ideographic baseline; this is the bottom of the body of the characters, 
if the main body of characters protrudes beneath the alphabetic baseline. 
(Used by Chinese, Japanese, and Korean scripts.)

According to this, the output should be differentiable as stated in the problem. So, in order to test the second part of the explanation, I tried using it with Chinese characters.

Column(
              children: <Widget>[
                  Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.baseline,
                  textBaseline: TextBaseline.ideographic,
                  children: <Widget>[
                  Text(
                    '的',
                    style: TextStyle(
                      fontSize: 100.0),
                    ),
                    Text(
                      '的',
                      style: TextStyle(fontSize: 15.0),
                    ),
                  ],
               ),
                Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  crossAxisAlignment: CrossAxisAlignment.baseline,
                  textBaseline: TextBaseline.alphabetic,
                  children: <Widget>[
                  Text(
                    '的',
                    style: TextStyle(
                      fontSize: 100.0),
                    ),
                    Text(
                      '的',
                      style: TextStyle(fontSize: 15.0),
                    ),
                  ],
               ),
                ],
          ),
      ),

The output was this.

As you can see, this too is not the expected output, and both work in the same manner. Hence, it is safe to assume that there may be some problem in Flutter's implementation of these enums.

来源：https://stackoverflow.com/questions/62171872/textbaselines-alphabetic-and-ideographic-enums-do-not-work-in-flutter

标签

Flutter

text

baseline