ShaderMask 着色器遮罩

可容纳一个孩子，并通过着色器来对孩子进行着色，可指定混色模式。通常用于组件渐变色处理。

相关组件

Image ColorFiltered

径向渐变着色

   <br />【child】 : 孩子组件   【Widget】<br />【shaderCallback】 : 着色器回调   【ShaderCallback】<br />【blendMode】 : 混色模式   【BlendMode】<br />   通过RadialGradient#createShader创建径向渐变着色器。<br />![image.png](https://cdn.nlark.com/yuque/0/2020/png/326147/1589506234303-500a6424-0b33-4f52-a496-9fa226d2c5eb.png#align=left&display=inline&height=133&margin=%5Bobject%20Object%5D&name=image.png&originHeight=133&originWidth=396&size=39631&status=done&style=none&width=396)

import 'package:flutter/material.dart';
class RadialShaderMask extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Wrap(
      spacing: 20,
      crossAxisAlignment: WrapCrossAlignment.center,
      children: <Widget>[
        ShaderMask(
          shaderCallback: _buildShader,
          child: Image.asset(
            'assets/images/icon_head.png',
            height: 70,
            width: 70,
          ),
        ),
        ShaderMask(
          shaderCallback: _buildShader,
          child: Text(
            '张风捷特烈',
            style: TextStyle(fontSize: 40, color: Colors.white),
          ),
        ),
        ShaderMask(
          shaderCallback: _buildShader,
          child: Container(
            height: 100,
            color: Colors.white,
            width: 50,
          ),
        ),
      ],
    );
  }

  final colors = [Colors.red, Colors.yellow, Colors.blue];

  Shader _buildShader(Rect bounds) => RadialGradient(
          center: Alignment.topLeft,
          radius: 1.0,
          tileMode: TileMode.mirror,
          colors: colors)
      .createShader(bounds);
}

线性渐变着色

   <br />通过LinearGradient#createShader创建线性渐变着色器<br />着色器相关知识详见【绘制专辑】<br />![image.png](https://cdn.nlark.com/yuque/0/2020/png/326147/1589506249484-8785d3c5-51a7-4987-866c-93df2fc2086e.png#align=left&display=inline&height=131&margin=%5Bobject%20Object%5D&name=image.png&originHeight=131&originWidth=396&size=26484&status=done&style=none&width=396)

import 'package:flutter/material.dart';
class LinearShaderMask extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Wrap(
      spacing: 20,
      crossAxisAlignment: WrapCrossAlignment.center,
      children: <Widget>[
        ShaderMask(
          shaderCallback: _buildShader,
          child: Image.asset(
            'assets/images/icon_head.png',
            height: 70,
            width: 70,
          ),
        ),
        ShaderMask(
          shaderCallback: _buildShader,
          child: Text(
            '张风捷特烈',
            style: TextStyle(fontSize: 40, color: Colors.white),
          ),
        ),
        ShaderMask(
          shaderCallback: _buildShader,
          child: Container(
            height: 100,
            color: Colors.white,
            width: 50,
          ),
        ),
      ],
    );
  }

  final colors = [Colors.red, Colors.yellow, Colors.blue];

  Shader _buildShader(Rect bounds) => LinearGradient(
          begin: Alignment.centerLeft,
          end: Alignment.centerRight,
          tileMode: TileMode.mirror,
          colors: colors)
      .createShader(bounds);
}