развевается только нижняя тень к контейнеру - PullRequest
Новая
       23

развевается только нижняя тень к контейнеру

0 голосов
/ 01 августа 2020

Я пробовал много решений, но не смог получить то, что хочу.

{ ссылка } Я применил этот ответ, но не смог получить правильный ответ. У контейнера все еще есть тень. Как я могу этого добиться?

, а также я попытался окружить свой виджет Material. но все еще не могу решить проблему. 

 Material(
        elevation: 5,
        child: Container(
          height: 50,
          child: _buildEloAndLevel(),

        ),
      ),

Ответы [ 2 ]

1 голос
/ 01 августа 2020

Все, что вам нужно сделать, это поиграть со значением смещения. И я думаю, вам не нужно оборачивать его Material.

Offset - это смещение тени из коробки. Для этого требуются 2 значения двойного типа, Offset(x, y);

Пример: 

Container(
          height: 50.0,
          decoration: BoxDecoration(
              boxShadow: <BoxShadow>[
                BoxShadow(
                  color: Colors.black54,
                  offset: Offset(15.0, 20.0),
                  blurRadius: 20.0,
                )
              ],
            color: Colors.red,
          ),
        ),

СОВЕТЫ ОТ МЕНЯ: Чтобы тень не отображалась в в верхней части контейнера, убедитесь, что ваш радиус размытия не больше , чем значение Y смещения.

1 голос
/ 01 августа 2020 
Material(
  elevation: 5,
  child: Container(
    height: 50,
    child: _buildEloAndLevel(),

    // add boxShadow
    decoration: BoxDecoration(
      boxShadow: [
        color: Colors.black54,
        blurRadius: 15.0,
      ],
    ),
  ),
),

Это создаст shadow из 15 units вокруг Container. Теперь тень можно перемещать с помощью свойства offset. Поскольку нам не нужна тень сверху, мы можем переместить ее вниз на 15 units. 

Material(
  elevation: 5,
  child: Container(
    height: 50,
    child: _buildEloAndLevel(),

    // add boxShadow
    decoration: BoxDecoration(
      boxShadow: [
        color: Colors.black54,
        blurRadius: 15.0,
        offset: Offset(0, 15), // horizontally move 0, vertically move 15,
      ],
    ),
  ),
),
...