1

I want to make a navigation view with a search button like this:

enter image description here

I use listRowInsets(EdgeInsets()) to remove leading and trailing padding of the image.

Everything is fine before I add the search button:

import SwiftUI

struct demoUI: View {
    var body: some View {
        NavigationView {
            List {
                Image("food")
                    .scaledToFill()
                    .frame(height: 200)
                    .clipped()
                    .listRowInsets(EdgeInsets())
                
                ForEach(0 ..< 5) {_ in
                    Text("List Item ")
                }
                
            }
            .navigationTitle(Text("Featured"))
        }
    }
}

struct demoUI_Previews: PreviewProvider {
    static var previews: some View {
        demoUI()
    }
}

enter image description here

But when I add the icon to the navigation bar, padding shows again:

struct demoUI: View {
    var body: some View {
        NavigationView {
            List {
                Image("food")
                    .scaledToFill()
                    .frame(height: 200)
                    .clipped()
                    .listRowInsets(EdgeInsets())
                
                ForEach(0 ..< 5) {_ in
                    Text("List Item ")
                }
                
            }
            .navigationTitle(Text("Featured"))
            .navigationBarItems(trailing: Image(systemName: "magnifyingglass.circle").imageScale(.large))
        }
    }
}

enter image description here

My Xcode version is 12.1 (12A7403). Is this a bug, or the expected result?

GoGoCav
  • 25
  • 5

1 Answers1

2

Use list style explicitly

        List {
            Image("food")
                .scaledToFill()
                .frame(height: 200)
                .clipped()
                .listRowInsets(EdgeInsets())
            
            ForEach(0 ..< 5) {_ in
                Text("List Item ")
            }
            
        }.listStyle(PlainListStyle())   // << here !!
Asperi
  • 228,894
  • 20
  • 464
  • 690