Flutter: Random a list of colors-CodePudding

My goal is to generate multiple Stickynote with different color, I already build a list of six different colors. I want to put them shuffle on the card.

ERROR

"message": "The instance member 'color' can't be accessed in an initializer.\nTry replacing the reference to the instance member with a different expression",

Here is the code:


import 'dart:math';
import 'package:flutter/cupertino.dart';

class Sticky {
  final String note;
  List color = [
    const Color(0xffB85252),
    const Color(0xffB4C6A6),
    const Color(0xffF4ABC4),
    const Color(0xff346751),
    const Color(0xffFFC947),
    const Color(0xff3282B8),
  ];

  var colorItem = (color.toList()..shuffle()).first;

  Sticky({required this.note, required this.color});
}

class StickyNote extends StatefulWidget {
  final color;
  final String note;
  const StickyNote({Key? key, this.color, required this.note})
      : super(key: key);

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

class _StickyNoteState extends State<StickyNote> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 300,
      height: 300,
      color: Sticky.colorItem,
    );
  }
}

CodePudding user response：

This looks like a very bad dart code, without any sense to me but I think it is only part of your code.

There is a couple of errors here, that I will summarize below, and also I'm assuming that this code is partial and there is no sense in the usage that you are doing in your example:

final color is not null, and it required

     class StickyNote extends StatefulWidget {
      final Color color;
      final String note;
      const StickyNote({Key? key, required this.color, required this.note})
          : super(key: key);

You are using the class Sticky as a static class, but any of the propriety is static.

A workable solution is the following one

import 'dart:math';
import 'package:flutter/cupertino.dart';

class Sticky {
  final String note;
  static List color = [
    const Color(0xffB85252),
    const Color(0xffB4C6A6),
    const Color(0xffF4ABC4),
    const Color(0xff346751),
    const Color(0xffFFC947),
    const Color(0xff3282B8),
  ];

  Sticky({required this.note});
  
  static Color getColorItem() => (color.toList()..shuffle()).first;
}

class StickyNote extends StatefulWidget {
  final Color color;
  final String note;
  const StickyNote({Key? key, required this.color, required this.note})
      : super(key: key);

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

class _StickyNoteState extends State<StickyNote> {
  @override
  Widget build(BuildContext context) {
    return Container(
      width: 300,
      height: 300,
      color: Sticky.colorItem(),
    );
  }
}

In addition, with this code there is a little bit more sense if your colors didn't change, otherwise, you need to use the object and not the class

CodePudding user response：

You might want to try this:

import 'dart:math';
import 'package:flutter/cupertino.dart';

class StickyColors {
 static final List colors = [
    const Color(0xffB85252),
    const Color(0xffB4C6A6),
    const Color(0xffF4ABC4),
    const Color(0xff346751),
    const Color(0xffFFC947),
    const Color(0xff3282B8),
  ];
}

class StickyNote extends StatefulWidget {
  final String note;
  const StickyNote({Key? key, required this.note})
      : super(key: key);

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

class _StickyNoteState extends State<StickyNote> {

 final _random = Random();

  @override
  Widget build(BuildContext context) {
    return Container(
      width: 300,
      height: 300,
      color: StickyColors.colors[_random.nextInt(6)],
    );
  }
}

I did not actually test it, but I have something similar in my app.

CodePudding user response：

If you just want a random sticky note color without any state logic. You can also convert it to one statelesswidget which can be reused easily:

class StickNote extends StatelessWidget {

final List colors = [
   const Color(0xffB85252),
   const Color(0xffB4C6A6),
   const Color(0xffF4ABC4),
   const Color(0xff346751),
   const Color(0xffFFC947),
   const Color(0xff3282B8),
];

final _random = Random();

@override
Widget build(BuildContext context) {
  return Container(
    width: 300,
    height: 300,
    color: colors[_random.nextInt(6)],
  );
 }
}