更新正文的颤振按钮

Question

您好，我怎样才能制作 2 个按钮来更新标签页之类的正文内容。当您单击第一个按钮时，它将显示为已选中并且内容将发生变化（appBar 标题、正文、滑块等）。当您单击另一个时，它将显示为已选中，并将再次更改内容。但按钮将出现在两个内容中。就像下面这个例子一样

有一些看起来像标签但不同的是它们正在改变状态和更新页面

Answer 1

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

把它放在 main() 方法之外。

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

其他方式需要提供者和状态管理架构。

工作样本：

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()));
          })
    ]);
  }
}