android – 如何在flutter中为文本添加阴影?

android – 如何在flutter中为文本添加阴影?,第1张

概述我在TextStyle中搜索了阴影选项,但我没有找到.所以我问:如何在颤动的文本添加阴影?可能吗? 例: new Text("asd"styel: new TextStyle( //add shadow?)); 如 issue 3402和 Gary Qian’s answer below所述,Flutter现在提供了一种无需任何解决方法的方法. 虽然这可以进入更稳定的通道,但可以使用Ba 我在TextStyle中搜索了阴影选项,但我没有找到.所以我问:如何在颤动的文本中添加阴影?可能吗?
例:

new Text("asd"styel: new TextStyle( //add shadow?));
解决方法 如 issue 3402和 Gary Qian’s answer below所述,Flutter现在提供了一种无需任何解决方法的方法.

虽然这可以进入更稳定的通道,但可以使用BackdropFilter伪造阴影.

import 'dart:ui' as ui;import 'package:Flutter/material.dart';voID main() {  runApp(new MaterialApp(    home: new MyApp(),));}class ShadowText extends StatelessWidget {  ShadowText(this.data,{ this.style }) : assert(data != null);  final String data;  final TextStyle style;  Widget build(BuildContext context) {    return new ClipRect(      child: new Stack(        children: [          new positioned(            top: 2.0,left: 2.0,child: new Text(              data,style: style.copyWith(color: colors.black.withOpacity(0.5)),),new BackdropFilter(            filter: new ui.ImageFilter.blur(sigmaX: 2.0,sigmaY: 2.0),child: new Text(data,style: style),],);  }}class MyApp extends StatelessWidget {  @overrIDe  Widget build(BuildContext context) {    return new Scaffold(      body: new Container(        child: new Center(          child: new ShadowText(            'Hello World!',style: theme.of(context).texttheme.display3,);  }}

或者,如果你不关心模糊,只需制作一个带有一些半透明文本小部件的堆栈,这些小部件堆叠不完全相互叠加.

像这样:

import 'package:Flutter/material.dart';class ShadowText extends StatelessWidget {  final String data;  final TextStyle style;  final TextAlign textAlign;  final TextDirection textDirection;  final bool softWrap;  final TextOverflow overflow;  final double textScaleFactor;  final int maxlines;  const ShadowText(this.data,{    Key key,this.style,this.textAlign,this.textDirection,this.softWrap,this.overflow,this.textScaleFactor,this.maxlines,}) : assert(data != null);  Widget build(BuildContext context) {    return new ClipRect(      child: new Stack(        children: [          new positioned(            top: 2.0,textAlign: textAlign,textDirection: textDirection,softWrap: softWrap,overflow: overflow,textScaleFactor: textScaleFactor,maxlines: maxlines,new Text(            data,style: style,);  }}
总结

以上是内存溢出为你收集整理的android – 如何在flutter中为文本添加阴影?全部内容,希望文章能够帮你解决android – 如何在flutter中为文本添加阴影?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1004071.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-22
下一篇 2022-05-22

发表评论

登录后才能评论

评论列表(0条)

保存