Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Flutter: how to Align to bottom of Stack in Listview.builder

I am trying to use a Stack() Widget within a Listview to display Widgets over an Image in each iteration of the Listview however I am running into an issue. Whenever I use Align() for any widgets they stay at the top and do not Align to the Bottom of the Container()

Each image is a different size so I can not define a definite size to apply to all.

The code below aligns alignedWidget() to the topLeft even though I coded it to Align to bottomLeft

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

     Padding(
        padding: const EdgeInsets.symmetric(horizontal: 40.0),
        child: ListView.builder(
            itemCount: widget.posts.length,
            itemBuilder: (context, index) {
            return listViewCard(images[index])
         }
       ),
     )


  Widget listViewCard(image) {
      return Padding(
        padding: const EdgeInsets.symmetric(vertical: 20.0),
              child: Stack(
                children: [
                      Container(
                        decoration: BoxDecoration(
                          borderRadius: BorderRadius.all(Radius.circular(20.0)),
                        ),
                        child: ClipRRect(
                          borderRadius: BorderRadius.circular(18.0),
                          child: Image(image: NetworkImage(image), fit: BoxFit.fitWidth,  )
                        ),
                      ),
                      child: Align(
                      alignment: Alignment.bottomLeft,
                      child: Padding(
                        padding: const EdgeInsets.only(left: 8.0),
                        child: Row(
                          children: [
                            alignedWidget(),
                          ],
                        ),
                      )
                  ),
                ],
              ),
      );
  }
  }

>Solution :

I’m not sure what exactly you’re trying to accomplish. But to position widgets within a Stack, you can use a Positioned widget:

Stack(children: [
  Positioned(bottom: 0.0, left: 0.0, child: ...)
])
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading