Flutter Widgets 之 ShaderMask

ShaderMask能夠讓咱們將Shader用於任何一個控件上，好比在Text上使用漸變就能夠使用ShaderMask來實現：

ShaderMask(
      shaderCallback: (Rect bounds) {
        return RadialGradient(
          center: Alignment.topLeft,
          radius: 1.0,
          colors: <Color>[Colors.yellow, Colors.deepOrange],
          tileMode: TileMode.mirror,
        ).createShader(bounds);
      },
      blendMode: BlendMode.srcATop,
      child: Text('老孟，一枚有態度的程序員',style: TextStyle(fontSize: 30),),
    )

效果：

shaderCallback 須要返回一個Shader對象，能夠經過漸變相關類直接生成Shader：

RadialGradient(...).createShader(rect)

blendMode屬性是融合方式，child是目標圖像(dst),Shader是源圖像(src)，融合方式介紹：

• 英文官方介紹
• 中文 不錯的翻譯

更多相關閱讀：

• Flutter系列文章總覽
• Flutter Widgets 之 Expanded和Flexible
• Flutter Widgets 之 AnimatedList
• Flutter Widgets 之 SliverAppBar

若是這篇文章有幫助到您，但願您來個「贊」並關注個人公衆號，很是謝謝。