呈现像素流错误即将出现。但是我的应用程序工作得很好

Question

在我的聊天应用程序中，我使用了一个与whatsapp类似的键盘，其中包括了选择表情符号的选项。我在TextFormField的左边做了一个图标，在点击这个图标之后，我使用emoji_picker来选择那个表情符号。现在，使用FocusNode和TextEditingController，我设法使我的键盘与WhatsApp中的键盘一样工作(也就是说，每当你点击图标时，你可以从空格中选择表情符号，当你在TextFormField,内点击键盘时，键盘就会代替它)。现在的问题是，它向我展示了一个例外，23个像素被溢出。但是黄/黑条纹线只出现一秒钟，然后消失，应用程序运行良好。

请注意，只有当我点击TextFormField后点击图标(我在本文第1行中提到的表情符号图标)时，异常/溢出才会出现。这意味着当我首先点击TextFormField**，，然后点击图标来选择，就会显示这个异常，除了这里，没有显示错误**。然后它消失了，一切都很好。

请帮帮我，我被困住了，不能指出问题的根源。

1. 选择textfield区域。

​

(2)像素流的极小实例(我必须记录屏幕才能从视频中获取ss )。

​

​

3)过了一会儿。

​

​

异常/错误是-

The following assertion was thrown during layout:
A RenderFlex overflowed by 23 pixels on the bottom.

The relevant error-causing widget was: 
  Column file:///C:/Users/Hp/AndroidStudioProjects/flutter_whatsapp/lib/Screens/individual_page.dart:137:24
The overflowing RenderFlex has an orientation of Axis.vertical.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.

Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.

The specific RenderFlex in question is: RenderFlex#4985a relayoutBoundary=up2 OVERFLOWING
...  needs compositing
...  parentData: offset=Offset(0.0, 0.0) (can use size)
...  constraints: BoxConstraints(0.0<=w<=411.4, 0.0<=h<=321.4)
...  size: Size(411.4, 321.4)
...  direction: vertical
...  mainAxisAlignment: end
...  mainAxisSize: max
...  crossAxisAlignment: center
...  verticalDirection: down
◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
====================================================================================================

这是密码-

import 'package:emoji_picker/emoji_picker.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_whatsapp/model/chat_model.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'dart:math' as math;

class IndividualPage extends StatefulWidget {
  final ChatModel chatModel;
  IndividualPage({Key key, this.chatModel}) : super(key: key);

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

class _IndividualPageState extends State<IndividualPage> {

