Thanks for this component, it looks awesome! I wanted to try it out in my iOS 10+ project but unfortunatly that's not possible due to the iOS 13+ target.

I understand that SwiftUI needs iOS 13+, but I've got a legacy project where I use SwiftUI for some new features that are just disabled for iOS <= 12 users.

Would it be possible to lower the target and add @available(iOS 13, *) (and macOS / watchOS) markers to the code so it can be used in lower target projects as well?

Hello. Great job! But I ran into a problem that the pager does not respond to moving the digital crown on the Apple Watch, as this usually works with ScrollView. Can I somehow enable digital crown support?

Describe the bug When swiping through pages quickly, I notice that sometimes it animates smoothly and other times it seems to not animate and just jump to the next card

Video:

https://user-images.githubusercontent.com/120388/109396137-f8fae180-78e4-11eb-8f80-fe286d3ad2d9.mp4

Environment:

• iOS
• iPhone 12 XS Max
• 2.0.2

Additional context I tried it on the simulator and on the device, with example projects and I'm able to reproduce the issue consistently.

Describe the bug Scroll is inconsistent. At times requires larger swipe to trigger scroll to next page and other times even with a long swipe the scroll is not triggered.

To Reproduce Normal implementation, did try with infinite loop or no loop.

Expected behavior Increased sensitivity to swipe (lower swipe distance) or more consistency.

Screenshots / Videos Don't quite need? This may have been already addressed and just requires the sensitivity modifier?

Environment: iOS 14 and PadOS 14 and iOS 13.0 iPhone XS Max and iPad mini, iPad Pro 12.9" 3rd Gen SwiftUIPager 1.9.0

Additional context Didn't use to occur before. Did read in prior issues that a feature affected it and that v1.9.0 had it fixed, not sure if I need to add a modifier to the Pager or not.

I've seen there was a similar issue (#3) but then it was closed and an entirely different use case with ScrollView was discussed, so I am going to post this.

Basically, if a Pager view is placed inside a ScrollView with vertical scroll, the former blocks the parent's scroll, unless the drag gesture starts outside the Pager's view area.

This is not an issue caused by Pager itself, but there might be solutions that would work if applied to the library. I haven't seen any perfect solutions yet though.

There are some discussions here: https://stackoverflow.com/questions/57700396/adding-a-drag-gesture-in-swiftui-to-a-view-inside-a-scrollview-blocks-the-scroll. The trick with the button (https://stackoverflow.com/a/59961959/1719285) can be applied outside the library, but this then blocks the tap gestures inside each view (in my case, the remove button). The only solution that worked more or less OK (ish) was to have DragGesture(minimumDistance: 30, coordinateSpace: .local) for the swipeGesture of the library.

Describe the bug When using a Pager within subview of a NavigationView and then navigating back using a swipe gesture from the left screen edge, the gesture causes the pager to go to the next page while the swipe gesture is being performed, see video below.

To Reproduce

1. Have a NavigationView that contains a NavigationLink with a destination view that contains a Pager
2. Navigate into the destination view
3. Swipe from the left screen edge (pop gesture) to navigate back

Expected: Navigates back to the previous view, the pager doesn't change. Actual: The pager swipes to the next page while the gesture is being performed. It's doesn't always happen but pretty often, maybe depending on how quick the gesture is performed.

Code to reproduce (drop into the Examples in SwiftUIPagerExample):

import SwiftUI

struct NavigationExampleView: View {
    var body: some View {
        NavigationView {
            NavigationLink(destination: PagerView()) {
                Label("Navigate", systemImage: "folder")
            }
        }
    }
}

struct PagerView: View {
    @StateObject var page: Page = .first()
    // For older versions:
    // @State var page: Int = 0

    @State var items = [
        Item(name: "blue", color: Color.blue),
        Item(name: "red", color: Color.red)
    ]

    var body: some View {
        Pager(page: page,
              data: items,
              content: { item in
                  Text(item.name)
                      .frame(maxWidth: .infinity, maxHeight: .infinity)
                      .background(item.color)
              })
        // Doing this fixes the problem, but disables dragging (duh):
        // .allowsDragging(false)
    }
}

