Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add shadow to the text in flutter?

I searched for the shadow option in TextStyle, but I didn't find it. So I ask: how can I add shadow to the text in flutter? Is it possible? Example:

new Text( "asd" style: new TextStyle(  //add shadow? )); 
like image 219
ZeroProcess Avatar asked Jun 01 '17 09:06

ZeroProcess


People also ask

How do you add shadow to text in Flutter?

To enable text shadows, please make sure you are on an up-to-date version of Flutter ( $ flutter upgrade ) and provide a List<Shadow> to TextStyle. shadows : import 'dart:ui'; ... Text( 'Hello, world!

Can you apply a shadow effect to a text box?

Select the picture, AutoShape, WordArt, or text box that you want to change. On the Format tab, click Text Effects or Shape Effects > Shadow. To add a shadow, click the shadow style you want. To remove a shadow, click No Shadow.


1 Answers

Text shadows are now a property of TextStyle as of this commit

To enable text shadows, please make sure you are on an up-to-date version of Flutter ($ flutter upgrade) and provide a List<Shadow> to TextStyle.shadows:

import 'dart:ui';  ...  Text(   'Hello, world!',   style: TextStyle(     shadows: <Shadow>[       Shadow(         offset: Offset(10.0, 10.0),         blurRadius: 3.0,         color: Color.fromARGB(255, 0, 0, 0),       ),       Shadow(         offset: Offset(10.0, 10.0),         blurRadius: 8.0,         color: Color.fromARGB(125, 0, 0, 255),       ),     ],   ), ),  ... 

Keep in mind that shadows will be drawn in the order provided.

like image 175
Gary Qian Avatar answered Sep 28 '22 17:09

Gary Qian