28

I am converting a Color to a String. I am then converting the Color to a String. Unfortunately when I want to convert it back into a Color the operation fails: 

   Color pickerColor = new Color(0xff443a49);
    String testingColorString = pickerColor.toString();

   Color newColor;

   newColor = testingColorString as Color;

type 'String' is not a subtype of type 'Color' in type cast where String is from dart:core Color is from dart:ui

Chrystian
  • 977
  • 3
  • 11
  • 24

7 Answers7

49

In Dart the as operator doesn't allow you to change the actual structure of an Object, it just allows you to provide a hint that an object might have a more specific type. For example, if you had a dog and an animal class you could use as to specify that your animal is actually a dog (as long as the object is actually a dog).

class Animal {}
class Dog extends Animal {}

Animal animal = new Dog();
Dog bob = animal as Dog; // works, since animal is actually a dog
Animal animal2 = new Animal();
Dog bob2 = animal2 as Dog; // fails, since animal2 is actually an Animal

Now, in the example you've provided toString actually just creates a String representation of the current Color value. And since this object is a String, you can't change it back to a Color with an as. Instead, you can parse the String into a value and construct a new Color object.

Color color = new Color(0x12345678);
String colorString = color.toString(); // Color(0x12345678)
String valueString = colorString.split('(0x')[1].split(')')[0]; // kind of hacky..
int value = int.parse(valueString, radix: 16);
Color otherColor = new Color(value);
Jonah Williams
  • 20,499
  • 6
  • 65
  • 53
38

You actually can't do that. Color doesn't have a constructor that accepts a String as a representation of a color.

For that, you could use the Color property value. It is a 32 bit int value that represents your color. You can save it and then use to create your new Color object.

The code could look like this

Color pickerColor = new Color(0xff443a49);
int testingColorValue = pickerColor.value;
String testingColorString = pickerColor.toString();

Color newColor = new Color(testingColorValue);

or like this

Color pickerColor = new Color(0xff443a49);
String testingColorString = pickerColor.toString();

Color newColor = new Color(pickerColor.value);
icazevedo
  • 572
  • 4
  • 10
32

Leveraging the power of Dart extensions we can augment String with a function that returns a Color: 

extension ColorExtension on String {
  toColor() {
    var hexColor = this.replaceAll("#", "");
    if (hexColor.length == 6) {
      hexColor = "FF" + hexColor;
    }
    if (hexColor.length == 8) {
      return Color(int.parse("0x$hexColor"));
    }
  }
}

Set a string color code value in the color property.

 child: Text("Text Color",
             style: TextStyle(
             color: '#55B9F4'.toColor(),
              ),
             )
Mr Bhati
  • 641
  • 7
  • 7
7

Use the following code to get hex value of the color.

Color color = Colors.red;
var hexCode = '#${color.value.toRadixString(16).substring(2, 8)}';
Amit Sachan
  • 91
  • 2
  • 4
3

Another easy way to save color in firebase and retrieve is to first to save the value of the color as String and store this value in firebase like this.

Color black = Colors.black; // example black color

String _storeColorValue = black.value.toString() ;

This is will give 4278190080 as the black color value. you store this value as String to firebase.
You can retrieve color value and change it back to color like this :

int value = int.parse(_storeColorValue);

Color color = Color(value).withOpacity(1);

This is will give us back the color with help of the color value and withOpacity(1) which returns a new color that matches the value we passed in.

schrom
  • 1,372
  • 1
  • 22
  • 36
MOE
  • 41
  • 3
0

Add this two functions

int convertToInt(Color color) {
return color.value;
}



Color convertToColor(int intColor) {
return Color(intColor);
}

then you can just

int intcolor = ColorUtils().convertToInt(Colors.amber); //convert the color to int
print(intcolor.toString()); //se it
Color mycolor = ColorUtils().convertToColor(intcolor); //retrieve the color

Now if you really want to store it as String, just do:

intcolor.toString();

and when retrieve it from firestore

Color mycolor = ColorUtils().convertToColor(int.Parse(retrievedStrColor));
Thiago Silva
  • 670
  • 6
  • 18
-1

use this site to convert hex color to rgb color and set folow code

https://www.w3schools.com/colors/colors_hexadecimal.asp

backgroundColor: const Color.fromRGBO(212, 23,79, 0.99),

mohammad mowludi
  • 1
  • 2