Fit titleIconView to page width

[fulldecent]

I was expecting the image to take up the available space. This is the code we used:

        let page1 = EAIntroPage()
        page1.title = NSLocalizedString("A party game", comment: "Intro screen 1 title")
        page1.desc = NSLocalizedString("For 3 to 12 players", comment: "Intro screen 1 detail")
        page1.titleIconView = UIImageView(image: UIImage(named: "help1"))

This is what we got

Currently best practice is this implementation: https://github.com/kolyvan/kxintro

[ealeksandrov]

Have you tried using bgImage instead of titleIconView? Also I have no idea what is happening on your attached screen and how do you want it to look.

[fulldecent]

I have tried bgImage too and got the same effect.

I was hoping for it to shrink to fit on the screen like in this screenshot.

[ealeksandrov]

What happens if you drop your image in example project? I don't understand yet where is titleIcon on your screenshot.

[fulldecent]

Sorry. In my screenshot, the intro screen is the two blue guys. Here is what I have so far with KXIntroView (https://github.com/kolyvan/kxintro).

I am seeking to approximate this experience using EAIntroView.

[ealeksandrov]

Ok, now I see. Can you share this image with me, so I can test it?

[fulldecent]

You bet. Thanks for your help!

[ealeksandrov]

Here is how you can do it now:

EAIntroPage *page1 = [EAIntroPage page];
page1.title = @"Testing image";
page1.desc = sampleDescription1;
page1.bgImage = [UIImage imageNamed:@"bg1"];

UIImage *testImage = [UIImage imageNamed:@"image"];
UIImageView *testImageView = [[UIImageView alloc] initWithImage:testImage];
float imageRatio = testImage.size.width / testImage.size.height;
float widthToFit = self.view.bounds.size.width;
[testImageView setFrame:CGRectMake(0, 0, widthToFit, widthToFit / imageRatio)];
page1.titleIconView = testImageView;

In EAIntroView we're preserving original image size 1:1. Code above will resize titleIconView to fit screen. I will think more about updating page layout to handle this automatically.

[fulldecent]

Very nice, thank you!

In portrait orientation this will work. I'll need to figure it out when rotating or switching to other devices.

[ealeksandrov]

I'll look into it on weekend and give you update.

[ealeksandrov]

Added autolayout constraints to fit titleIconView inside page frame - https://github.com/ealeksandrov/EAIntroView/commit/a090a152d01e8259391432de867ba5c7b4aec7c7

With your image it produces same screenshot as workaround above. Also works in landscape. It lays out titleIconView - title - description vertically. PageControl and SkipButton may overlap - but they can be on any position on a page (for example, on top), so I don't manage them in this equation.

To add padding between description and screen bottom and fit pageControl there - you can add empty newlines at the end of page description.

Released in 2.11.0.

[fulldecent]

Thank you, this works great now!