programing

UIView에 관점 변환을 적용하려면 어떻게 해야 합니까?

newsource 2023. 6. 14. 21:53

UIView에 관점 변환을 적용하려면 어떻게 해야 합니까?

UIView에서 원근 변환을 수행하려고 합니다(커버플로우에서 보는 것과 같은).

이것이 가능한지 아는 사람?

를사하조니다습사했여용다를 사용하여 조사했습니다.CALayer실용적인 프로그래머 코어 애니메이션 팟캐스트를 모두 살펴보았지만, 아이폰에서 이런 종류의 변형을 만드는 방법에 대해서는 아직 잘 모르겠습니다.

모든 도움말, 포인터 또는 예제 코드 스니펫은 정말 감사합니다!

벤이 말했듯이, 당신은 그들과 함께 일할 필요가 있을 것입니다.UIView's 면층, 용사 CATransform3D을 하다layer's rotation여기에 설명된 것처럼 관점이 작동하도록 하는 비결은 매트릭스 중 하나에 직접 액세스하는 것입니다.cells의 시대의CATransform3D가 좋아하는 것이 . 저는 왜 작동하는지 정확히 할 수 (m34). 행렬 수학은 제가 좋아하는 것이 아니었습니다. 그래서 저는 왜 이것이 작동하는지 정확하게 설명할 수 없지만, 그렇습니다.초기 변환에 대해 이 값을 음수 부분으로 설정한 다음 계층 회전 변환을 이 부분에 적용해야 합니다.또한 다음을 수행할 수 있어야 합니다.

목표-C

UIView *myView = [[self subviews] objectAtIndex:0];
CALayer *layer = myView.layer;
CATransform3D rotationAndPerspectiveTransform = CATransform3DIdentity;
rotationAndPerspectiveTransform.m34 = 1.0 / -500;
rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 45.0f * M_PI / 180.0f, 0.0f, 1.0f, 0.0f);
layer.transform = rotationAndPerspectiveTransform;

스위프트 5.0

if let myView = self.subviews.first {
    let layer = myView.layer
    var rotationAndPerspectiveTransform = CATransform3DIdentity
    rotationAndPerspectiveTransform.m34 = 1.0 / -500
    rotationAndPerspectiveTransform = CATransform3DRotate(rotationAndPerspectiveTransform, 45.0 * .pi / 180.0, 0.0, 1.0, 0.0)
    layer.transform = rotationAndPerspectiveTransform
}

각 회전에 대해 처음부터 계층 변환을 재구성합니다.

이에 대한 전체 예(코드 포함)를 여기에서 확인할 수 있습니다. 여기서 몇 가지에 대해 터치 기반 회전 및 확장 기능을 구현했습니다.CALayers빌 더드니의 예를 바탕으로 합니다.페이지 맨 아래에 있는 최신 버전의 프로그램은 이런 종류의 투시 연산을 구현합니다.코드는 읽기에 상당히 간단해야 합니다.

sublayerTransform은 당신의 응서언것하계적변의 입니다.UIView's CALayer하위 계층이 없으면 걱정하지 마십시오.가 이 두 의 예에서하이사단는유용두순가있때다가 있기 때문입니다.CALayers내가 회전하는 한 층 안에 포함되어 있습니다.

UIView의 변환 속성에 직접 적용된 코어 그래픽(쿼츠, 2D 전용) 변환만 사용할 수 있습니다.커버플로우에서 효과를 얻으려면 3D 공간에 적용된 CAT 변환 3D를 사용해야 하므로 원하는 투시도를 제공할 수 있습니다.CAT 변환 3D는 뷰가 아닌 레이어에만 적용할 수 있으므로 레이어로 전환해야 합니다.

Xcode와 함께 제공되는 "CovertFlow" 샘플을 확인하십시오.Mac 전용이지만(아이폰용은 아님) 많은 개념이 잘 전달됩니다.

스위프트 5.0

