【问题标题】:Why this toggle button not working in flutter - dart?为什么这个切换按钮在颤振 - 飞镖中不起作用?
【发布时间】:2021-08-14 11:34:30
【问题描述】:

我正在从模型中检索切换按钮的布尔值。该按钮不在屏幕中的真假之间切换。我是新手,请帮我解决这个问题。

这是我为切换按钮提供的代码。

Padding(
                        padding: const EdgeInsets.symmetric(horizontal: 5.0),
                        child: AnimatedContainer(duration: Duration(milliseconds: 1000),
                        height: 35.0,
                        width: 70.0,
                        decoration: BoxDecoration(
                         borderRadius: BorderRadius.circular(20.0),
                          color: TaskData().tasks[0].isOn ? Color(0xFF1F8BD0): Colors.grey[100]!.withOpacity(0.2)
                        ),
                          child: Stack(
                            children: <Widget>[
                              AnimatedPositioned(
                                  duration: Duration(milliseconds: 400),
                                curve: Curves.ease,
                                left: TaskData().tasks[0].isOn ? 30.0 : 0.0,
                                right: TaskData().tasks[0].isOn ? 0.0 : 30.0,
                                child: InkWell(
                                  onTap: (){
                                    setState(() {
                                      TaskData().tasks[0].isOn = !TaskData().tasks[0].isOn;
                                    });
                                  },
                                  child: AnimatedSwitcher(
                                    duration: Duration(milliseconds: 10),
                                    transitionBuilder: (Widget child, Animation<double> animation) {
                                      return ScaleTransition(child: child, scale: animation);
                                    },
                                    child: TaskData().tasks[0].isOn? Icon(Icons.circle, color: Colors.white, size: 35.0,
                                    key: UniqueKey(),
                                    ) : Icon(Icons.circle, color: Colors.white, size: 35.0,
                                    key: UniqueKey(),
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      )

此代码来自模型:

class T{
final String tsk;
 bool isOn;

 T({required this.tsk, required this.isOn});
 }

class TaskData {
 List tasks = [
  T(tsk: "complete the work", isOn: false),
  T(tsk: "do the work", isOn: false),
  T(tsk: "do the pending works", isOn: false)
]
}

【问题讨论】:

    标签: android flutter android-studio dart flutter-layout


    【解决方案1】:

    每次使用TaskData() 时,都会创建该类的 实例,并带有 任务列表。

    您需要创建一个包含TaskData 实例的变量。否则,您所做的所有更改都将毫无意义,因为您每次调用都会重新创建数据。

    在您的程序中的某个时刻,您需要一个变量,可以将其命名为 myTaskData

    final myTaskData = TaskData();
    

    然后将每次调用TaskData() 替换为myTaskData,这样它们都引用同一个实例。

    请注意,build 方法不是该变量的正确位置。它应该在某种State 类的类级别上。

    【讨论】:

    • 你能给我提供如何实现你的解决方案的代码吗?
    • @gocaf19619 我做到了。如果您需要更多信息,您需要提供我可以修改的minimal reproducible example
    猜你喜欢
    • 2019-02-05
    • 2022-06-20
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-03-26
    • 2023-01-07
    • 2020-12-28
    • 2021-02-26
    相关资源
    最近更新 更多