Did icarroussel enable 3D wheel like this? - icarousel

Question

I have to present a menu like this in the picture :
where this buttons can move arround the cercle in the center similar to 3D effect, means you can see there dimensions transformation while moving.
I remember that iCarroussel project can do such things, Could Any pne guide me to the right control that provide this animation?
Thanks.
EDIT1 :
Ok I am able to see that iCarousel is almost what I need, but how to change the carousel vertical angle to get like the first picture? see how iCarousel is by default.

Answer 1

What you need to do is the following (Step by step as indicated below)
Download iCarousel ...
Open the sample project under Tests/ARC iOS (open iCarouselExample.xcodeproj)
Set default to "Cylinder" instead of "Coverflow" (in the viewDidLoad function of iCarouselExampleViewController.m)
- (void)viewDidLoad
{
[super viewDidLoad];
carousel.type = iCarouselTypeCylinder;
navItem.title = #"Cylinder";
}
Since you need just six items in your custom carousel set a "number of panes" in iCarouselExampleViewContoller.h as ...
//NOTE!
#define NUMBER_OF_ITEMS 6
Use this NUMBER_OF_ITEMS to setup the carousel (i.e. in iCarouselExampleViewContoller.m change the setup function as follows (use 'wrap' as shown)
- (void)setUp
{
//set up data
wrap = YES;
self.items = [NSMutableArray array];
//NOTE! use preset number of vars in Carousel
//for (int i = 0; i < 10000; i++)
for (int i=0; i< NUMBER_OF_ITEMS; i++)
{
[items addObject:[NSNumber numberWithInt:i]];
}
}
Now provide the perspective in iCarousel by updating the _perspective parameter in the uCarousel class. Do this in the setup function of iCarousel.m:
- (void)setUp
{
_type = iCarouselTypeLinear;
//NOTE! Tweak perspective parameters
_perspective = -1.0f/750.0f;
... etc ...
}
Finally give the entire view a "tilt" about the X axis by rotating the carousel by 15 degrees about the x axis. The way to do this is to tweak the transform matrix (set transform = CATransform3DRotate(transform, -15.0f*M_PI/180.0f, 1.0f, 0.0f, 0.0f) In code, in the iCarousel.m's transformForItemView function update this as follows:
- (CATransform3D)transformForItemView:(UIView *)view withOffset:(CGFloat)offset
{
//set up base transform
CATransform3D transform = CATransform3DIdentity;
transform.m34 = _perspective;
transform = CATransform3DTranslate(transform, -_viewpointOffset.width, _viewpointOffset.height, 0.0f);
//perform transform
switch (_type)
{
.... SKIPPED THE INITIAL SECTIONS OF THIS CODE WE MAKE OUR CHANGE IN THE CYLINDER SECTION ...
case iCarouselTypeCylinder:
case iCarouselTypeInvertedCylinder:
{
CGFloat count = [self circularCarouselItemCount];
CGFloat spacing = [self valueForOption:iCarouselOptionSpacing withDefault:1.0f];
CGFloat arc = [self valueForOption:iCarouselOptionArc withDefault:M_PI * 2.0f];
CGFloat radius = [self valueForOption:iCarouselOptionRadius withDefault:fmaxf(0.01f, _itemWidth * spacing / 2.0f / tanf(arc/2.0f/count))];
CGFloat angle = [self valueForOption:iCarouselOptionAngle withDefault:offset / count * arc];
if (_type == iCarouselTypeInvertedCylinder)
{
radius = -radius;
angle = -angle;
}
if (_vertical)
{
transform = CATransform3DTranslate(transform, 0.0f, 0.0f, -radius);
transform = CATransform3DRotate(transform, angle, -1.0f, 0.0f, 0.0f);
return CATransform3DTranslate(transform, 0.0f, 0.0f, radius + 0.01f);
}
else
{
transform = CATransform3DTranslate(transform, 0.0f, 0.0f, -radius);
//NOTE! Give it a tilt about the "X" axis
transform = CATransform3DRotate(transform, -15.0f*M_PI/180.0f, 1.0f, 0.0f, 0.0f);
transform = CATransform3DRotate(transform, angle, 0.0f, 1.0f, 0.0f);
return CATransform3DTranslate(transform, 0.0f, 0.0f, radius + 0.01f);
}