-
-
Notifications
You must be signed in to change notification settings - Fork 192
Description
On macOS, using SwiftUIPager in vertical mode, each page shows a thin outer margin (background “halo”) even when each page view is sized to the window and .expandPageToEdges() is applied.
Expected behavior
• Each page should fill the available space exactly (full-bleed) with no visible margins around the page content.
• If there are default insets, there should be a public API to set them to zero.
Actual behavior
• A teal color thin border/margin remains visible around pages (seen as the parent background color).
• Button move up at page 2 does't work
Environment
• SwiftUIPager: 2.5.0
• macOS: 15.5
• Xcode: 16.3
• Swift: 6.0
Minimal Reproducible Example
`
import SwiftUIPager
struct HomeView: View {
@State private var name: String = ""
@State private var countdown: Int = 60
@StateObject private var page: Page = .first()
@State private var mouseIsOnCards = false
var body: some View {
GeometryReader { geo in
Pager(page: page,
data: [0, 1],
id: \.self) { pageIndex in
VStack(spacing: 20) {
if pageIndex == 0 {
Text("Countdown: \(countdown)")
.font(.largeTitle)
Button {
withAnimation {
page.update(.next)
}
} label: {
Image(systemName: "arrow.down.circle.fill")
.font(.system(size: 40))
.foregroundColor(.purple)
}
} else if pageIndex == 1 {
TextField("Enter name", text: $name)
.textFieldStyle(RoundedBorderTextFieldStyle())
.padding(.horizontal)
Button("Add") {
}
.font(.title2)
.padding()
.background(Color.red)
.foregroundColor(.white)
.cornerRadius(10)
}
}
.frame(width: geo.size.width, height: geo.size.height)
.background(pageIndex == 0 ? .black : .white)
.overlay(alignment: .bottomTrailing) {
if pageIndex == 1 {
Button {
page.update(.moveToFirst)
} label: {
Image(systemName: "chevron.up.circle")
.font(.system(size: 40))
.background(Color.blue, in: .circle)
}
}
}
}
.pagingPriority(.simultaneous)
.vertical()
.interactive(scale: 1.0)
.swipeInteractionArea(.allAvailable)
.sensitivity(.medium)
.expandPageToEdges()
.background(Color.green)
}
.background(Color.orange)
}
}
`
What I’ve tried
• Ensured each page view is frame(width: geo.size.width, height: geo.size.height).
• .expandPageToEdges(), .itemSpacing(.zero) (also tried without), .padding(.zero).
• Different modifier orders.
• Verified the margin is not from my own .padding (none present on the page container).
Questions
1. Is there a built-in way to remove any default insets/margins so a vertical Pager on macOS can be truly full-bleed?
2. Any recommended modifier order to guarantee no outer padding on macOS?
3. How to config button at page 2 correct to work
Thanks and regards,