Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Column/SingleChildScrollView not scrolling

I'm learning flutter to make an app. Here I'm trying to make a page to show the full post. The problem is that the page isn't scrolling as a single unit.

class SinglePostPage extends StatefulWidget {
  final Post? post;
  const SinglePostPage({Key? key, this.post}) : super(key: key);

  @override
  State<SinglePostPage> createState() => _SinglePostPageState();
}

class _SinglePostPageState extends State<SinglePostPage> {

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      body: Column(
        mainAxisSize: MainAxisSize.min,
        children: [
          Container(
            margin: const EdgeInsets.only(top: 22.5),
            padding: const EdgeInsets.fromLTRB(0, 5, 0, 6),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    const BackButton(),
                    Row(
                      children: [
                        InkWell(
                          onTap: () {
                            showDialog(...);
                          },
                          child: CircleAvatar(...),
                        Container(
                          padding: const EdgeInsets.only(left: 5.4),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              GestureDetector(
                                onTap: () {
                                  showDialog(...);
                                },
                                child: Text(
                                  widget.post!.author[0].profileName,
                                ),
                              ),
                              const SizedBox(height: 4),
                              Text(
                                showTimeAgo(widget.post!.postTime).toString(),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                    PopupMenuButton(
                      icon: const Icon(Icons.more_vert),
                      itemBuilder: (context) => [...],
                ),
                Container(
                  margin: const EdgeInsets.fromLTRB(12, 9, 12, 3),
    // when the text is longer than the screen height it showed RenderFlex overflowed error so I put constraints. how to show it full and make this scroll
                  constraints: BoxConstraints( 
                      maxHeight: MediaQuery.of(context).size.height * 0.54,
                      minHeight: 50),
                  child: SingleChildScrollView(
                    child: Text(
                      widget.post!.postText,
                      textAlign: TextAlign.start,
                    ),
                  ),
                ),
                Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: [
                    if (widget.post!.postMedia.isNotEmpty)
                      CarouselSlider.builder(...),
                    const SizedBox(height: 4.5),
                    if (widget.post!.postMedia.length > 1)
                      buildDotIndicator(widget.post!.postMedia),
                  ],
                ),
              ],
            ),
          ),
          Container(
            // post reactions row
          ),
          CommentBodyWidget(
            postId: widget.post!.postId,
          ),
        ],
      ),
    );
  }
}

I looked up for other answers and tried wrapping it with SingleChildScrollView, but it didn't work , and ListView with shrinkWrap: true also gave 'Incorrect use of ParentDataWidget' error.

CommentBodyWidget has a listview builder. It's scrolling on its own but the widget above isn't scrolling along with it.

How can I show this whole page and scroll together without having to limit the long post in a constrained container? Please help.

like image 772
rawm Avatar asked Oct 21 '25 17:10

rawm


1 Answers

In order for the SingleChildScrollView to work, its parent's height should be defined. You can achieve this by wrapping the SingleChildScrollView in a Container/SizedBox with defined height, or by wrapping it with the Expanded widget.

like image 129
Ricardo Alexis Huerta Salazar Avatar answered Oct 23 '25 08:10

Ricardo Alexis Huerta Salazar



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!