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

Button above image view flashing during modal transition #413

Closed
bencallis opened this Issue Mar 1, 2018 · 4 comments

Comments

Projects
None yet
2 participants
@bencallis

bencallis commented Mar 1, 2018

We are considering using Hero for transitions within our application and have been trialing it out today.

We are having an issue with a close button flashing during a modal presentation of a details view controller.

The rootVC is a collection view with cells in that once tapped open a details view. The collection view cells have an image and 3 labels which are also present on the details screen. These are matched up with hero IDs and animate as expected. On the details screen there is a dismiss button in the top left (on top of the imageView). This does not have heroID as it is not on ht previous view controller ad we just expect it to fade in.

As you can see in the video the button appears to fade in then become 100% visible before fading in again causing a sort of flash.

Any suggestions to what we could be doing wrong?

Thanks in advanced for you help and working on this library.

RootVC

        let cell: DealCardCellCollectionViewCell = collectionView.dequeueReusableCell(forIndexPath: indexPath)
        let deal = deals[indexPath.row]
        cell.configure(for: deal)
        
        cell.dealCard.imageView.hero.id = deal.id + "_offerImage"
        cell.dealCard.titleLabel.hero.id = deal.id + "_offerTitle"
        cell.dealCard.descriptionLabel.hero.id = deal.id + "_offerDescription"
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        let deal = deals[indexPath.row]

        let detailsVC = OfferDetailsViewController.makeFromStoryboard()
        detailsVC.deal = deal
        detailsVC.hero.isEnabled = true
        self.present(detailsVC, animated: true, completion: nil)
    }

DetailsVC

// called from viewDidLoad
 private func configureHeroIdentifiers() {
        imageView.hero.id = deal.id + "_offerImage"
        titleLabel.hero.id = deal.id + "_offerTitle"
        descriptionLabel.hero.id = deal.id + "_offerDescription"
    }

ezgif-1-e92ff8d696

screen shot 2018-03-01 at 01 18 01

@lkzhao

This comment has been minimized.

Collaborator

lkzhao commented Mar 1, 2018

Give the button these modifiers: .fade, .useGlobalCoordinateSpace

@bencallis

This comment has been minimized.

bencallis commented Mar 1, 2018

Thanks useGlobalCoordinateSpace seems to be the magic modifier. Could you give me an explanation of what the flag does?

I have created custom transitions before so I would guess that this flag brings a snapshot of the view out into the containing view that performs the transition. Is that roughly right?

@lkzhao

This comment has been minimized.

Collaborator

lkzhao commented Mar 2, 2018

@bencallis

This comment has been minimized.

bencallis commented Mar 3, 2018

Thanks very much for that!

@lkzhao lkzhao closed this Mar 6, 2018

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment