如何将uiscrollview设置为三维正方形

我使用以下代码来实现这一点

我在故事板中创建了3个带有uiImageView的滚动视图

@iboutlet var faces:[uiview]!
viewdidiload


var perspective:catTransform3D=catTransform3Identity
透视图.m34=-1.0/500.0

自我观察?.layer.sublayerTransform=透视

透视图=cattransform3drotate(透视图,cgfloat(-double.pi/4),1,0,0)
透视图=cattransform3drotate(透视图,cgfloat(-double.pi/4),0,1,0)

打印(透视)

self.view.layer.sublayerTransform=透视

//添加立方体面1
var变换:catransform3d=catransform3dmakestransform(0,0,50)
添加面(0,带transform:transform)

//添加立方体面2
转换=CatTransform3dMakeTranslation(50、0、0)
transform=cattransform3drotate(transform,cgfloat(double.pi/2),0,1,0)

添加面(1,带变换:变换)

//添加立方体面3
转换=CatTransform3dMakeTranslation(0,-50,0)
transform=cattransform3drotate(transform,cgfloat(double.pi/2),1,0,0)

添加面(2,带变换:变换)
addface函数


func addface(u index:int,withtransform-transform:cattransform3d){
让我们面对:uiview?=面[索引]

如果让Aface=脸{
self.view.addSubview(aface)视图
}

让集装箱尺寸:cgsize?=self.view.bounds.size

面对?.center=cgpoint(x:(集装箱尺寸?.宽度??0.0)/2.0,y:(集装箱尺寸?.高度??0.0)/2.0)
面对?.layer.transform=转换
}
输出





@IBOutlet var faces: [UIView]!


视图迪迪洛德

    var perspective: CATransform3D = CATransform3DIdentity
    perspective.m34 = -1.0 / 500.0

    self.view?.layer.sublayerTransform = perspective

    perspective = CATransform3DRotate(perspective, CGFloat(-Double.pi / 4), 1, 0, 0)
    perspective = CATransform3DRotate(perspective, CGFloat(-Double.pi / 4), 0, 1, 0)

    print(perspective)

    self.view.layer.sublayerTransform = perspective

    //add cube face 1
    var transform: CATransform3D = CATransform3DMakeTranslation(0, 0, 50)
    addFace(0, withTransform: transform)

    //add cube face 2
    transform = CATransform3DMakeTranslation(50, 0, 0)
    transform = CATransform3DRotate(transform, CGFloat(Double.pi / 2), 0, 1, 0)

    addFace(1, withTransform: transform)

    //add cube face 3
    transform = CATransform3DMakeTranslation(0, -50, 0)
    transform = CATransform3DRotate(transform, CGFloat(Double.pi / 2), 1, 0, 0)

    addFace(2, withTransform: transform)


添加面函数

func addFace(_ index: Int, withTransform transform: CATransform3D) {
    let face: UIView? = faces[index]

    if let aFace = face {
        self.view.addSubview(aFace)
    }

    let containerSize: CGSize? = self.view.bounds.size

    face?.center = CGPoint(x: (containerSize?.width ?? 0.0) / 2.0, y: (containerSize?.height ?? 0.0) / 2.0)
    face?.layer.transform = transform
}


产量

似乎你需要用手势来旋转立方体来调整拼贴画。所以你不能只为了达到同样的目的而使用uikit。

从uikit坐标转换到scenekit坐标是您的需求中的挑战。

相反,您需要利用scenekit和uikit来完成相同的工作。

遵循以下步骤

使用scenekit创建多维数据集UI

import UIKit
import SceneKit

class ViewController: UIViewController {

@IBOutlet weak var mySceneView: SCNView!
override func viewDidLoad() {
    super.viewDidLoad()
    mySceneView.allowsCameraControl = true
    //Create instance of scene
    let scene = SCNScene()
    mySceneView.scene = scene
    //Add cube to scnview
    AddCubeToScene()
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

func AddCubeToScene()
{
    //Create a box of size 0.1 * 0.1 * 0.1
    let myBox = SCNBox(width: 0.1, height: 0.1, length: 0.1, chamferRadius: 0)
    myBox.firstMaterial?.diffuse.contents = UIColor.red
    myBox.firstMaterial?.isDoubleSided = true
    //Create SCnnode of from geometry and specified its position
    let cubeNode = SCNNode(geometry: myBox)
    //Add created scnnode to scene
    mySceneView.scene?.rootNode.addChildNode(cubeNode)
}
}

使用uikit创建uiscrollview

weak var scrollView: UIScrollView?

override func viewDidLoad() {
super.viewDidLoad()

let scrollView = UIScrollView(frame: CGRect.zero)
scrollView.contentSize = contentSize
scrollView.delegate = self
scrollView.minimumZoomScale = 1
scrollView.maximumZoomScale = 3
scrollView.indicatorStyle = .white
self.scrollView = scrollView

let clearContentView = UIView(frame: CGRect(x: 0, y: 0, width: contentSize.width, height: contentSize.height))
    clearContentView.backgroundColor = UIColor.clear
    scrollView.addSubview(clearContentView)
    self.clearContentView = clearContentView
    clearContentView.addObserver(self, forKeyPath: "transform", options: .new, context: &ViewTransformChangedObservationContext)
    skView.addSubview(scrollView)
}

override func viewWillLayoutSubviews() {
    super.viewWillLayoutSubviews()
    scrollView?.frame = view.bounds
    scene?.size = view.bounds.size
    if let scrollView = scrollView {
        adjustContent(scrollView: scrollView)
    }
}

func adjustContent(scrollView: UIScrollView) {
    let zoomScale = scrollView.zoomScale
    scene?.setContentScale(scale: zoomScale)
    let contentOffset = scrollView.contentOffset
    let contentSize = scrollView.contentSize
    let scrollAreaHeight: CGFloat = contentSize.height - scrollView.bounds.height
    let yUIKit: CGFloat = contentOffset.y

    // Convert from UIKit coordinates to SpriteKit coordinates
    // UIKit has 0,0 in the top-left corner
    // SpriteKit has 0,0 in the bottom-left corner
    let ySpriteKit = scrollAreaHeight - yUIKit
    let contentOffsetSpriteKit = CGPoint(x: contentOffset.x, y: ySpriteKit)
    scene?.contentOffset = contentOffsetSpriteKit
}

func scrollViewDidScroll(_ scrollView: UIScrollView) {
    adjustContent(scrollView: scrollView)
}

func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView? {
    return clearContentView
}

func scrollViewDidTransform(scrollView: UIScrollView) {
    adjustContent(scrollView: scrollView)
}

// scale between minimum and maximum. called after any 'bounce' animations
func scrollViewDidEndZooming(_ scrollView: UIScrollView, with view: UIView?, atScale scale: CGFloat) {
    adjustContent(scrollView: scrollView)
}

现在添加 UIScrollView 多维数据集每边的实例(即子节点)

你在那儿!

您正在寻找的解决方案可以作为一个框架。 您可以看看这些开源项目。 MKCubeController , CubeController 和 Gemini .

CubeController是最接近您需求的控制器,您可能需要稍微修改一下。 双子座也有立方体实现。