简体   繁体   中英

how to solve A RenderFlex overflowed problem in flutter

hi i'm new in flutter and try to code my first app, how can i solved RenderFlex error, i want show Put two textFields that fit in separate containers also i have this problem again for my second List. I also intend to display the most recent item in the list, but in practice it remains under the BottomNavigation layer and is not fully displayed. my codes are here, Thanks in advance for your guidance

Widget build(BuildContext context) {
return Scaffold(
  resizeToAvoidBottomPadding: false,
  body: Column(
    children: <Widget>[
      Padding(
        padding:
        const EdgeInsets.only(top: 32, left: 16, right: 16),
        child: Row(
          children: <Widget>[
            Container(
                height: 45,
                decoration: BoxDecoration(
                  boxShadow: [
                    BoxShadow(
                      blurRadius: 10.0,
                      color: Colors.black.withOpacity(.1),
                      offset: Offset(3.0, 3.0),
                    ),
                  ],
                ),
                child: RaisedButton.icon(
                  onPressed: () {},
                  icon: Icon(Icons.arrow_drop_down_circle),
                  label: Text("انتخاب موقعیت"),
                  color: Color(0XffF1F2F3),
                  shape: RoundedRectangleBorder(
                    borderRadius: new BorderRadius.circular(18.0),
                  ),
                )),
            SizedBox(
              width: 20,
            ),
            Container(
              height: 50,
              width: MediaQuery.of(context).size.width / 1.899,
              child: TextField(
                decoration: InputDecoration(
                    contentPadding: const EdgeInsets.only(top: 5),
                    hintText: "جستوجو آگهی ...",
                    prefixIcon: Icon(
                      Icons.search,
                      color: (Colors.grey),
                    ),
                    filled: true,
                    fillColor: Color(0XffF1F2F3),
                    border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(20),
                        borderSide: BorderSide.none)),
              ),
            )
          ],
        ),
      ),
      Container(
        height: 130,
        child: ListView.builder(
            itemCount: 10,
            scrollDirection: Axis.horizontal,
            itemBuilder: (context, index) {
              return Padding(
                padding: const EdgeInsets.all(8),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.center,
                  children: <Widget>[
                    Padding(
                      padding: const EdgeInsets.only(top: 8),
                      child: new Container(
                          width: 70,
                          height: 70,
                          decoration: new BoxDecoration(
                              boxShadow: [
                                BoxShadow(
                                  blurRadius: 8.0,
                                  color: Colors.black38
                                      .withOpacity(.5),
                                  offset: Offset(2.0, 2.0),
                                ),
                              ],
                              border: Border.all(
                                  width: 1,
                                  color: Colors.red,
                                  style: BorderStyle.solid),
                              gradient: LinearGradient(
                                  begin: Alignment.topLeft,
                                  end: Alignment.bottomRight,
                                  colors: [
                                    Colors.yellow,
                                    Colors.amber,
                                    Colors.orangeAccent,
                                    Colors.deepOrange,
                                    Colors.redAccent,
                                    Colors.red
                                  ]),
                              shape: BoxShape.circle,
                              image: new DecorationImage(
                                  image: new NetworkImage(
                                      "https://cdn0.iconfinder.com/data/icons/classic-cars-by-cemagraphics/512/camaro_512.png")))),
                    ),
                    Padding(
                      padding: const EdgeInsets.only(top: 8),
                      child: Text(
                        "خودرو",
                        style: TextStyle(
                            fontSize: 15, color: Colors.black87),
                      ),
                    ),
                  ],
                ),
              );
            }),
      ),
      SingleChildScrollView(
        scrollDirection: Axis.vertical,
        child: Container(
          height: MediaQuery.of(context).size.height,
          width: MediaQuery.of(context).size.width,
          child: ListView.builder(
            itemCount: 10,
            scrollDirection: Axis.vertical,
            itemBuilder: (context, index) {
              return Padding(
                  padding: const EdgeInsets.only(
                      left: 8, right: 8, bottom: 12),
                  child: Container(
                    decoration: BoxDecoration(
                      boxShadow: [
                        BoxShadow(
                          blurRadius: 9.0,
                          color: Colors.black54.withOpacity(.3),
                          offset: Offset(5.0, 5.0),
                        ),
                      ],
                      color: Color(0XffF3F3F4),
                      borderRadius: BorderRadius.circular(10),
                      border: Border.all(
                          width: 1,
                          color: Color(0XffF3F3F4),
                          style: BorderStyle.solid),
                    ),
                    child: Row(
                      children: <Widget>[
                        Container(
                            height: 200,
                            width: MediaQuery.of(context).size.width /
                                2.1,
                            decoration: new BoxDecoration(
                                shape: BoxShape.rectangle,
                                borderRadius: BorderRadius.only(
                                    topRight:
                                    const Radius.circular(10.0),
                                    bottomRight:
                                    const Radius.circular(10.0)),
                                image: new DecorationImage(
                                    fit: BoxFit.fill,
                                    image: new NetworkImage(
                                        "https://s101.divarcdn.com/static/pictures/1576001315/QXv36p38.jpg")))),
                        Column(
                          crossAxisAlignment:
                          CrossAxisAlignment.start,
                          children: <Widget>[
                            Padding(
                              padding: const EdgeInsets.only(
                                  top: 10,
                                  left: 8,
                                  right: 8,
                                  bottom: 60),
                              child: Text(
                                "سمند سفید مشابه صفر",
                                style: TextStyle(
                                    fontSize: 18,
                                    color: Colors.black),
                              ),
                            ),
                            Padding(
                              padding: const EdgeInsets.all(8.0),
                              child: Text(
                                "29000000 تومان",
                                style: TextStyle(
                                    fontSize: 15,
                                    color: Colors.black),
                              ),
                            ),
                            Padding(
                              padding: const EdgeInsets.only(
                                  right: 8,
                                  left: 8,
                                  top: 40,
                                  bottom: 10),
                              child: Row(
                                children: <Widget>[
                                  Text(
                                    "دقایقی پیش در شیراز",
                                    style: TextStyle(
                                        fontSize: 13,
                                        color: Colors.black),
                                  ),
                                  SizedBox(
                                    width: 20,
                                  ),
                                  Text(
                                    "خودرو",
                                    style: TextStyle(
                                        fontSize: 11,
                                        color: Colors.black),
                                  ),
                                ],
                              ),
                            ),
                          ],
                        )
                      ],
                    ),
                  ));
            },
          ),
        ),
      ),
    ],
  ),
);

}

You have wrapped your entire content in Column which is causing the exception. A column widget doesn't scroll and since you've singlechildscrollview which will scroll the content, the Column won't allow it. Hence to resolve the issue, just wrap your entire body content with ListView as below:

return Scaffold(
  resizeToAvoidBottomPadding: false,
  body: ListView(     //  use ListView instead of Column
    children: <Widget>[
      Padding(
        padding:
        const EdgeInsets.only(top: 32, left: 16, right: 16),
        child: Row(
        ...

Result:

在此处输入图片说明

Hope this answers your question.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM