3D rotatable cube with clickable areas on sides

一曲冷凌霜 提交于 2019-12-12 09:24:19

问题


What I want to accomplish is an iPad Application with a 3D rotatable cube, and on each side of the cube I want to define multiple areas where once clicked would take to another view or display a popup.

  1. Can this be achieved with some effort using OpenGL ES in Xcode from scratch, or should I use a 3D framework, if so what would be the easiest framework? (I have only heard of Unity and its pretty expensive)

  2. Does anyone have a good tutorial for me to learn how to do this?

I already tried 3D CSS3 Transformation but I want to keep that as the last resort.


回答1:


If all you want is a literal 3D cube, you can use Core Animation for this. Check out CATransformLayer. You can compose true 3D hierarchies pretty easily using CATransformLayer. Joe Ricioppo has a cool article about this, along with some sample code and a video. It's similar to 3D CSS3 transforms, except it's a lot easier to manipulate a single layer that represents a 3D hierarchy instead of individually transforming each sublayer. Just rotate all your cube faces initially and position them so they form a cube. Then you can apply transforms to the transform layer itself, and it will do all the fancy math to transform your sublayers automatically.

The big problem with this is how touch handling will work. You cannot use -hitTest: on CATransformLayer as it is unable to map 2D touches to its own 3D hierarchy. You might be able to rig your own hitTest: implementation to figure this out, but it almost feels like more work than its worth. I'm unaware of what provisions OpenGL offers for 2D-to-3D touch translation, but this may be your only option.




回答2:


Try This code

CATransition *transition = [CATransition animation];
transition.delegate = self;
transition.duration = 0.8;
transition.timingFunction = [CAMediaTimingFunction     functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
NSString *types[4] = {@"cube", @"rippleEffect", @"cube", @"alignedCube"};
NSString *subtypes[4] = {kCATransitionFromTop, kCATransitionFromLeft, kCATransitionFromRight, kCATransitionFromBottom};
transition.type = types[0];
transition.subtype = subtypes[1];
[self.view.layer addAnimation:transition forKey:nil];



回答3:


Maybe not exactly what you are looking for but we've produced some code that functionally might help you: http://www.chupamobile.com/products/details/2106/Cube+Selector/

It's fully featured and ready to use out of the box



来源:https://stackoverflow.com/questions/10290721/3d-rotatable-cube-with-clickable-areas-on-sides

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!