Qualquer alternativa para widgets expandidos usando ListView.builder

Question

Eu preciso projetar uma tela que mostra um widget diferente (selectedWidget) dependendo de qual botão está selecionado. O problema é que o conteúdo é dinâmico e tenho que usar ListView.builder para todas as APIs. E ListView.builder funciona apenas quando a linha que contém listview é agrupada no widget Expandido. Eu quero ter dois botões logo abaixo do meu ListView, o que não consigo fazer devido ao widget Expanded que cobre toda a coluna em que o ListView está presente.

Este é o design de que preciso.

O código fornece a estrutura básica que estou usando. selectedWidget é o widget ListView.builder que será selecionado de acordo com o FlatButton selecionado. Além disso, a coluna que contém o selectedWidget tem altura dinâmica. Ele deve se ajustar de acordo com o tamanho do listview, então não posso definir uma altura fixa ou mesmo um maxHeight. Só posso dar minHeight aqui. E os dois botões abaixo do meu ListView devem estar logo abaixo do meu ListView e tomar a largura da coluna com flex 3.

Também tentei desabilitar a rolagem para ListView e usar SingleChildScrollView, mas meus dois botões abaixo de ListView também começaram a rolar, o que não quero. Eu preciso que eles sejam estáticos na tela e apenas o ListView deve rolar.

Preciso de uma solução para o problema acima. Eu preciso de uma solução alternativa para este widget expandido que não me permite alinhar meus botões logo abaixo da minha visualização de lista e fornece espaço em branco. Compartilhe se houver alguma alternativa para ListView.builder porque não acho que posso usar ListView.builder sem o widget Expanded. Eu tentei todas as estruturas possíveis com ListView e widget Expanded.

class MyScreen extends StatefulWidget {
  @override
  _MyScreenState createState() => _MyScreenState();
}

class _MyScreenState extends State<MyScreen> {
  @override
  Widget build(BuildContext context) {
    return Column(
    children:[
      Expanded(
          child: Row(
          Expanded(flex: 2,
            child: Column(
                children: [
                    FlatButton(),
                    FlatButton(),
                    FlatButton(),
                    FlatButton(),
                ]
            )
           ),
          Expanded(flex: 3, 
            child: Column(
                children: [
                    Expanded(selectedWidget),
                    Row(children: [FlatButton(), FlatButton()], )
                ]
            )
          ),
      )
      )
    ],);
  }
  
}

Answer 1

Talvez você possa usar Flexiblee definir shrinkWrap: true,dentro de ListView. Os 2 botões a seguir podem não precisar de Expandwidget depois disso.

child: Column(
  children: [
    Flexible(
      child: ListView.builder(
        shrinkWrap: true,
        itemBuilder: (BuildContext context, int index) => Text(index.toString()),
        itemCount: 6,
      ),
    ),
    Row(
      ... // 2 Buttons