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

发布时间：2020-12-14 14:58:30 所属栏目：百科来源：网络整理

导读：我在TextStyle中搜索了阴影选项,但我没有找到.所以我问：如何在颤动的文本中添加阴影？可能吗？例： new Text("asd"styel: new TextStyle( //add shadow?)); 解决方法如 issue 3402和 Gary Qian’s answer below所述,Flutter现在提供了一种无需任何解决方

我在TextStyle中搜索了阴影选项,但我没有找到.所以我问：如何在颤动的文本中添加阴影？可能吗？
例：

new Text(
"asd"
styel: new TextStyle( 
//add shadow?
));

解决方法

如 issue 3402和 Gary Qian’s answer below所述,Flutter现在提供了一种无需任何解决方法的方法.

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

screenshot

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,);
  }
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!