sliverbar_with_card

Card Sliver App Bar

A Flutter package to create a SliverAppBar with a Card.

Inspired by FaoB's Twitter Post design.

Getting started

Wrap your content with CardSliverAppBar and set your desired options:

Basic

MaterialApp(
  home: Material(
    child: CardSliverAppBar(
        height: 300,
        background: Image.asset("assets/logo.png"),
        title: Text("The Walking Dead"),
        body: Container()
    )
  )
)

With options

MaterialApp(
  home: Material(
    child: CardSliverAppBar(
        height: 300,
        background: Image.asset("assets/logo.png", fit: BoxFit.cover),
        title: Text("The Walking Dead",
            style: TextStyle(color: Colors.black, fontSize: 20, fontWeight: FontWeight.bold)
        ),
        titleDescription: Text("Drama, Action, Adventure, Fantasy, \nScience Fiction, Horror, Thriller",
            style: TextStyle(color: Colors.black, fontSize: 11)
        ),
        card: AssetImage("assets/card.jpg"),
        backButton: true,
        backBottonColors: [Colors.white, Colors.black],
        action: IconButton(
          icon: Icon(Icons.favorite),
          iconSize: 30.0,
          color: Colors.red,
          onPressed: (){},
        ),
        body: Container()
    )
  )
)

Options