How to design this type of dashboard in Flutter?

This should be useful

class SO extends StatefulWidget {
  @override
  _SOState createState() => _SOState();
}

class _SOState extends State<SO> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Foodie"),
      ),
      body: ListView.builder(
        itemCount: foods.length,
        itemBuilder: (BuildContext context, int index) {
          var food = foods[index];
          return ListTile(
            title: Text(food.name),
            subtitle: Text(food.detail),
            leading: FlutterLogo(),
            trailing: IconButton(
              icon: Icon(food.isFav ? Icons.favorite : Icons.favorite_border),
              onPressed: () => {
                setState(
                  () {
                    food.isFav = !food.isFav;
                  },
                )
              },
            ),
          );
        },
      ),
    );
  }
}

List<Food> foods = [
  Food('food 0', 'about food 0'),
  Food('food 1', 'about food 1'),
  Food('food 2', 'about food 2'),
  Food('food 3', 'about food 3'),
  Food('food 4', 'about food 4'),
  Food('food 5', 'about food 5'),
  Food('food 6', 'about food 6'),
];

class Food {
  final String name;
  final String detail;
  bool isFav;

  Food(this.name, this.detail, {this.isFav = false});
}

EDIT:

for the dashboard background

class SO extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[dashBg, content],
      ),
    );
  }

  get dashBg => Column(
        children: <Widget>[
          Expanded(child: Container(color: Colors.deepPurple),flex: 2,),
          Expanded(child: Container(color: Colors.transparent),flex: 5,),
        ],
      );

  get content => Container(
    margin: EdgeInsets.all(32),
    color: Colors.red,
    child: Center(child: Text('create your content inside this')),
  );
}

extending this here with code

class SO extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: <Widget>[dashBg, content],
      ),
    );
  }

  get dashBg => Column(
        children: <Widget>[
          Expanded(
            child: Container(color: Colors.deepPurple),
            flex: 2,
          ),
          Expanded(
            child: Container(color: Colors.transparent),
            flex: 5,
          ),
        ],
      );

  get content => Container(
        child: Column(
          children: <Widget>[
            header,
            grid,
          ],
        ),
      );

  get header => ListTile(
    contentPadding: EdgeInsets.only(left: 20, right: 20, top: 20),
    title: Text(
      'Dashboard',
      style: TextStyle(color: Colors.white),
    ),
    subtitle: Text(
      '10 items',
      style: TextStyle(color: Colors.blue),
    ),
    trailing: CircleAvatar(),
  );

  get grid => Expanded(
        child: Container(
          padding: EdgeInsets.only(left: 16, right: 16, bottom: 16),
          child: GridView.count(
            crossAxisSpacing: 16,
            mainAxisSpacing: 16,
            crossAxisCount: 2,
            childAspectRatio: .90,
            children: List.generate(8, (_) {
              return Card(
                elevation: 2,
                shape: RoundedRectangleBorder(
                  borderRadius: BorderRadius.circular(8)
                ),
                child: Center(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[FlutterLogo(), Text('data')],
                  ),
                ),
              );
            }),
          ),
        ),
      );
}

gives