My code for a page is like this. i need to scroll part below appbar.

  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: const BoxDecoration(
          gradient: LinearGradient(
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
              colors: [Colors.deepPurple, Colors.black]
          )
      ),
      child: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.transparent,
          leading: IconButton(
              icon: Image.asset("assets/images/logo1.png"),
            iconSize: 100,
            onPressed: null,
              ),
          title: Text("Home"),
          //centerTitle: true
          flexibleSpace: Container(
            decoration: BoxDecoration(
                gradient: LinearGradient(
                    begin: Alignment.topLeft,
                    end: Alignment.bottomRight,
                    colors: [Colors.deepPurple, Colors.white]
                )
            ),
          ),
          //search button for admin pannel
          // actions: <Widget>[
          //   IconButton(
          //     icon: Icon(Icons.search),
          //     onPressed: () {
          //       // your onPressed function here
          //     },
          //   ),
          // ],
        ),

      ),
    );

i want the body area to be scrolled, with that gradient background.

CodePudding user response：

You can wrap body parent widget with SingleChildScrollView for scrolling body...

body: SingleChildScrollView(
      child: Column(
        children: [],
      ),
    ),

CodePudding user response：

Use SingleChildScrollView or Listview. if you are using Listview inside a Column, Try to use Shrinkwrap = true in Listview.