Wrap versus Coluna no Flutter

Curiosamente, se eu tiver que fazer uma lista de detalhes com esses widgets:

Row(
  mainAxisAlignment:
      MainAxisAlignment.spaceBetween,
  children: [
    Text('some label'),
    Text('some value'),
  ],
),
Row(
  mainAxisAlignment:
      MainAxisAlignment.spaceBetween,
  children: [
    Text('some label'),
    Text('some value'),
  ],
),

Cada vez que os envolvo dentro de um Wrapou Columnde uma maneira mais simples.

Eu nunca alcançaria o que esperava se usasse Wrap, assim:

Wrap(
  direction: Axis.vertical,
  spacing: 8.0,
  children: [
    Row(
      mainAxisAlignment:
          MainAxisAlignment
              .spaceBetween,
      children: [
        Text('some label'),
        Text('some value'),
      ],
    ),
    Row(
      mainAxisAlignment:
          MainAxisAlignment
              .spaceBetween,
      children: [
        Text('some label'),
        Text('some value'),
      ],
    ),
  ],
),

Saída inesperada:

O problema é que o conteúdo é colocado no lado esquerdo. Mesmo eu envolvendo o Wrapwidget com oSizedBox(width: double.infinity, child: ...)

Eu só consegui o que queria (ou seja, já que estou usando Row(mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [...],)aqui) com esta abordagem:

Uso de Column()widget em vez de Wrap()widget

Column(
  spacing: 8.0,
  children: [
    Row(
      mainAxisAlignment:
          MainAxisAlignment
              .spaceBetween,
      children: [
        Text('some label'),
        Text('some value'),
      ],
    ),
    Row(
      mainAxisAlignment:
          MainAxisAlignment
              .spaceBetween,
      children: [
        Text('some label'),
        Text('some value'),
      ],
    ),
  ],
),

Resultado esperado:

Observe que o SizedBox(width: double.infinity, child: Column(...))é redundante para este caso, a menos que haja um caso de uso que sugira isso.

Alguém poderia explicar com mais detalhes para entender por que isso está acontecendo? Entender melhor isso pode evitar a implementação de configurações erradas se tendermos a usar esse tipo de resultado de layout.

PS O comportamento permanece o mesmo se executado no DartPad

Aqui está o exemplo mínimo e reproduzível :

import 'package:flutter/material.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(colorSchemeSeed: Colors.blue),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  const MyHomePage({super.key, required this.title});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(widget.title)),
      body: Padding(
        padding: EdgeInsets.symmetric(horizontal: 16.0),
        child: Column(
          spacing: 8.0,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [Text('some label'), Text('some value')],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [Text('some label'), Text('some value')],
            ),
          ],
        ),
      ),
    );
  }
}