struct Item: Equatable, Identifiable {
    var name: String
    var color: Color

    var id: String {
        name
    }
}

struct NavigationExampleView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationExampleView()
    }
}

Screenshots / Videos

https://user-images.githubusercontent.com/16778/158742041-9943a2d6-adb1-4019-a22d-aa10c06e867b.mp4

Notice how, while performing the edge swipe gesture to navigate back, the pager goes to the next page (from blue to red).

Environment:

• OSX: Xcode 13.3, iOS 15.4
• Device: iPhone 13 Pro
• SwiftUIPager version: 2.3.2 (and earlier versions too)

Additional context Some observations:

• Problem seems to be in onDragChanged in PagerContent. When adding a print for newOffset at the end of the method, I'm getting values like 0.0, 4.0, -386.0. The last one seems strange. I'm not sure how exactly the ongoing gesture for NavigationView affects the pager's gesture coordinates, but somewhere there seems to be the problem.
• When changing the swipeGesture to DragGesture(minimumDistance: minimumDistance, coordinateSpace: .global), it fixes the problem in this particular case, but that would probably have other unintended side effects.

Describe the bug When Running on iOS 13.1 Simulator, the app crashes becaus of the following: dyld: Symbol not found: _$s7SwiftUI18AnimatableModifierPAAE13_makeViewList8modifier6inputs4bodyAA01_fG7OutputsVAA11_GraphValueVyxG_AA01_fG6InputsVAiA01_L0V_ANtctFZ Referenced from: /Users/***/Library/Developer/CoreSimulator/Devices/3BA98118-7FC5-46DA-A006-EEF202D25F2A/data/Containers/Bundle/Application/6A1A3C95-9D7C-43BD-BC81-0011FAD872F6/Spaccio Vino.app/Frameworks/SwiftUIPager.framework/SwiftUIPager Expected in: /System/Library/Frameworks/SwiftUI.framework/SwiftUI

To Reproduce SwiftUIPager 2.0.2 Run on iOS 13.1 Simulator the following: Pager(page: page, data: pageData) { item in NewHomeBanner(text: item.text) }.onPageChanged { page in displayedPage = page }

Expected behavior App not crashing

Environment:

• OSX: iOS 13.1
• Device: Any Simulator
• SwiftUIPager version: 2.0.2

Describe the bug When swiping the page doesn't track 1:1 (seems to lag a bit)

To Reproduce Swipe across pages

Expected behavior Typical paged views on iOS track 1:1 with your finger to make it feel smooth / responsive.

Environment:

• iOS
• iPhone 12

Additional context Didn't see anything in the documentation to configure or adjust this.

Hi, I am using your SwiftUIPager. It is looking great. In pageview, I am adding Image. It is working fine. But when I add MagnificationGesture() on Image, scrolling get stopped. And I am not able to scroll anymore. Can you please help me to sort this problem?

Hey @fermoya, another issue from me.

I'm just playing with the component a bit to see if it fits my needs. Feel free to close these issues if these uses cases are not something you would like to support.

I'm trying to create a pager that looks something like this:

A pager with pages with an itemAspectRatio greater than 1 so they're wider than they're tall with only a little bit of padding on the top and bottom. Also, I would like to see quite a bit of the next page.

If I try to create this by using itemAspectRatio my pager always has a lot of padding on the top or bottom. There seems to be no way to fix this with the current attributes. I'm fairly new to SwiftUI so please correct me if there is a way to accomplish this.

I've taken your sample and added 2 sliders for the itemAspectRatio and frame.height to play with but I can't make it work.

The closest I get is by setting the itemAspectRatio to 0 but that gives me a pager where I can barely see the next card.

Wouldn't it be an option to make the pageSize an attribute the user can set directly?

.pageSize(width: CGFloat?, height: CGFloat?)

That would give a lot of freedom and open the component up to a lot more use cases!

Or even on a per page basis, that would make the component even more flexible:

Pager(
    page: self.$page1,
    data: self.data1,
    id: \.self,
    pageSize: { page -> CGSize in
         // calculate size for page
    }
) {
    self.pageView($0)
}

