Блог

У меня есть a Column с изображением, а под ним a DefaultTabController . Панель вкладок в основном не отображает вкладки, но TabBarView отображаются дочерние элементы.

Это ошибка:

Оператор проверки Null использовался для значения null. Соответствующим вызывающим ошибку виджетом была библиотека TabBar/…/screens/specific_launch.dart:132 При возникновении исключения обрабатывался следующий объект визуализации: RenderCustomPaint#83c8d relayoutBoundary=up10 Объект визуализации: RenderCustomPaint#83c8d relayoutBoundary=up10 Родительские данные: смещение=Смещение(0.0, 0.0); flex=null; fit= null (можно использовать размер) ограничения: BoxConstraints(0.0<=w<=336.0, 0.0<=h<= Бесконечность) размер: Размер (336.0, 100000.0) дочерний элемент: RenderErrorBox#ПОТРЕБНОСТИ daadf-НАРИСОВАТЬ РОДИТЕЛЬСКИЕ данные: (можно использовать размер) ограничения: BoxConstraints(0.0<= w<= 336.0, 0.0<= h<= Бесконечность) размер: Размер (336.0, 100000.0)

Это код:

  return Scaffold(
    appBar: AppBar(
      title: Text(
        'Launch',
        style: GoogleFonts.poppins(fontWeight: FontWeight.w600),
      ),
      actions: [
        IconButton(icon: Icon(Icons.share_outlined), onPressed: () {})
      ],
    ),
    body: Padding(
      padding: EdgeInsets.only(
          top: getHeight(context) / 30.0,
          left: getWidth(context) / 30.0,
          right: getWidth(context) / 30.0),
      child: Column(
        children: [
          // ...first child


          SizedBox(
            width: getWidth(context),
            height: getHeight(context),
            child: DefaultTabController(
                length: 3,
                initialIndex: 0,
                child: Scaffold(
                  appBar: AppBar(
                    bottom: TabBar(
                      tabs: [
                        Tab(
                          text: 'State',
                        ),
                        Tab(
                          text: 'Mission',
                        ),
                        Tab(
                          text: 'Rocket',
                        )
                      ],
                    ),
                  ),
                  body: TabBarView(
                    children: [
                      Text(
                        'Tab 1',
                      ),
                      Text('Tab 2'),
                      Text('Tab 3')
                    ],
                  ),
                )),
          )
        ],
      ),
    ));
 

Это результат, которого я пытаюсь достичь:

Итак, если вы хотите использовать DefaultTabController виджет, вы должны начать свое дерево виджетов с DefaultTabController виджета, а затем добавить свой Scaffold . После этого я использовал только один Scaffold и добавил остальную часть с помощью Expanded виджета

Вот выходное изображение

 class SelectionScreen extends StatefulWidget{
  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _selectionScreen();
  }
}
class _selectionScreen extends State<SelectionScreen>{
  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return DefaultTabController(
        length: 3,
        initialIndex: 0,
        child: Scaffold(
          appBar: AppBar(
            title: Text('Launch',),
            actions: [IconButton(icon: Icon(Icons.share_outlined), onPressed: () {})],
          ),
          body: Column(
            children: [
              Image.network("https://i.stack.imgur.com/45Aaj.png", height: 150,),
              Container(
                height: 70,
                child: AppBar(
                  centerTitle: true,
                  title: Text("New Titile"),
                  bottom: TabBar(
                    tabs: [
                      Tab(text: 'State',),
                      Tab(text: 'Mission',),
                      Tab(text: 'Rocket',)
                    ],
                  ),
                ),
              ),
              Expanded(
                child: TabBarView(
                  children: [
                    Text('Tab 1',),
                    Text('Tab 2'),
                    Text('Tab 3')
                  ],
                ),
              )
            ],
          ),
        ));
  }
}