如何使富文本在颤振中垂直居中对齐?

无夜之*_*之星辰 18 dart flutter

import 'package:flutter/material.dart';

class DraftPage extends StatefulWidget {
  DraftPage({Key key}) : super(key: key);

  @override
  _DraftPageState createState() => _DraftPageState();
}

class _DraftPageState extends State<DraftPage> {
  @override
  Widget build(BuildContext context) {
    final bottomTextStyle = TextStyle(
      fontSize: 12,
      fontWeight: FontWeight.w500,
      color: Colors.red,
    );
    return Scaffold(
      appBar: AppBar(
        title: Text('Test'),
      ),
      body: Container(
        alignment: Alignment.center,
        width: 300,
        height: 57,
        decoration: BoxDecoration(
          color: Colors.yellow,
        ),
        child: Text.rich(
          TextSpan(
            children: [
              TextSpan(
                text: 'AB',
                style: bottomTextStyle,
              ),
              TextSpan(
                text: 'CD',
                style: TextStyle(
                  fontSize: 40,
                  fontWeight: FontWeight.w500,
                  color: Colors.blue,
                ),
              ),
              TextSpan(
                text: 'EF',
                style: bottomTextStyle,
              ),
            ],
          ),
          textAlign: TextAlign.center,
        ),
      ),
    );
  }
}
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

正如你所看到的,虽然我设置了 ,但 AB 和 EF 位于 CD 的底部TextAlign.center

有什么办法让AB CD EF 垂直居中对齐吗?

Md.*_*ikh 40

结果

结果

代码

Text.rich(
          TextSpan(
            children: <InlineSpan>[
              TextSpan(
                text: 'AB',
                style: bottomTextStyle,
              ),
              WidgetSpan(
                alignment: PlaceholderAlignment.middle,
                child: Text(
                  'CD',
                  style: TextStyle(
                    fontSize: 40,
                    fontWeight: FontWeight.w500,
                    color: Colors.blue,
                  ),
                ),
              ),
              TextSpan(
                text: 'EF',
                style: bottomTextStyle,
              ),
            ],
          ),
        ),
Run Code Online (Sandbox Code Playgroud)

  • 谢谢你,这个 `alignment: PlaceholderAlignment.middle` 成功了 (4认同)