  bool show=false;
  FocusNode focusNode=FocusNode();
  TextEditingController _controller = TextEditingController();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    focusNode.addListener(() {
      if(focusNode.hasFocus) {
        setState(() {
          show=false;
        });
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey[350],
      appBar: AppBar(
        titleSpacing: MediaQuery.of(context).size.width * 0.01,
        leadingWidth: MediaQuery.of(context).size.height * 0.1,
        leading: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            InkWell(
              onTap: () {
                Navigator.pop(context);
              },
              child: Icon(
                Icons.arrow_back,
                color: Colors.white,
              ),
            ),
            CircleAvatar(
              child: SvgPicture.asset(
                widget.chatModel.isGroup
                    ? "assets/groups.svg"
                    : "assets/person.svg",
                color: Colors.white,
                height: 35.0,
              ),
              radius: MediaQuery.of(context).size.width*0.04,   
              backgroundColor: Colors.grey[400],
            ),
          ],
        ),
        title: InkWell(
          onTap: () {},
          child: Container(
            margin: EdgeInsets.all(3.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(widget.chatModel.name),
                Text(
                  'last seen today at 16:03',
                  style: TextStyle(
                    fontWeight: FontWeight.w400,
                    fontSize: MediaQuery.of(context).size.width * 0.03,
                  ),
                ),
              ],
            ),
          ),
        ),
        actions: [
          Icon(
            Icons.videocam,
          ),
          SizedBox(
            width: MediaQuery.of(context).size.width * 0.05,
          ),
          Icon(
            Icons.call,
          ),
          PopupMenuButton<String>(onSelected: (value) {
            print(value);
          }, itemBuilder: (BuildContext context) {
            return [
              PopupMenuItem(
                child: Text("View Contact"),
                value: "View Contact",
              ),
              PopupMenuItem(
                child: Text("Media, link, and docs"),
                value: "Media, link, and doc",
              ),
              PopupMenuItem(
                child: Text("Search"),
                value: "Search",
              ),
              PopupMenuItem(
                child: Text("Mute Notifications"),
                value: "Mute Notifications",
              ),
              PopupMenuItem(
                child: Text("Wallpaper"),
                value: "Settings",
              ),
              PopupMenuItem(
                child: Text("More"),
                value: "Settings",
              ),
            ];
          }),
        ],
      ),
      body: Container(
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width,
        child: WillPopScope(
          child: Stack(
            children: [
              ListView(),
              Align(
                alignment: Alignment.bottomCenter,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.end,
                  children: [
                    Row(
                      children: [
                        Container(
                            width: MediaQuery.of(context).size.width * 0.88,
                            child: Card(
                              margin: EdgeInsets.only(left: MediaQuery.of(context).size.width*0.0175, right: MediaQuery.of(context).size.width*0.017, bottom:  MediaQuery.of(context).size.width*0.013),
                                shape: RoundedRectangleBorder(
                                  borderRadius: BorderRadius.circular(23.0),
                                ),
                                child: TextFormField(
                                  controller: _controller,
                                  focusNode: focusNode,
                                  cursorHeight: MediaQuery.of(context).size.width*0.055,
                                  textAlignVertical: TextAlignVertical.center,
                                  keyboardType: TextInputType.multiline,
                                  maxLines: 25,
                                  minLines: 1,
                                  decoration: InputDecoration(
                                    border: InputBorder.none,
                                    hintText: "Type a message",
                                    contentPadding: EdgeInsets.only(bottom: 5.0, right: 10.0, top: 5.0),
                                    prefixIcon: Padding(
                                      padding: const EdgeInsets.only(left: 8.0),
                                      child: IconButton(
                                        icon: Icon(Icons.emoji_emotions_outlined),
                                        onPressed: () {
                                          focusNode.unfocus();
                                          focusNode.canRequestFocus=false;
                                          setState(() {
                                            show=!show;
                                          });
                                        },
                                      ),
                                    ),
                                    suffixIcon: Row(
                                      mainAxisSize: MainAxisSize.min,
                                      children: [
                                        Transform.rotate(
                                          angle: 320 * math.pi/180,
                                          child: IconButton(
                                              icon: Icon(Icons.attach_file),
                                            onPressed: (){},
                                          ),
                                        ),
                                        IconButton(
                                          icon: Icon(Icons.camera_alt),
                                          onPressed: (){},
                                        ),
                                      ],
                                    ),
                                  ),
                                ))),
                        Padding(
                          child: CircleAvatar(
                            backgroundColor: Color(0xFF128C7E),
                            radius: MediaQuery.of(context).size.width*0.058,
                            child: Icon(
                              Icons.mic,
                              color: Colors.white,
                            ),
                          ),
                          padding: EdgeInsets.only(bottom: 5.0, right: 1.0),
                        ),
                      ],
                    ),
                    show ? EmojiSelect() : Container(),
                  ],
                ),
              )
            ],
          ),
          onWillPop: () {
            if(show) {
              setState(() {
                show=false;
              });
            }
            else {
              Navigator.pop(context);
            }
            return Future.value(false);
          },
        ),
      ),
    );
  }
  Widget EmojiSelect() {
    return EmojiPicker(
      columns: 7,
      rows: 4,
      onEmojiSelected: (emoji, category) {
        print(emoji);
        setState(() {
          _controller.text = _controller.text+emoji.emoji;
        });
      },
    );
  }
}

Answer 1

我建议您将Scaffold的主体变成一个可滚动的小部件，如ListView或SingleChildScrollView。