Looking forward to hearing your thoughts!

Describe the bug The compilation for "My Mac (Rosetta)" on MacBook M1 fails with "bundle format is ambiguous (could be app or framework)".

To Reproduce I added the framework via manual install to my SwiftUI Multiplatform project. It compiles for iOS, but fails for macOS.

Expected behavior Compile.

Screenshots / Videos If applicable, add screenshots to help explain your problem.

Environment:

• OSX: macOS 12 Beta 3
• Device: iOS 15.0 Simulator
• SwiftUIPager version: 2.3.1

Describe the bug Transparent image across the whole page view when swiping too fast to the right.

To Reproduce

• Run the code below.
• Swipe left rapidly.

Note: Set images from your Asset folder by setting the array pages.

let pages: [String] = [
    "#image1",
    "#image2",
    "#image3",
    "#image4",
    "#image5"
]

struct InfiniteExampleView: View {
    @StateObject var page = Page.first()
    @State var isPresented: Bool = false
    var data = Array(0..<5)

    var body: some View {
        ZStack {
            
            Pager(page: self.page,
                  data: self.data,
                  id: \.self) {
                self.pageView($0)
            }
                  .pagingPriority(.simultaneous)
                  .loopPages()
                  .itemSpacing(0)
            
        }
        .edgesIgnoringSafeArea(.all)
    }

    func pageView(_ page: Int) -> some View {
        PageView(image: pages[page])
            .clipped()
            .edgesIgnoringSafeArea(.all)
    }

}



public struct PageView: View {
    let image: String
 
    public init(image: String
    ){
        self.image = image
    }
}

extension PageView {
    public var body: some View {
        ZStack(alignment: .bottomLeading) {
            Image(image)
                .resizable()
                .scaledToFill()
            
            LinearGradient(gradient: Gradient(colors: [.clear, .black]), startPoint: .top, endPoint: .bottom)
                .frame(height: 600)
            
            VStack(spacing: 22) {
                HStack {
                    VStack(alignment: .leading, spacing: 20) {
                        Text("a title")
                        Text("another title")
                            
                    }
                    
                    Spacer()
                }
            }
        }
    }
}

Expected behavior The page view should scroll normally without showing a strange moving transparent image when doing the swiping.

Screenshots / Videos

Environment:

• OSX: iOS 16.1
• Device: iPhone 14 Pro
• SwiftUIPager version: 2.5.0

Additional context Just run the code above, you'll see the issue.

Btw, Amazing works guys! keep it up!

https://user-images.githubusercontent.com/12664335/209736364-2e7ee9fb-76ce-445d-81e2-ad5469c38195.mp4

Change demo code to reflect https://github.com/fermoya/SwiftUIPager/issues/181#issuecomment-763894461 As is the sample code doesn't fails to build with error: Value of type 'Int' has no member 'identifier'

using these two parameters together causes a blank screen that does not work

   .contentLoadingPolicy(.lazy(recyclingRatio: 1)) // the problem only with recyclingRatio: 1, with other parameters it works
   .loopPages()

iOS 16 Xcode 14.0.1

Describe the bug While using Loop the standard animation is not working properly. If I add a data from view its working fine but when i try to use data from viewmodel then its not woking properly

To Reproduce Add a data from ViewModel and add a loopPages()

• Sample code

@ObservedObject var discoverVM: DiscoveryViewModel
var body: some View {
 Pager(page: .first(), data: discoverVM.showProfiles, id: \.self) {
                    self.pageView($0.connections ?? 0)
                }
                .pagingPriority(.simultaneous)
                .draggingAnimation(.standard)
                .loopPages()
                .sensitivity(.high)
                .itemSpacing(10)
                .itemAspectRatio(1.3, alignment: .start)
                .padding(20)
}

Expected behavior I want standard animation with using loopPages()

Screenshots / Videos If applicable, add screenshots to help explain your problem. https://user-images.githubusercontent.com/80446711/194536499-8c02f913-72f0-46f8-9832-8708cc212e45.MP4

Environment: Xcode : 14.1 iOS: 15.5

