flutter 从顶部中心到底部中心抖动线性渐变文本

az31mfrm 于 2023-01-02 发布在 Flutter

关注(0)|答案(1)|浏览(134)

我想显示文本渐变从顶部中心到底部中心，我使用下面的代码，但我不知道为什么颜色显示其他类型的颜色，而我改变线性渐变开始和结束属性。下面的图像是我想显示的输出。

。

Scaffold(
        body: ShaderMask(
          blendMode: BlendMode.srcIn,
          shaderCallback: (rect)=>const LinearGradient(
            colors: [Color(0xff9747FF)

              , Color(0xff3B136F)],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
          )
              .createShader(rect),
          child: Center(
            child: Text('Rahove',style: _textTheme.displayMedium,),
          ),
        ),
      ),

flutter

来源：https://stackoverflow.com/questions/74965625/flutter-linear-gradient-text-from-top-center-to-bottom-center

1条答案

按热度按时间

ffx8fchx1#

使用Rect.fromLTWH指定阴影的高度和宽度

Rect.fromLTWH(0, 0, size.width, size.height + 24),

**注：**额外24高度是为了在线性轴上扩展线性渐变，以便获得所需的输出。

@override
  Widget build(BuildContext context) {
    const Gradient gradient = LinearGradient(
      colors: [Color(0xff9747FF), Color(0xff3B136F)],
      begin: Alignment.topCenter,
      end: Alignment.bottomCenter,
    );
    return Scaffold(
      body: Center(
        child: ShaderMask(
          shaderCallback: (size) => gradient.createShader(
            Rect.fromLTWH(0, 0, size.width, size.height + 24),
          ),
          child: const Text(
            'Tchove',
            style: TextStyle(
              color: Colors.white,
              fontWeight: FontWeight.bold,
              fontSize: 60,
            ),
          ),
        ),
      ),
    );
  }

输出：

赞(0）回复(0）举报 2023-01-02

我来回答

flutter 从顶部中心到底部中心抖动线性渐变文本

1条答案

相关问题

热门标签

最新问答