func makeTransform(horizontalDegree: CGFloat, verticalDegree: CGFloat, maxVertical: CGFloat,rotateDegree: CGFloat, maxHorizontal: CGFloat) -> CATransform3D {
    var transform = CATransform3DIdentity
           
    transform.m34 = 1 / -500
    
    let xAnchor = (horizontalDegree / (2 * maxHorizontal)) + 0.5
    let yAnchor = (verticalDegree / (-2 * maxVertical)) + 0.5
    let anchor = CGPoint(x: xAnchor, y: yAnchor)
    
    setAnchorPoint(anchorPoint: anchor, forView: self.imgView)
    let hDegree  = (CGFloat(horizontalDegree) * .pi)  / 180
    let vDegree  = (CGFloat(verticalDegree) * .pi)  / 180
    let rDegree  = (CGFloat(rotateDegree) * .pi)  / 180
    transform = CATransform3DRotate(transform, vDegree , 1, 0, 0)
    transform = CATransform3DRotate(transform, hDegree , 0, 1, 0)
    transform = CATransform3DRotate(transform, rDegree , 0, 0, 1)
    
    return transform
}

func setAnchorPoint(anchorPoint: CGPoint, forView view: UIView) {
    var newPoint = CGPoint(x: view.bounds.size.width * anchorPoint.x, y: view.bounds.size.height * anchorPoint.y)
    var oldPoint = CGPoint(x: view.bounds.size.width * view.layer.anchorPoint.x, y: view.bounds.size.height * view.layer.anchorPoint.y)
    
    newPoint = newPoint.applying(view.transform)
    oldPoint = oldPoint.applying(view.transform)
    
    var position = view.layer.position
    position.x -= oldPoint.x
    position.x += newPoint.x
    
    position.y -= oldPoint.y
    position.y += newPoint.y
    
    print("Anchor: \(anchorPoint)")
    
    view.layer.position = position
    view.layer.anchorPoint = anchorPoint
}

당신은 당신의 학위로 함수를 부르면 됩니다.예:

var transform = makeTransform(horizontalDegree: 20.0 , verticalDegree: 25.0, maxVertical: 25, rotateDegree: 20, maxHorizontal: 25)
imgView.layer.transform = transform

아이캐러셀 SDK를 이용하면 정확한 캐러셀 효과를 얻을 수 있습니다.

놀랍고 무료인 iCarouseel 라이브러리를 사용하면 iOS에서 즉시 커버 플로우 효과를 얻을 수 있습니다.https://github.com/nicklockwood/iCarousel 에서 다운로드한 후 브리지 헤더를 추가하여 Xcode 프로젝트에 쉽게 넣을 수 있습니다(목표-C로 작성됨).

이전에 Swift 프로젝트에 Objective-C 코드를 추가하지 않은 경우 다음 단계를 수행합니다.

  • iCarouseel 다운로드 후 압축 풀기
  • 압축을 푼 폴더로 이동하여 iCaroussel 하위 폴더를 연 다음 iCaroussel.h 및 iCaroussel.m을 선택하고 프로젝트 탐색으로 끌어다 놓으면 Xcode의 왼쪽 창이 나타납니다.Info.plist 바로 아래는 괜찮습니다.
  • 필요한 경우 항목 복사를 선택한 후 마침을 누릅니다.
  • Xcode는 "Objective-C Bridging Header를 구성하시겠습니까?"라는 메시지를 표시합니다."Bridging Header 만들기"를 클릭합니다. 프로젝트에 ProjectName-Bridging-Header.h라는 새 파일이 나타납니다.
  • #import "iCarouel" 파일에 이 행을 추가합니다.h"
  • 프로젝트에 iCarousel을 추가하면 사용을 시작할 수 있습니다.
  • iCarouselDelegate 및 iCarouselDataSource 프로토콜을 모두 준수해야 합니다.

Swift 3 샘플 코드:

    override func viewDidLoad() {
      super.viewDidLoad()
      let carousel = iCarousel(frame: CGRect(x: 0, y: 0, width: 300, height: 200))
      carousel.dataSource = self
      carousel.type = .coverFlow
      view.addSubview(carousel) 
    }

   func numberOfItems(in carousel: iCarousel) -> Int {
        return 10
    }

    func carousel(_ carousel: iCarousel, viewForItemAt index: Int, reusing view: UIView?) -> UIView {
        let imageView: UIImageView

        if view != nil {
            imageView = view as! UIImageView
        } else {
            imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 128, height: 128))
        }

        imageView.image = UIImage(named: "example")

        return imageView
    }

언급URL : https://stackoverflow.com/questions/347721/how-do-i-apply-a-perspective-transform-to-a-uiview