更新 body 的 Flutter Buttons

Question

你好，我如何制作 2 个按钮来更新 body 内容，如选项卡。当您单击第一个按钮时，它将显示为已选中并且内容将更改（appBar 标题、body、滑块等）。当你点击另一个时，它会显示为选中状态，并且会再次更改内容。但是按钮将出现在两个内容中。就像下面这个例子

看起来像选项卡，但不同之处在于它们正在改变状态并更新页面

Answer 1

最简单的方法是创建一个全局变量来保存所选按钮的值。

从main()方法中取出。

您可以从项目中的每个 class 和文件访问它。

其他方式需要 Provider 和状态管理架构。

工作样本：

import 'package:flutter/material.dart';

int selectedButton = 0;

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Page1(),
    );
  }
}

class Page1 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            body: Column(children: <Widget>[
          Text('Page1'),
          MyWidget(selectedButton),
        ])));
  }
}

class Page2 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        debugShowCheckedModeBanner: false,
        home: Scaffold(
            body: Column(children: <Widget>[
          Text('Page2'),
          MyWidget(selectedButton),
        ])));
  }
}

class MyWidget extends StatelessWidget {
  final int selected;

  MyWidget(this.selected);

  @override
  Widget build(BuildContext context) {
    return Row(children: <Widget>[
      RawMaterialButton(
          child: Text("Go to page1"),
          fillColor: selected == 0 ? Colors.red : Colors.grey,
          onPressed: () {
            selectedButton = 0;
            Navigator.push(
                context, MaterialPageRoute(builder: (context) => Page1()));
          }),
      RawMaterialButton(
          child: Text("Go to page2"),
          fillColor: selected == 1 ? Colors.red : Colors.grey,
          onPressed: () {
            selectedButton = 1;
            Navigator.push(
                context, MaterialPageRoute(builder: (context) => Page2()));
          })
    ]);
  }
}

更新 body 的 Flutter Buttons

Flutter Buttons which updates the body

button

setstate

flutter