如何在 flutter 中访问和更改来自不同文件的变量

Question

我正在尝试从 flutter 中的不同文件访问和更改变量。
基本上，我创建了一个名为 ```colors.dart``` 的文件，我将在其中保存将在 flutter 应用程序中使用的颜色数据。

import 'package:flutter/material.dart';

class colors {
  static Color bgColor = Color(0xfff8f8f8);
}

我希望在按下按钮时更改它的值
我在我的新文件中导入了飞镖文件，并在我的按钮的 onpressed 函数中导入了：


MaterialApp(
      home: Scaffold(
        backgroundColor: colors.bgColor,
...

onPressed: () {
      setState(() {
    colors.bgColor = Color(0xff313131);
  });
},

bgColor.dart 内部的颜色确实显示了，但是当我尝试在 onPressed 上更改它时（也在有状态的小部件中）它不会更改脚手架颜色

Answer 1

您可以使用 Provider 插件 this。

Answer 2

 Color changeColor = colors.bgColor

 
MaterialApp(
  home: Scaffold(
    backgroundColor: changeColor,
...

onPressed: () {
  setState(() {
changeColor = Color(0xff313131);
});
},

Answer 3

如果脚手架和按钮在同一个有状态小部件中

首先确保 backgroundColor: colors.bgColor 和 setState 都在同一个有状态小部件中，它应该可以工作（已测试）

如果脚手架和按钮在不同的小部件中

这种方式不依赖于setState所以你可以在无状态和有状态的小部件中使用它

将颜色类型更改为 ValueNotifier<Color>、

可选：使用 UpperCamelCase 的名称类型

class CustomColors {
  static ValueNotifier<Color> bgColor = ValueNotifier(const Color(0xfff8f8f8));
}

用 ValueListenableBuilder 包裹支架并用 value 属性

    MaterialApp(
      home: ValueListenableBuilder<Color>(
        valueListenable: CustomColors.bgColor,
        builder: (context, value, child) => Scaffold(
          backgroundColor: value,

改变颜色：

onPressed: () {
    CustomColors.bgColor.value = Colors.red;
}

Answer 4

您可以使用共享首选项 https://pub.dev/packages/shared_preferences/install 快速了解如何随时随地使用

如何在 flutter 中访问和更改来自不同文件的变量

How to access and change a variable from a different file in flutter

android

flutter

oop

user-interface

scaffolding

如果脚手架和按钮在同一个有状态小部件中

如果脚手架和按钮在不同的小部件中