iosiphoneuiviewinterface-buildericarousel

iOS: Constraints on unselected view in iCarousel


I am using iCarousel to display instances of a custom view I have created in IB. When the carousel loads, the first view in the carousel displays correctly, like this:

enter image description here

However, the other indexes seem to be ignoring my constraints, like this: enter image description here

Once I click on this view, the layout corrects itself. Also notice that the first index now has a screwed up layout: enter image description here

Any idea how to correct this? My code relating to the carousel:

- (NSUInteger)numberOfItemsInCarousel:(iCarousel *)carousel
{
    //return the total number of items in the carousel
    NSLog(@"size=%d",audio.count);
    return audio.count;
}

- (UIView *)carousel:(iCarousel *)carousel viewForItemAtIndex:(NSUInteger)index reusingView:(UIView *)view
{
    NSLog(@"get view for index %d",index);
    Audio *aud = [audio objectAtIndex:index];

    CGRect screenRect = [[UIScreen mainScreen] bounds];
    CGFloat screenWidth = screenRect.size.width;
    CGFloat screenHeight = screenRect.size.height;

    AudioView *aView;

    float height = screenWidth*.5;
    float width = height * (16.0/9.0);

    //create new view if no view is available for recycling
    if (view == nil)
    {


        aView = [[[NSBundle mainBundle] loadNibNamed:@"AudioView" owner:self options:nil] objectAtIndex:0];
        [aView setFrame:CGRectMake(0, 0, width, height)];


    }else{
        aView=(AudioView *)view;
    }
    aView.layer.cornerRadius=8;
    NSLog(@"%f",aView.frame.size.height);
    NSLog(@"%f",aView.frame.size.width);


    aView.backgroundColor=[UIColor alizarinColor];
    aView.textLabel.text=aud.text;
    aView.titleLabel.text=aud.name;

    if (rowCurrentlyPlaying==index&&isPlaying) {
        aView.imageView.image = [UIImage imageNamed:@"pause.png"];
    }else{
        aView.imageView.image = [UIImage imageNamed:@"play.png"];
    }



    return aView;
}

- (CGFloat)carousel:(iCarousel *)carousel valueForOption:(iCarouselOption)option withDefault:(CGFloat)value
{
    if (option == iCarouselOptionSpacing)
    {
        return value * 1.1f;
    }
    return value;
}

- (void)carousel:(iCarousel *)carousel didSelectItemAtIndex:(NSInteger)index{
    NSLog(@"Clicked");
    if(index==self.carousel.currentItemIndex){
        Audio *aud = [audio objectAtIndex:index];
        NSURL *audUrl = [NSURL URLWithString:aud.audioUrl];

        if (rowCurrentlyPlaying==index) {
            if (isPlaying) {
                [anAudioStreamer pause];
                isPlaying=NO;
            }else{
                [anAudioStreamer play];
                isPlaying=YES;
            }
        }else{
            rowCurrentlyPlaying=index;
            isPlaying=YES;


            aPlayerItem = [[AVPlayerItem alloc] initWithURL:audUrl];
            anAudioStreamer = [[AVPlayer alloc] initWithPlayerItem:aPlayerItem];
            [anAudioStreamer play];
        }


        [carousel reloadData];

    }

}

EDIT:I tried this on iPad as well, and I thought these screenshots might help shed some light (please ignore the hilarious font sizes). It looks like it's just not stretching to the full width when not selected.

Correct layout: enter image description here

Incorrect layout: enter image description here


Solution

  • i haven't looked at iCarousel in a while, but this is from the readMe file in whatever version I have here

    iCarousel supports the following built-in display types:
    
    - iCarouselTypeLinear
    - iCarouselTypeRotary
    - iCarouselTypeInvertedRotary
    - iCarouselTypeCylinder
    - iCarouselTypeInvertedCylinder
    - iCarouselTypeWheel
    - iCarouselTypeInvertedWheel
    - iCarouselTypeCoverFlow
    - iCarouselTypeCoverFlow2
    - iCarouselTypeTimeMachine
    - iCarouselTypeInvertedTimeMachine
    
    You can also implement your own bespoke carousel styles using `iCarouselTypeCustom` and the `carousel:itemTransformForOffset:baseTransform:` delegate method.
    
    NOTE: The difference between `iCarouselTypeCoverFlow` and `iCarouselTypeCoverFlow2` types is quite subtle, however the logic for `iCarouselTypeCoverFlow2` is substantially more complex. If you flick the carousel they are basically identical, but if you drag the carousel slowly with your finger the difference should be apparent. `iCarouselTypeCoverFlow2` is designed to simulate the standard Apple CoverFlow effect as closely as possible and may change subtly in future in the interests of that goal.
    

    Im not sure if you understand that the iCourousel is applying transforms to those views that are not the current selection, this is deliberate. Its having a stab at emulating Apple's cover flow api, (which is unavailable to us)..

    ok so your carousel object has a property of type iCarouselType called type, from the enum above, best bet is trying each of these to find the one which suits you.