• OSX: [iOS]
• Device [iPhoneXs Max]
• SwiftUIPager version [2.4.0]

Additional context Add any other context about the problem here.

Hi everyone! I've recently started using this pager (2.5.0) on a production app and I've been facing a recycling issue I’ve not been able to solve.

Each page has 1 post, that fills the whole screen. The first batch of posts is fetched and displayed with no issues. After that, I dynamically add new posts at the top of the list; 1 post at a time. That’s when the issue arises! It seems that the new post view copies the state of the next and shows a subview that shouldn’t show.

Here's the pager:

Pager(page: viewModel.feedPage,
                      data: viewModel.feedItems,
                      id: \.self,
                      content: { index in
                        if index < viewModel.posts.count {
                            PostView(post: viewModel.posts[index])
                        } else {
                            Text("Loading...")
                                    .foregroundColor(.white)
                                    .font(.default(size: 17))
                        }
                })
                .vertical()
                .sensitivity(.custom(0.1))
                .onPageWillChange { index in
                    viewModel.willChangeVerticalPage(index: index)
                }

struct PostView: View {
    @StateObject private var viewModel = ViewModel()
    let post: Post
    
    var body: some View {
        VStack {
            SendFriendRequestView(userId: post.user.id) // the subview inside UserViews is the issue
            PostImageView(imageURL: post.imageURL, text: post.text)
        }
        .onAppear {
            viewModel.setUp(post: post)
        }
        .environmentObject(viewModel)
    }
}

fileprivate struct SendFriendRequestView: View {
    @EnvironmentObject private var viewModel: PostView.ViewModel
    let userId: String
    
    var body: some View {
        Button {
            viewModel.sendFriendRequest(userId: userId)
        } label: {
            HStack {
                switch viewModel.sendFriendRequestViewState {
                case .send: sendView
                case .loading: loadingView
                case .waiting: waitingView
                case .hidden: EmptyView()
                }
            }
        }
        .disabled(viewModel.sendFriendRequestViewState != .send)
    }
    
    var sendView: some View {
        HStack {
            Image(systemName: "person.2.fill")
                .resizable()
                .scaledToFit()
                .foregroundColor(.white)
                .frame(width: 10, height: 10)
            
            Text("Add+")
                .foregroundColor(.white)
                .font(.default(size: 13))
        }
        .padding(8)
        .background(
            Capsule().fill(.white.opacity(0.2))
        )
    }
    
    var loadingView: some View {
        ProgressView()
            .tint(.white)
            .padding(8)
            .background(
                Capsule().fill(.white.opacity(0.2))
            )
    }
    
    var waitingView: some View {
        HStack {
            Text("Sent")
                .foregroundColor(.white)
                .font(.default(size: 13))
            
            Image(systemName: "checkmark")
                .resizable()
                .scaledToFit()
                .foregroundColor(.white)
                .frame(width: 10, height: 10)
        }
        .padding(8)
        .background(
            Capsule().fill(.white.opacity(0.2))
        )
    }
}

And here are the involved pieces of the view model:

    class ViewModel: ObservableObject {
        @Published private(set) var sendFriendRequestViewState = SendFriendRequestViewState.hidden

        func setUp(post: Post) {
            self.post = post
            determineSendFriendRequestViewState()
        }
        
        func determineSendFriendRequestViewState() {
            func isStateSend() -> Bool {
                post.user.isCurrentUser == false &&
                currentUserService.user?.friendIds.contains(post.user.id) == false &&
                currentUserService.user?.sentFriendRequestUserIds.contains(post.user.id) == false
            }
            
            func isStateWaiting() -> Bool {
                currentUserService.user?.friendIds.contains(post.user.id) == false &&
                currentUserService.user?.sentFriendRequestUserIds.contains(post.user.id) == true
            }
            
            if isStateSend() {
                sendFriendRequestViewState = .send
            } else if isStateWaiting() {
                sendFriendRequestViewState = .waiting
            } else {
                sendFriendRequestViewState = .hidden
            }
        }
    }

I realized that if I add .contentLoadingPolicy(.lazy(recyclingRatio: 0)) fixes my issue, but I don’t think it’s a good practice. Any ideas?