简体   繁体   中英

Flutter Stack Widget inside ListView widget?

I am using the Stack widget in my app and it is working great but now I have a problem with wrapping this Stack widget inside ListView Widget.

I am getting error

RenderBox was not laid out: RenderPointerListener#20d10 relayoutBoundary=up7 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1979 pos 12: 'hasSize'

My Stack Widget is

Widget? stackW() {
    return Stack(
      alignment: Alignment.center,
      children: <Widget>[
        Positioned(
          top: 70,
          width: MediaQuery.of(context).size.width * .9,
          height: 150,
          child: Center(
            child: Container(
              width: MediaQuery.of(context).size.width * .9,
              decoration: BoxDecoration(
                  color: Colors.grey[200],
                  borderRadius: BorderRadius.circular(15)),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  const Text(
                    "Product Designer",
                    style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
                  ),
                  const SizedBox(
                    height: 10,
                  ),
                 
                ],
              ),
            ),
          ),
        ),
        Positioned(
          top: 30,
          left: MediaQuery.of(context).size.width / 2.5,
          width: 80,
          height: 80,
          child: CircleAvatar(
            backgroundColor: Colors.white,
            child: CircleAvatar(
              backgroundColor: Colors.green[100],
              radius: 35,
              child: const FaIcon(
                FontAwesomeIcons.apple,
                size: 30,
                color: Colors.black,
              ),
            ),
          ),
        ),
      ],
    );
  }

When I am passing stackWidget directly in body then it is working fine but after wrapping inside ListView, it is creating problem.

so Please guide me to achieve my listview data with Stack Widget.

 body: stackW()!,  //working
body: ListView(
        scrollDirection: Axis.vertical,
        children: [
          stackW()!,
        ],
      ),
``` //not working

Both widgets are getting infinite height, you can wrap stackW() with SizedBox widget.

body: LayoutBuilder(
  builder: (context, constraints) => ListView(
    scrollDirection: Axis.vertical,
    children: [
      SizedBox(
        height: constraints.maxHeight,
        width: constraints.maxWidth,
        child: stackW()!,
      )
    ],
  ),
),

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