How to pass variable content to a parameter value in dart/flutter?

1
votes

I may be missing something obvious, but I'm having trouble passing a variable to a parameter or widget in flutter/dart. For example, let's say I have some variable:

String col = 'red';

and I want to pass this to a color parameter to get the equivalent of 

color: Colors.red

The difficult thing is that any way I try to pass the value ends up passing a string (which isn't accepted), including trying to pass just the value of col directly or trying to build a function that returns Colors.col.

I think what I need is something like a function like

setColor(String str) {
    return Colors.str;
  }

but, as you might expect, this returns "The getter 'str' isn't defined for the type 'Colors'." (And similarly for:

setColor(String str) {
    return Colors.$str;
}

I know one option is to create a function using a bunch of if's, like

setColor(String str) {
 if (str==red) return Colors.red;
 if (str==blue) return Colors.blue;
 if (str==green) return Colors.green;
etc.
}

but I'd prefer a more elegant option if one is available.

EDIT: It looks like this isn't quite as easy as I'd hoped (see answers and comments to answers below).

3
oopflutterdart

3 Answers

1
votes

The library Supercharged is your best solution. You can try it this way (Hex text or HTML color):

"#ff00ff".toColor();  // pink
"ff0000".toColor();   // red
"00f".toColor();      // blue
"red".toColor();      // red (HTML color name)
"deeppink".toColor(); // deep pink (HTML color name)

Of course, this function depends on extension. Extension methods, introduced in Dart 2.7.

Edit:

extension MainAxisAlignmentExtension on String {
  MainAxisAlignment get mainAxis {
    switch (this.toUpperCase()) {
      case "BETWEEN":
        return MainAxisAlignment.spaceBetween;
      case "AROUND":
        return MainAxisAlignment.spaceAround;
      case "EVENLY":
        return MainAxisAlignment.spaceEvenly;
      case "CENTER":
        return MainAxisAlignment.center;
      case "START":
        return MainAxisAlignment.start;
      case "END":
        return MainAxisAlignment.end;
      default:
        return MainAxisAlignment.start;
    }
  }
}

print("Between".mainAxis);
print("AROUND".mainAxis);
0
votes

Instead of passing Color as String, you can use type Color

Color col = Colors.red;

If you want to continue using String to store color you can use the hex value

String col = "#FF5733";

And use a function to convert it to color

Color hexToColor(String code) {
  return new Color(int.parse(code.substring(1, 7), radix: 16) + 0xFF000000); 
}

Example:

Color newColor = hexToColor(col);

Hope this is what you are looking for!

0
votes

You can pass colors from one widget to another by declaring color as a variable.

final Color redColor=Colors.red;

Then you can pass it to a widget as an argument (Passing color to a widget):

Widget something(Color redColor){
 Text("It Works!",style: TextStyle(color: redColor))
}

If you want to pass it from one stateless or stateful widget to another:

class DetailScreen extends StatelessWidget {
  // Declare a field that holds the color.
  final Color redColor;

  // In the constructor, require a Color.
  DetailScreen({Key key, @required this.redColor}) : super(key: key);

  // Your widget build and other things here
}

Then get the value by calling:

Text("It Works!",style: TextStyle(color: widget.redColor))