Flutter Scrollable Container-CodePudding

I want to build this specific UI, I don't think that this is an AppBar on the top. I think it is a container, the top part is scrolled with the screen but the container with the text is scrolled. Let me know if anyone can help me achieve this.

CodePudding user response：

Wrap your Container with Singlechildscrollview with it's property scrollDirection. And that's it. Your work is done !

Make scrollable Text inside container in Flutter

CodePudding user response：


class PageName extends StatefulWidget {
  const PageName({Key? key}) : super(key: key);

  @override
  _PageNameState createState() => _PageNameState();
}

class _PageNameState extends State<PageName> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('title'),
        actions: [
          IconButton(icon: Icon(Icons.close), onPressed: () {
            Navigator.pop(context);
          }),
        ],
      ),
      body: ListView(
        children: [
          // your children
        ],
      ),
    );
  }
}

Alternatively, if you have the body as 1 widget, you can use SingleChildScrollView

      body: SingleChildScrollView(
        child: YourBodyWidget(),
      ),