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

How to remove padding on the last element of a list in flutter?

Need help with code. I need to implement a list of buttons. Make a distance of 24 pixels between each button. Below I have attached screenshots of what I have at the moment and what I need to get in the end result. So, in order to set the spacing between elements I use Padding right. But because of this, I also have an indent in the last element on the right. I need to remove it. The second problem with the text, you can see that there is very small text under one element, how can I make the text of a normal size but at the same time so that the distance between the elements does not change, otherwise if I set the normal text size now in that place, I have a distance from for the text will be different?

code

SizedBox(
                  height: 70,
                  child: ListView.builder(
                    scrollDirection: Axis.horizontal,
                    itemCount: connectors.length,
                    itemBuilder: (context, index) => Padding(
                      padding: const EdgeInsets.only(right: 24),
                      child: Column(
                        children: [
                          Container(
                            width: 47,
                            height: 47,
                            decoration: BoxDecoration(
                              color: constants.Colors.white.withOpacity(0.15),
                              borderRadius: BorderRadius.circular(18),
                              border: Border.all(
                                  color: constants.Colors.greyDark, width: 0.5),
                            ),
                            alignment: Alignment.center,
                            child: SvgPicture.asset(
                              connectors.keys.elementAt(index),
                              color: constants.Colors.greyConnector,
                            ),
                          ),
                          const SizedBox(height: 4),
                          SizedBox(
                            width: 47,
                            child: FittedBox(
                              fit: BoxFit.scaleDown,
                              child: Text(
                                connectors.values.elementAt(index),
                                style: constants
                                    .Styles.smallerHeavyTextStyleWhite
                                    .copyWith(
                                        color: Colors.white.withOpacity(0.5)),
                              ),
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                ),

This is what I have now

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

enter image description here

I need this at the end

enter image description here

>Solution :

Try this:

 padding: EdgeInsets.only(right: index == connectors.length - 1 ? 0 : 24),
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