Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The second card pass through the first one after swiping #4

Open
ghost opened this issue Sep 15, 2020 · 3 comments
Open

The second card pass through the first one after swiping #4

ghost opened this issue Sep 15, 2020 · 3 comments

Comments

@ghost
Copy link

ghost commented Sep 15, 2020

Look closely, the second card pass through the first one after swiping, before it completely disappear. It looks / feels like the first card moved backwards and been drew out after the second card.

20200915@105212@2x

20200915@105348@2x

@dadalar
Copy link
Owner

dadalar commented Sep 15, 2020

This is a known issue and in order to fix it I believe we need to change how we animate cards to outside of the screen. Current transition I used is one of SwiftUI defaults and needs to be replaced by custom animation. If you want to try fixing this or have any other way of fixing this, please let me know.

@ghost ghost changed the title The second card pass through the first card after swiping The second card pass through the first one after swiping Sep 15, 2020
@ildarnm
Copy link

ildarnm commented Aug 28, 2022

Hi @dadalar It looks like adding zIndex(1) for CardView in the card function fixes animation

private func card(index: Data.Index, relativeIndex: Int) -> some View {
    CardView(
      direction: direction,
      isOnTop: relativeIndex == 0,
      onSwipe: { direction in
        self.onSwipe(self.data[index], direction)
        self.currentIndex = self.data.index(after: index)
      },
      content: { direction in
        self.content(self.data[index], direction, relativeIndex == 0)
          .offset(
            x: 0,
            y: CGFloat(relativeIndex) * self.configuration.cardOffset
          )
          .scaleEffect(
            1 - self.configuration.cardScale * CGFloat(relativeIndex),
            anchor: .bottom
          )
      }
    )
    .zIndex(1)
  }

@dadalar
Copy link
Owner

dadalar commented Aug 30, 2022

Hi @ildarnm. Interesting because you're setting the same zIndex (1) for all cards. Maybe we can set negative index argument (.zIndex(-index)) or relativeIndex? Do you want to create a PR for that so that you can be the author?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants