CODEWITHSUNDEEP
flutterflutter-layout
Yossi Neiman
Yossi Neiman

Reputation: 825

How to achieve an arch appBar

I'm trying to implement this kind of AppBar in Flutter, any advice on how to achieve that?

enter image description here

Upvotes: 0

Views: 451

Answers (1)

CopsOnRoad
CopsOnRoad

Reputation: 267554

You can try this

enter image description here

@override
Widget build(BuildContext context) {
  return Scaffold(
    body: Material(
      elevation: 12,
      borderRadius: BorderRadius.only(bottomRight: Radius.elliptical(500, 70), bottomLeft: Radius.elliptical(500, 70)),
      color: Colors.transparent,
      child: Container(
        width: double.infinity,
        height: 100,
        padding: EdgeInsets.only(bottom: 12),
        alignment: Alignment.bottomCenter,
        child: Text("dride", style: TextStyle(fontSize: 18, fontWeight: FontWeight.w500, color: Colors.white)),
        decoration: BoxDecoration(color: Colors.grey[800], borderRadius: BorderRadius.only(bottomRight: Radius.elliptical(500, 70), bottomLeft: Radius.elliptical(500, 70))),
      ),
    ),
  );
}

Upvotes: 1

Related Questions