底部溢出 13 个像素的 RenderFlex答案

【问题标题】：A RenderFlex overflowed by 13 pixels on the bottom底部溢出 13 个像素的 RenderFlex
【发布时间】：2021-03-05 19:47:54
【问题描述】：

我知道这类问题很容易解决，但我已经尝试了所有方法，但仍然出现此错误。我有一个图像网格。当我单击其中一个时，它应该会打开一个包含该确切图像及其描述的新页面。

这是网格视图中的一段代码：

itemBuilder: (BuildContext context, int index) {
                    Post post = _posts[index];
                    List<PostView> postViews = [];

                    postViews.add(PostView(
                      currentUserId: 'sKfZaqDFiFWuU2QQlW6ka3KddlD2',
                      post: post,
                      author: _profileUser,
                    ));
                    return GestureDetector(
                      onTap: () => Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => Container(
                            height: MediaQuery.of(context).size.height,
                            color: whiteColor,
                            child: Column(
                              children: postViews,
                            ),
                          ),
                        ),
                      ),
                    );
                  },

这是 Postview 页面代码：

@override
  Widget build(BuildContext context) {
    return Material(
      child: Column(
        children: <Widget>[
          Stack(
            children: <Widget>[
              Container(
                //height: MediaQuery.of(context).size.height * 0.75,

                

                child: ClipRRect(
                  borderRadius: BorderRadius.only(
                    topLeft: Radius.zero,
                    topRight: Radius.zero,
                    bottomLeft: Radius.circular(30.0),
                    bottomRight: Radius.circular(30.0),
                  ),
                  child: Image(
                    image: CachedNetworkImageProvider(widget.post.imageUrl),
                    fit: BoxFit.cover,
                  ),
                ),
              ),
SizedBox(height: 20),
          Padding(
            padding: const EdgeInsets.symmetric(horizontal: 15),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                GestureDetector(
                  onTap: () => Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (_) => ProfileScreen(
                        currentUserId: widget.currentUserId,
                        userId: widget.post.authorId,
                      ),
                    ),
                  ),
                  child: Row(
                    children: [
                      CircleAvatar(
                        radius: 15,
                        backgroundImage: widget.author.profileImageUrl.isEmpty
                            ? AssetImage('assets/images/user.png')
                            : CachedNetworkImageProvider(
                                widget.author.profileImageUrl),
                      ),
                      SizedBox(width: 7),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            widget.author.username,
                            style: TextStyle(
                              color: Colors.black.withOpacity(0.55),
                              fontSize: 16,
                              fontWeight: FontWeight.w600,
                            ),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
                Text(
                  '4 days ago',
                  style: TextStyle(
                    color: Colors.black.withOpacity(0.55),
                    fontWeight: FontWeight.w200,
                  ),
                )
              ],
            ),
          ),
Padding(
            padding: EdgeInsets.symmetric(horizontal: 15),
            child: Column(
              children: [
                Row(
                  children: [
                    Text(
                      'Description',
                      style: TextStyle(
                        color: blackColor,
                        fontSize: 18,
                        fontWeight: FontWeight.w700,
                      ),
                    ),
                  ],
                ),
                SizedBox(height: 5),
                Row(
                  children: [
                    Text(
                      widget.post.caption,
                      style: TextStyle(
                        color: Colors.black.withOpacity(0.4),
                        fontWeight: FontWeight.w600,
                        letterSpacing: 0.2,
                      ),
                    ),
                  ],
                ),
              ],
            ),
          ),

请帮我解决它。如果您需要更多代码，请告诉我。

【问题讨论】：

使用 devtools 及其布局资源管理器，选择溢出的小部件并查看需求是否以某种方式发生冲突。

标签： flutter dart

【解决方案1】：

尝试将 Stack 与 Expanded 小部件包装在 postview 页面中。

【讨论】：

它没有用。堆栈与它有什么关系？

【解决方案2】：

谢谢你们。我能够修复它。

return GestureDetector(
                      onTap: () => Navigator.push(
                        context,
                        MaterialPageRoute(
                          builder: (context) => SingleChildScrollView(
                            child: Container(
                              constraints: BoxConstraints(
                                minHeight: MediaQuery.of(context).size.height,
                                maxHeight: double.infinity,
                              ),
                              color: whiteColor,
                              child: PostView(
                                currentUserId: 'sKfZaqDFiFWuU2QQlW6ka3KddlD2',
                                post: post,
                                author: _profileUser,
                              ),
                            ),
                          ),
                        ),
                      ),
                    );

约束在这种情况下非常有用。

【讨论】：