简体   繁体   中英

How to remove padding from the left side of list of navigation links? SwiftUI

I am developing an app in where there is a list of navigation links which are images. I want the image to be the full width of the screen but there is padding from the left. I have tried several things:

 .frame( maxWidth: .infinity)
 .ignoresSafeArea()
 .listStyle(PlainListStyle())
NavigationView {
            
            VStack {
                
                Text("Available guides in: ").padding(.bottom, -1000).padding(.top,100).font(.custom("SF Mono-Light", size: 28)).edgesIgnoringSafeArea(.all)//.foregroundColor(Color.white)
                
                Text("Somewhere").padding(.bottom, -90).padding(.top,-70).font(.custom("SF Mono-Light", size: 32))//.foregroundColor(Color.white)//.edgesIgnoringSafeArea(.all)
                
                List {
                    ForEach(guides) { guide in
                        NavigationLink(destination: GuideView(guideSessionManager: GuideSessionManager(guide: guide)), tag : guide.guideName, selection: $selection) {
                            Button(action: {
                                selection = guide.guideName
                            }) {
                                Image(guide.imageName)
                                .renderingMode(Image.TemplateRenderingMode?.init(Image.TemplateRenderingMode.original))
                            }.buttonStyle(GrowingButtonImage())
                            .frame( maxWidth: .infinity)
                            .ignoresSafeArea()
                            
                        }
                        .frame( maxWidth: .infinity)
                        .listRowInsets(EdgeInsets())
                        .ignoresSafeArea()
                        
                    }
                }
                .frame( maxWidth: .infinity)
                .ignoresSafeArea()
                .listStyle(PlainListStyle())

在此处输入图像描述

 .frame( maxWidth: .infinity)
 .ignoresSafeArea()
 .listStyle(PlainListStyle())

You're giving it EdgeInsets without parameters and setting the width to.infinity with .ignoresSafeArea , which causes a weird interaction. Either remove .ignoresSafeArea , use parameters on EdgeInsets or don't use .infinity

                List {
                    ForEach(guides) { guide in
                        NavigationLink(destination: GuideView(guideSessionManager: GuideSessionManager(guide: guide)), tag : guide.guideName, selection: $selection) {
                            Button(action: {
                                selection = guide.guideName
                            }) {
                                Image(guide.imageName)
                                .renderingMode(Image.TemplateRenderingMode?.init(Image.TemplateRenderingMode.original))
                            }
                            .buttonStyle(GrowingButtonImage())
                            .frame( maxWidth: .infinity)
                            .edgesIgnoringSafeArea(.all)
                            
                        }
                        // Modify these to your liking
                        .listRowInsets(EdgeInsets(top: 0.0, leading: 0.0, bottom: 0.0, trailing: 0.0))                        
                    }

You can also try using .scaledToFill()

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