如何在Flutter DataColumn小部件中居中标签？

Question

我可以让DataRow中的DataCell居中显示，但如何让DataColumn标签也居中呢？

我想让第一个DataColumn左对齐，其它的则居中显示。将标签放入Center组件中无效。

new DataColumn(
            label: Center(
              child: Text(statName,textAlign: TextAlign.center,
                style: TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold),),
            )
        );

- user1961

Answer 1

发现方法：

DataColumn(
    label: Expanded(
        child: Text(
  'Label',
  textAlign: TextAlign.center,
))),

- Rodrigo Boratto

---

使用后，我得到了以下错误信息：```Incorrect use of ParentDataWidget.ParentDataWidget Expanded(flex: 1) 想要将类型为 FlexParentData 的 ParentData 应用于 RenderObject，但该 RenderObject 已经被设置为接受类型不兼容的 BoxParentData。通常，这意味着 Expanded widget 具有错误的祖先 RenderObjectWidget。通常情况下，Expanded widgets 直接放置在 Flex widgets 中。有问题的 Expanded 当前放置在 Align widget 中。``` - Adnan haider

哪个Flutter版本？我刚在2.10.3上重新测试了一下，它可以工作。 - Rodrigo Boratto

我也在使用当前最新版本。 - Adnan haider

嘿，伙计，请将导致错误的代码作为另一个问题发布，这样我就可以尝试帮助您了。我相信它与上面的片段无关。 - Rodrigo Boratto

如果您在父树中有一个 Stack widget，就不能在 DataColumn 中使用 Expanded。您会收到错误消息：“Incorrect use of ParentDataWidget. The ParentDataWidget Expanded(flex: 1) wants to apply ParentData of type FlexParentData to a RenderObject, which has been set up to accept ParentData of incompatible type BoxParentData. Usually, this means that the Expanded widget has the wrong ancestor RenderObjectWidget. Typically, Expanded widgets are placed directly inside Flex widgets. The offending Expanded is currently placed inside a Align widget.” 测试- flutter run -d chrome --release - Shamik Chodankar

Answer 2

针对这个问题，我也接受 Rodrigo Boratto 的答案。在 flutter v3.7.3 上进行了测试。

我来这里是为了获得“如何将 DataCell 居中”的答案。我在这里放出我的发现，供有兴趣的人参考。

DataCell(
  Align(
    alignment: Alignment.center,
    child: Text(
        match['score'],
        textAlign: TextAlign.center,
    ),
  ),
),

- Dananjaya

Answer 3

你可以将Label的内容放在一个Center小部件中。还有一个Align小部件，使用alignment: Alignment.center和你的Text作为子元素。"最初的回答"

- Charles Jr

---

感谢您的回复。不幸的是，即使使用Align或Center包装标签：内容（文本），也无法将其从左对齐位置移动。尝试将标签内容居中并对齐。 - user1961

Answer 4

这是我解决这个问题的方法：

DataColumn(
            label: Center(
            widthFactor: 5.0, // You can set as per your requirement.
            child: Text(
            'View',
            style: style_16_bold_primary,
            ),
          ),
      ),

- Sanjeev Sangral

---

问题已经表明Center对他没有起作用。 - Sam Ramezanli

Answer 5

我曾经遇到过同样的问题，并通过在data_table.dart文件中注释以下代码段来解决了这个问题。

if (onSort != null) {
  final Widget arrow = _SortArrow(
    visible: sorted,
    down: sorted ? ascending : null,
    duration: _sortArrowAnimationDuration,
  );
  const Widget arrowPadding = SizedBox(width: _sortArrowPadding);
  label = Row(
    textDirection: numeric ? TextDirection.rtl : null,
    children: <Widget>[ label, arrowPadding, arrow ],
  );
}

- Mutlu Simsek

---

我认为更改核心功能不是一个好主意。也许从它们扩展并更改您想要的方法会更合适。 - Rodrigo Boratto