静态成员变量颜色不绘制

Question

我在 Flutter 中有一个 StatefulWidget State 类。

我已经声明了一些静态的 const Color 成员变量。当我尝试使用这些颜色时，它们并没有被绘制出来。当我采用相同的 Color ctor 并将其内联到使用静态成员变量的位置时，它可以工作。

我是否遗漏了有关 dart 中的成员变量初始化的内容？

观察构建方法中的局部变量color。如果三元运算符使用内联 ctor 颜色，它可以工作。如果它使用静态成员 var DARK_COLOR....什么都不会绘制。

import 'package:flutter/material.dart';
import 'chess.dart' as chesslib;

class ChessBoard extends StatefulWidget {
    @override
    _ChessBoardState createState() => _ChessBoardState();
}

class _ChessBoardState extends State<ChessBoard> {

    Color LIGHT_COLOR = Color(0xffeeeebb);
    Color LIGHT_COLOR_SELECTED = Color(0xffaaaaaa);
    Color DARK_COLOR = Color(0xffffffff);
    Color DARK_COLOR_SELECTED = Color(0xff119911);

    chesslib.Chess _chess;

    @override
    void initState() {
        super.initState();
        _chess = new chesslib.Chess();
    }

    @override
    Widget build(BuildContext context) {

        Widget result;

        result = GridView.count(
            crossAxisCount: 8,
            children: List.generate(64, (index) {
                int row = index ~/ 8;
                int col = index % 8;
                int modulo = (row % 2 == 0) ? 0 : 1;

                Color color  = (index % 2 == modulo) ? Color(0xffeeeebb) : DARK_COLOR;

                return Container(
                    color: color,
                    child: Text (display_str)
                );
            }),
        );

        return result;
    }
}

Answer 1

您的代码效果更好，可能颜色 FFFFFFFF 不是您想要的
看下面的色板

完整的测试代码
深色使用 0xff666666

    import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;
  Color specialColor = Color(0xffbfeb91);
  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Expanded(flex: 1, child: ChessBoard()),
            Text(
              'Hello World',
              style: TextStyle(
                  backgroundColor: specialColor), // or 'bfeb91', or 'ffbfeb91'
            ),
            Text(
              'You have pushed the button this many times:',
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.display1,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }
}

class ChessBoard extends StatefulWidget {
  @override
  _ChessBoardState createState() => _ChessBoardState();
}

class _ChessBoardState extends State<ChessBoard> {

  Color LIGHT_COLOR = Color(0xffeeeebb);
  Color LIGHT_COLOR_SELECTED = Color(0xffaaaaaa);
  Color DARK_COLOR = Color(0xff666666);
  Color DARK_COLOR_SELECTED = Color(0xff119911);

  //chesslib.Chess _chess;

  @override
  void initState() {
    super.initState();
    //_chess = new chesslib.Chess();
  }

  @override
  Widget build(BuildContext context) {

    Widget result;

    result = GridView.count(
      crossAxisCount: 8,
      children: List.generate(64, (index) {
        int row = index ~/ 8;
        int col = index % 8;
        int modulo = (row % 2 == 0) ? 0 : 1;

        Color color  = (index % 2 == modulo) ? Color(0xffeeeebb) : DARK_COLOR;

        return Container(
            color: color,
            child: Text ('display_str')
        );
      }),
    );

    return result;
  }
}