Flutter Trasparente Contenitore e BoxShadow

Question

Sono bloccato su questo. Sto cercando di imparare Flutter. Mentre stavo facendo il mio progetto personalizzato ho colpito questo muro. So che questo può essere risolto con AppBar, forse. Voglio imparare come disegnare un'ombra personalizzata o almeno alterare BoxShadow.

Quando provo ad aggiungere un'ombra di casella alla mia riga che è avvolta con il contenitore ottengo questo risultato;

ombra

Il codice ha questo aspetto;

class HeaderContents extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
          color: Theme.of(context).primaryColor,
          boxShadow: [BoxShadow(offset: Offset(0, 2), blurRadius: 5)]),
      height: MediaQuery.of(context).size.height * 0.1,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [

Come puoi immaginare, sto solo cercando di ottenere il risultato di elevazione fino al fondo. Grazie a tutti.

Answer 1

Aggiungi il SpreaRadiuse aumenta il OffsetY. Modificare tutto il valore per ottenere la necessità desiderata.

      BoxDecoration(
          color: Colors.white,
          boxShadow: [
            BoxShadow(
              color: Colors.blue.withOpacity(0.1),
              spreadRadius: 5,
              blurRadius: 20,
              offset: Offset(
                  0, 10), // changes position of shadow
            ),
          ],
        ),

Answer 2

Sembra che sia solo il mio ritardo nell'assegnazione del colore. Sul file principale ho assegnato colori scuri e luminosi per testare la funzionalità della modalità luce / buio.

Cambiando questo colore: Theme.of (context) .primaryColor

a questo colore: Theme.of (context) .primaryColorDark

risolto il problema.