App Bar (SHAPED) in Flutter

on

 App Bar in Flutter 


User Interface

Code


class Shapped_App_bar extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(
        preferredSize: Size.fromHeight(400),
        child: AppBar(
          title: Text('App Bar'),
          backgroundColor: Colors.green,
          centerTitle: true,
          leading: Icon(Icons.arrow_back),
          actions: [Icon(Icons.search)],
          shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.only(
            bottomLeft: Radius.circular(2000),
          )),
          flexibleSpace: ClipRRect(
            borderRadius: BorderRadius.only(
              bottomLeft: Radius.circular(2000),
            ),
            child: Container(
              decoration: BoxDecoration(
                  image: DecorationImage(
                      image: AssetImage('assets/dubai.jpg'),
                      fit: BoxFit.cover)),
            ),
          ),
          bottom: PreferredSize(
            preferredSize: Size.fromHeight(400),
            child: Column(
              children: [
                Padding(
                  padding: const EdgeInsets.only(left: 40.0),
                  child: Row(
                    mainAxisAlignment: MainAxisAlignment.start,
                    children: [
                      Text(
                        'Dubai',
                        style: TextStyle(
                            color: Colors.white,
                            fontSize: 20,
                            fontWeight: FontWeight.bold),
                      ),
                    ],
                  ),
                ),
                SizedBox(
                  height: 300,
                )
              ],
            ),
          ),
        ),
      ),
    );
  }
}

Video Link

Contact Me
Facebook Profile: Asim Irshad Facebook
LinkedIn Profile: Asim Irshad Linked In
GitHub Link:https://github.com/AsimIrshad
Youtube Channel Link: Learn Flutter Now





Comments

Post a Comment