Как установить высоту CupertinoSegmentedControl?

Question

Я пытаюсь использовать CupertinoSegmentedControl из флаттера Библиотека Купертино в AppBar, используя атрибут bottom для достижения следующего дизайна (высота = 32)

, поэтому я попробовал следующее:

@override
    Widget build(BuildContext context) {
        return Scaffold(
                appBar: AppBar(
                    elevation: 2,
                    backgroundColor: Colors.white,
                    centerTitle: true,
                    title: Text(this.widget.title, style: TextStyle(color: Colors.black)),
                    bottom: PreferredSize(
        child: Padding(
          padding: const  EdgeInsets.only(top: 8, bottom: 12),
          child: Row(
            children: <Widget>[
              SizedBox(width: 24),
              Expanded(
                child: CupertinoSegmentedControl(
                  children: this.widget.tabs,
                  groupValue: this._selectedTab,
                  onValueChanged: (value) {
                    this.setState(() => this._selectedTab = value);
                    this._tabController.animateTo(value);
                  }
                ),
              ),
              SizedBox(width: 24)
            ],
          ),
        ),
        preferredSize: Size(double.infinity, 48)
      )
                ),
                body: new TabBarView(
                    controller: this._tabController,
                    children: this.widget.views,
                ));
    } 

Answer 1

Что-то похожее на макет, который вы хотите?(Удаление зеленого цвета, конечно, ^ _ ^)

Поиграйте с Container и PreferredSize высот , чтобы отрегулировать высоту в соответствии с вашими потребностями.

Scaffold(
    appBar: AppBar(
        elevation: 2,
        backgroundColor: Colors.white,
        centerTitle: true,
        title:
            Text(this.widget.title, style: TextStyle(color: Colors.black)),
        bottom: PreferredSize(
            child: Row(
              children: [
                Expanded(
                  child: Container(
                    height: 48,
                    color: Colors.lightGreenAccent,
                    child: CupertinoSegmentedControl(
                        children: children,
                        groupValue: this._selectedTab,
                        onValueChanged: (value) {
                          this.setState(() => this._selectedTab = value);
                        }),
                  ),
                )
              ],
            ),
            preferredSize: Size(double.infinity, 48))),
    body: Center(
        child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Text('hello')
        ]
        )
    )
);