When ever the Opacity in RGBO block is 1, it works fine. However, if i try to incease or decrease the opacity in primary color, it throws an error in Flutter
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Savay',
theme: ThemeData(
fontFamily: 'sen',
primaryColor: Color.fromRGBO(49, 67, 89, 0.8),
accentColor: Color.fromRGBO(248, 248, 248, 1)),
home: Filters(),
);
As previously mentioned in the comments, colors set in theme
should always be opaque. You may want to individually set color opacity to your Widgets individually. Aside from using Colors.fromRGBO
, you can also set the opacity using Colors.{COLOR}.withOpacity(0.5)
.
i got this error why trying to convert rgba to argb, but I solved it with this code
int hexOfRGBA(int r,int g,int b,{double opacity=1})
{
var value=((((opacity * 0xff ~/ 1) & 0xff) << 24) |
((r & 0xff) << 16) |
((g & 0xff) << 8) |
((b & 0xff) << 0)) & 0xFFFFFFFF;
return value;
}
I got that from here https://api.flutter.dev/flutter/dart-ui/Color/Color.fromRGBO.html I think you can pass your rgbo into an hex value and add it as a material color to theme data like so
first, create a map for your material color
Map<int, Color> color =
{
50:primaryColor.withOpacity(0.1),
100:primaryColor.withOpacity(0.2),
200:primaryColor.withOpacity(0.3),
300:primaryColor.withOpacity(0.4),
400:primaryColor.withOpacity(0.5),
500:primaryColor.withOpacity(0.6),
600:primaryColor.withOpacity(0.7),
700:primaryColor.withOpacity(0.8),
800:primaryColor.withOpacity(0.9),
900:primaryColor.withOpacity(1.0),
};
where the primaryColor =Color.fromRGBO(49, 67, 89, 0.8); // one of the color in your theme data, then create a function to convert it to hex code
int hexOfRGBA(int r,int g,int b,{double opacity=1})
{
var value=((((opacity * 0xff ~/ 1) & 0xff) << 24) |
((r & 0xff) << 16) |
((g & 0xff) << 8) |
((b & 0xff) << 0)) & 0xFFFFFFFF;
return value;
}
now instead of passing the rgbo code directly pass each rgbo as a material color like so
theme: ThemeData(
primarySwatch: MaterialColor(hexOfRGBA(49, 67, 89, opacity:0.8),color )
),
where the color, is the map of color we created early on and the hex color is from the function, and the rgbo inside is the rgbo we put in the map. you can do this for both of your color and pass them as material color instead of rgbo into the theme data
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With