SwiftUI Popover Size is not expanding to fit content

Question

Here is my code

struct ContentView: View {
    
    @State var showingPopover = false
    
    var body: some View {
        VStack {
            Spacer()
            Text("Hello World")
            Spacer()
            HStack {
                Spacer()
                Button {
                    self.showingPopover.toggle()
                } label: {
                    Image(systemName: "plus.circle")
                }
                .popover(isPresented: $showingPopover) {
                    
                    List(0..<100) { Text("\($0)") }
                    
                }.padding(30)
            }
        }
    }
}

This should produce a really nice popover coming from the plus button. But all I get is a really squashed down popover.

Any idea what I am missing here? Is there a way to tell the popover to expand more (without specifying a size)?

pawello2222 · Answer 1 · 2020-08-03T18:09:50.437

2

You may use a ScrollView and ForEach instead of a List:

struct ContentView: View {
    @State var showingPopover = false

    var body: some View {
        VStack {
            Spacer()
            Text("Hello World")
            Spacer()
            HStack {
                Spacer()
                Button(action: {
                    self.showingPopover.toggle()
                }) {
                    Image(systemName: "plus.circle")
                }
                .padding(30)
            }
        }
        // can be attached to the button as well (as in the question)
        .popover(isPresented: $showingPopover,
                 attachmentAnchor: .point(.bottomTrailing),
                 arrowEdge: .bottom) {
            ScrollView(.vertical, showsIndicators: false) {
                ForEach(0 ..< 100) {
                    Text("\($0)")
                }
            }
        }
    }
}

edited Aug 03 '20 at 18:09

answered Aug 03 '20 at 18:04

pawello2222

46,897
22
145
209

That does work, unfortunately I need the functionality of `List` to remain. – Serenade X Aug 03 '20 at 18:10
1

@SerenadeX The size of the content in a popover defaults to minimum. And such is the behaviour of the List. If you have a List you need to use a .frame modifier. Is there a specific reason why do you need a List? Maybe it can be replaced? – pawello2222 Aug 03 '20 at 18:26
Nah I would rather just make the frame modifier. – Serenade X Aug 03 '20 at 20:00

score 1 · Answer 2 · answered Aug 03 '20 at 17:53

1

You can provide a custom frame for the List. Also, don't forget to embed List inside a ScrollView if you want it to scroll.

ScrollView {
    List(0..<100) {
        Text("\($0)")
    }
    .frame(width: 100, height: 250)
}

answered Aug 03 '20 at 17:53

Frankenstein

15,732
4
22
47

1

I guess I wanted it to expand to get the content to fit inside without me specifying a size – Serenade X Aug 03 '20 at 17:59
1

If you don't provide a custom frame it would just default to a minimum width/height. Like you're able to see in your code. – Frankenstein Aug 03 '20 at 18:04

SwiftUI Popover Size is not expanding to fit content

2 Answers2