Как я могу сделать тень с картой, как это?

Question

Это результат, которым я хочу быть

Answer 1

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

1. Виджет использования карты

SizedBox.expand(
          child: Card(
            margin: EdgeInsets.all(10),
            elevation: 3.0,// this field changes the shadow of the card 1.0 is default
            shape: RoundedRectangleBorder(
                side: BorderSide(width: 0.2),
                borderRadius: BorderRadius.circular(20)),
          ),
        )

2. Использование виджета контейнера

 Container(
           margin: EdgeInsets.all(10),
           decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(20),
              border: Border.all(width: 0.2),
              boxShadow: [
                BoxShadow(
                    blurRadius: 2.0,
                    spreadRadius: 0.4,
                    offset: Offset(0.1, 0.5)),
              ],
              color: Colors.white),
              )

изменить BlurRadius и смещение, чтобы изменить тень контейнера

Answer 2

Изготовить пользовательскую карту

///custom cards

  Widget card(String image) {
    return  Container(
        child:  Image.asset(
              image,
              fit: BoxFit.cover,
            ),

        decoration: BoxDecoration(
          border: Border.all(color: Colors.blue, width: 2.0),
          color: Colors.white,
          borderRadius: BorderRadius.all(
            Radius.circular(5.0),
          ),
          boxShadow: <BoxShadow>[
            new BoxShadow(
              color: Colors.blue,
              blurRadius: 3.0,
              offset: new Offset(0.0, 3.0),
            ),
          ],
        ),
        margin: EdgeInsets.all(5.0),
        height: 150.0,
        width: 100.0,

    );
  }

Box Shadow - это то, что вам нужно. Я надеюсь, что это поможет.