Button inside CarouselStack content

[dorjeozer]

I noticed that when you add a VStack or HStack containing a Button to the CarouselStack content view, the CarouselStack stops rendering left and right content. Is there a way to fix this kind of behavior or is it simply a bug in the library or in SwiftUI?

The following code can reproduce the output:

let fruits: [String] = ["Apple", "Pear", `"Orange"]
CarouselStack(
    fruits,
    initialIndex: 0
) { fruit in
    HStack {
        Button(fruit, action: {})
    }
        .frame(maxWidth: .infinity)
        .background(Color.yellow)
        .cornerRadius(16)
}
.carouselStyle(.infiniteScroll)

[dscyrescotti]

@dorjeozer Thanks for your report on the bug. Let me take a look at what went wrong with CarouselStack and find a solution for workaround. Afterwards, I will get back to you.

[dorjeozer]

@dscyrescotti Thanks Scotti! I also found out after some debugging that setting .buttonStyle(.plain) makes the problem disappear in this scenario. Though it might be quite painful to go through all of the buttons like this if there're multiple buttons in the content view.

EDIT: Apparently LazyHGrid causes problems too.

[dscyrescotti]

@dorjeozer After debugging, I found that CarouselStack fails to detect the actual size of its child views with Button wrapping any kind of Stack views because the reduce(value:) method of SizePreferenceKey overrides the actual view size with zero if the view contains Button inside Stacks resulting in a malfunction of rendering its child views.

Lucky enough, it can be fixed using an empty reduce(value:) method not to update preference key. So I will create an issue and provide a new release by this weekend (I hope so 😄) regarding this issue.

Thanks again for your finding! Have a great day.

[dorjeozer]

Thanks a lot Scotti! I'll treat you a dinner if I'm ever at the neighborhood 🍽️

[dscyrescotti]

@dorjeozer It's my pleasure to contribute and help the community... and I'll take a note about your dinner 🤣. Have a great weekend 🍻.