你如何在颤振中反转颜色?

时间:2021-04-06 08:27:15

标签: flutter colors invert

我有一个用于创建渐变效果的小部件:

class GradientContainer extends StatelessWidget {
  final child;

  GradientContainer({@required this.child});
  @override
  Widget build(BuildContext context) {
    return Stack(children: [
      Positioned(
          left: 5,
          top: 17,
          bottom: 5,
          right: 9,
          child: ClipRRect(
            borderRadius: BorderRadius.circular(4),
            child: Container(
              decoration: BoxDecoration(
                  gradient: LinearGradient(
                      begin: Alignment.topLeft,
                      end: Alignment.bottomRight,
                      stops: [
                    0.0,
                    1.0
                  ],
                      colors: [
                    Colors.black.withOpacity(0.0),
                    Theme.of(context).scaffoldBackgroundColor.withOpacity(0.8),
                  ])),
            ),
          )),
      child,
    ]);
  }
}

这很有效,直到用户切换到深色主题并且无法非常清晰地调整渐变。所以,我想做一些类似 Theme.of(context).scaffoldBackgroundColor.invertColor().withOpacity(0.8) 的事情,这样我就可以得到身体的反转颜色,无论主题如何,我都能在渐变上创造出良好的对比。有人知道怎么做吗?我试过在网上查找,但我能找到的只是如何将反转过滤器应用到图像上。

1 个答案:

答案 0 :(得分:0)

根据http://www.vb-helper.com/howto_invert_color.html

<块引用>

您可以通过减去红色、绿色和蓝色中的每一个来反转颜色 来自 255 的组件。换句话说:

new_red   = 255 - old_red
new_green = 255 - old_green
new_blue  = 255 - old_blue
Color invert(Color color) {
  final r = 255 - color.red;
  final g = 255 - color.green;
  final b = 255 - color.blue;

  return Color.fromARGB((color.opacity * 255).round(), r, g, b);
}

void main() {
  final inverted = invert(Colors.deepOrange);
}