如何在 Flutter 中向 TextFormField 添加阴影 [英] How to add drop shadow to TextFormField In Flutter

查看:30
本文介绍了如何在 Flutter 中向 TextFormField 添加阴影的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个颤动的文本表单字段,我想给它添加一个阴影.我该怎么做?

I have a text form field in flutter I want to add a drop shadow to it. how should I do that?

 final password = TextFormField(
    obscureText: true,
    autofocus: false,
    decoration: InputDecoration(
        icon: new Icon(Icons.lock, color: Color(0xff224597)),
        hintText: 'Password',
        fillColor: Colors.white,
        filled: true,
        contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
        enabledBorder: OutlineInputBorder(borderRadius:BorderRadius.circular(5.0),
        borderSide: BorderSide(color: Colors.white, width: 3.0))
     ),
   );

推荐答案

您可以使用 Material 小部件包装您的 TextFormField 并编辑其属性,例如 elevationshadowColor.

You can Wrap your TextFormField with a Material widget and edit its properties such as elevation and shadowColor.

例子:

Material(
              elevation: 20.0,
              shadowColor: Colors.blue,
                          child: TextFormField(
                obscureText: true,
                autofocus: false,
                decoration: InputDecoration(
                    icon: new Icon(Icons.lock, color: Color(0xff224597)),
                    hintText: 'Password',
                    fillColor: Colors.white,
                    filled: true,
                    contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
                    enabledBorder: OutlineInputBorder(borderRadius:BorderRadius.circular(5.0),
                    borderSide: BorderSide(color: Colors.white, width: 3.0))
                ),
              ),
            )  

您将获得类似于下图的内容.

You will Get something similar to the image below.

这篇关于如何在 Flutter 中向 TextFormField 添加阴影的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