时间戳

首页 > 解决方案 > 从另一个页面颤动改变小部件的状态

flutter - 从另一个页面颤动改变小部件的状态

问题描述

简而言之，我的问题：我会尝试从另一个小部件更改小部件的状态。

长：

我将不胜感激


  import 'package:flutter/material.dart';
  
  class Display extends StatefulWidget {
    Display({Key? key, required this.color}) : super(key: key);
  
    Color color;
  
    @override
    State<StatefulWidget> createState() => DisplayState();
  }
  
  class DisplayState extends State<Display> {
    @override
    Widget build(BuildContext context) {
      return Container(
        color: widget.color,
      );
    }
  
    changeColor(Color color) {
      setState(() {
        widget.color = color;
      });
    }
  }

标签： flutterdart

解决方案

我不知道我是否正确理解了你想要什么，但如果我是对的，你可以这样做：

  • 创建一个颜色类型的变量；
  • 制作一个改变这个变量状态的函数（setState）；
  • 将此函数作为参数传递给您要更改颜色的小部件。
  • 在您的其他页面中调用该函数。

您的第一个屏幕应该有一个变量来保存颜色值

Color containerColor;

改变其值的函数

void _setContainerColor(Color newColor) {
  setState(() {
    containerColor = newColor;
  });
}

并使用容器中的变量

Container(
  color: containerColor, // your variable state
  child: SomeWidget(),
);

将您的函数作为参数传递给您的第二页

MyOtherWidget(_setContainerColor);

在您的 Other Widget 中，您声明一个 Function 类型的变量来接收您的函数：

const MyOtherWidget(this._setContainerColor) extends StatefulWidget {
  final Function _setContainerColor;

  @override
  _MyOtherWidgetState createState() => _MyOtherWidgetState();
}

class _MyOtherWidgetState extends State<_MyOtherWidget> {
  @override
  Widget build(BuildContext context) {
    return TextButton(
      child: Text("Change Color"),
      onPressed: () {
        widget._setContainerColor(Colors.red);
      },
    )
  }
}

不要忘记containerColor在您的容器背景颜色中使用您的 as 值。

推荐阅读