Flutter Container BoxShadow不显示

时间:2019-05-02 15:09:37

标签: android ios dart flutter flutter-layout

这是此刻的代码:

ClipRRect(
  borderRadius: BorderRadius.circular(11),
  child: Container(
    decoration: BoxDecoration(
      gradient: LinearGradient(
        begin: FractionalOffset.bottomLeft,
        end: FractionalOffset.topRight,
        colors: <Color>[Colors.purple, AppBaseColors.orange],
      ),
      boxShadow: [BoxShadow(color: Colors.yellow)]
    ),
    child: Material(
      child: InkWell(
        onTap: () {
          print("tapped");
        },
        child: Container(
          width: ButtonTheme.of(context).minWidth,
          height: ButtonTheme.of(context).height,
          child: Center(
            child: Text(
              "log in",
              style: TextStyle(
                  color: Colors.white, fontWeight: FontWeight.bold),
            ),
          ),
        ),
      ),
      color: Colors.transparent,
    ),
  ),
),

我尝试过的事情:

  • 在第一个容器
  • 中添加 boxShadow
  • 在第二个容器
  • 中添加 boxShadow
  • 使用 boxShadow 作为 ClipRRect
  • 的父级添加另一个容器
  • 材料中将 boxShadow 添加为shadowColor(由于我没有任何阴影,ofc无法正常工作)
  • 在上述所有情况下,还添加了 spreadRadius blurRadius ,但没有任何变化。

知道我做错了什么吗?

2 个答案:

答案 0 :(得分:1)

您需要进行以下更改:

  • 删除ClipRRect小部件。
  • borderRadius内添加BoxDecoration
  • 向您的Offset添加BoxShadow

    Container(
              decoration: BoxDecoration(
                  color: Colors.blue,
                  gradient: LinearGradient(
                    begin: FractionalOffset.bottomLeft,
                    end: FractionalOffset.topRight,
                    colors: <Color>[Colors.purple, Colors.orange],
                  ),
                  borderRadius: BorderRadius.circular(11),
                  boxShadow: [
                    BoxShadow(color: Colors.yellow, offset: Offset(5.0, 5.0))
                  ]),
              child: Material(
                borderRadius: BorderRadius.circular(11),
                clipBehavior: Clip.hardEdge,
                child: InkWell(
                  onTap: () {
                    print("tapped");
                  },
                  child: Container(
                    width: ButtonTheme.of(context).minWidth,
                    height: ButtonTheme.of(context).height,
                    child: Center(
                      child: Text(
                        "log in",
                        style: TextStyle(
                            color: Colors.white, fontWeight: FontWeight.bold),
                      ),
                    ),
                  ),
                ),
                color: Colors.transparent,
              ),
            ),
    

答案 1 :(得分:0)

我通过移除clipBehavior或将其设置为Clip.none来修复了我的问题。