Настроить панель вкладок флаттера

Question

Я использую виджет TabBar, и я хотел бы настроить представление TabBar, как это изображение. Я много раз пробовал автобус, между двумя вкладками есть пробелы.

это код, который я использовал для настройки вида вкладок.

TabBar(
            controller: _tabController,
            labelColor: Colors.black12,
            unselectedLabelColor: Colors.black12,
            indicatorSize: TabBarIndicatorSize.label,
            tabs: [
              Tab(
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.horizontal(
                        left: Radius.circular(50), right: Radius.zero),
                    border: _tabController.index == 1
                        ? Border.all(color: Colors.black12, width: 2)
                        : Border.all(color: Colors.transparent, width: 2),

                    color: _tabController.index == 0
                        ? Colors.indigo
                        : Colors.white,
                  ),
                  child: Align(
                    alignment: Alignment.center,
                    child: Text("Income"),
                  ),
                ),
              ),
              Tab(
                child: Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.horizontal(
                        left: Radius.zero, right: Radius.circular(50)),
                    border: _tabController.index == 1
                        ? Border.all(color: Colors.transparent, width: 2)
                        : Border.all(color: Colors.black12, width: 2),
                    color: _tabController.index == 1
                        ? Colors.indigo
                        : Colors.white,
                  ),
                  child: Align(
                    alignment: Alignment.center,
                    child: Text("Expense"),
                  ),
                ),
              ),
            ],
          ),

выход

Answer 1

вы можете задать радиус всей нижней части, а не только две вкладки, которые вы можете сделать что-то вроде этого, просто укажите радиус для всех сторон. Мне нужно указать только верхнюю правую и верхнюю левую сторону в моем случае

PreferredSize(
                  child: Container(
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        topLeft: Radius.circular(30),
                        topRight: Radius.circular(30),
                      ),
                    ),
                    child: TabBar(
                      // indicatorPadding: EdgeInsets.all(30),

                      tabs: [
                        Tab(
                          child: Text(
                            "Expnanse",
                            style: TextStyle(color: Colors.black),
                          ),
                        ),
                        Tab(
                          child: Text(
                            "Income",
                            style: TextStyle(color: Colors.black),
                          ),
                        ),
                      ],
                    ),
                  ),
                  preferredSize: const Size.fromHeight(70.0),
                ),
              ),