I am trying to bring out dock like magnification effect for my iPad app thru iCarousel library. With that i am able to zoom in the center item of the carousel with the following piece of code, but trying to zoom the adjacent items of the centre item with zoom level little less than the centre item.
- (CATransform3D)carousel:(iCarousel *)_carousel itemTransformForOffset:
:(CGFloat)offset baseTransform:(CATransform3D)transform
{
CGFloat MAX_SCALE = 1.95f; //max scale of center item
CGFloat MAX_SHIFT = 40.0f; //amount to shift items to keep spacing the same
CGFloat shift = fminf(1.0f, fmaxf(-1.0f, offset));
CGFloat scale = 1.0f + (1.0f - fabs(shift)) * (MAX_SCALE - 1.0f);
transform = CATransform3DTranslate(transform,
offset * _carousel.itemWidth * 1.08f + shift * MAX_SHIFT, 0.0f, 0.0f);
return CATransform3DScale(transform, scale, scale, scale);
}
Looking forward for any kind of help. thanks.
This function could be your answer:
its graph (for scaleMax = 3, xFactor = 1):
This function is used directly for calculating the scale factor from the carousel offset. In addition you need to shift the elements to left and right, so that don't overlap (as you already did). This can be done either by shifting the items by the function's integral, which works, but the gap in the center is huge this way. Or it can be calculated manually by taking a sum of all scaled items. The gap can stay constant, or it can be scaled separately.
Notice that the scale is equal to 1 in the center and descends to 1/scale_max by the edges. This is because scaling down doesn't create undesirable pixelated effects. Make your item view as you want it to appear in the center and the views on the edges will get scaled down.
This could be the usage:
with result:
You can try to alter constants for different behaviors. Also changing the exponent to another even number can further widen the peak and sharpen the descent to the minimum scale.
You need to watch episode 219 from WWDC 2012 - Advanced Collection Views and Building Custom Layouts. I know it relates to collection views, but I'm sure you'll find a way to adapt that code :)