【问题标题】:How do I set a default color in my box and let the color change depending on input?如何在我的框中设置默认颜色并让颜色根据输入而变化?
【发布时间】:2019-04-02 08:33:41
【问题描述】:

我正在为我的女儿制作一个简单的数学应用程序。现在我有一个显示问题(如“2+5=”)的文本字段(装饰颜色为白色),然后她可以在同一个框中输入答案(显示“2+5=7”)。

在这个 textField 下面我有另一个 textField。当用户点击按钮时,该字段会给出正确答案。如果用户回答正确,则装饰颜色变为绿色,如果回答错误,则装饰颜色变为红色。

问题是,在按下更正按钮之前,我无法让此框显示为白色。此时没有颜色,直到变成绿色或红色。

我现在已经把每个盒子放在不同的类中,所以如果我做错了也不会搞砸。

非常感谢任何将一些颜色作为“默认”设置到第二个框的帮助。谢谢。

   import 'package:flutter/material.dart';

class CorrectionTextField extends StatelessWidget {
  final String text;
  final boxPaint;

  CorrectionTextField({this.text, this.boxPaint = Colors.white});

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(right: 10.0, top: 8.0),
      child: Container(
        constraints: BoxConstraints.expand(height: 60.0, width: 150),
        decoration: BoxDecoration(
          color: boxPaint,
          borderRadius: BorderRadius.all(const Radius.circular(15.0)),
          border: Border.all(color: Colors.black54, width: 4.0),
        ),
        child: Center(
          child:
          Text(text, style: TextStyle(color: Colors.white, fontSize: 
48.0)),
        ),
      ),
    );
  }
}

下一课:

  Color correctionColor = Colors.white;
   var correct = Colors.green;
  var incorrect = Colors.red;
....
  body: Column(
      children: <Widget>[
        operationField,
        correctionField,

【问题讨论】:

    标签: colors flutter textfield


    【解决方案1】:

    您可以在构造函数中为任何实例变量指定默认值,以添加您可以编写的默认颜色:

    CorrectionTextField({
        this.text,
        this.boxPaint = Colors.white,
    });
    

    这样,如果在实例化小部件时没有指定颜色属性,它将被设置为白色。

    【讨论】:

    • 非常感谢。它还不太好用,但我认为我的代码在 displayClass 中看起来有点滑稽。
    • 您是否使用有状态小部件来管理答案的验证和颜色变化?
    • 您可以添加具有自定义枚举类型的状态变量,例如好、错误和未定义。然后您可以根据状态更新颜色,并重复使用仅更新颜色的相同组件。
    • 我编辑了我的代码以使其正常工作。我将不得不更多地研究枚举解决方案,因为我并没有真正理解它。谢谢
    猜你喜欢
    • 2013-02-03
    • 2016-10-08
    • 2016-01-23
    • 1970-01-01
    • 1970-01-01
    • 2011-08-27
    • 1970-01-01
    • 2016-01-16
    • 2012-02-26
    相关资源
    最近更新 更多