iPhone歪斜的CALayer

Question

我是一個初學者，我做一些練習與CALayer的熟悉自己...

我只是想知道如何「傾斜」（或傾斜）一CALayer的45°角？

謝謝。

Answer 1

你可以這樣做，但你會必須弄亂layer的transform財產，這是一個struct CATransform3D。和你一樣，你將不得不做一些矢量數學來做到這一點。有關更多詳細信息，請參見this answer中的compute_transform_matrix(...)函數。

你會想要做這樣的事情：

CGRect r = layer.bounds; 
layer.transform = compute_transform_matrix(r.origin.x, r.origin.y,     r.size.width,     r.size.height, 
              r.size.height, r.origin.y,     r.size.width + r.size.height, r.origin.y, 
              r.origin.x, r.origin.y + r.size.height, r.size.width,     r.origin.y); 

檢查這個我的數學。它應該是正確的。

Answer 2

CALayers有一個財產，affineTransform需要CAAffineTransform。該文檔明確指出：

縮放，旋轉和平移是 通過仿射變換支持最常用的操作 ，但 偏斜也可能。

（重點煤礦，很明顯）

有沒有內置的輔助構建歪斜變換，但你可以這樣做（未經測試）：

CGAffineTransform CGAffineTransformMakeSkew(CGFloat skewAmount) 
{ 
    CGAffineTransform skewTransform = CGAffineTransformIdentity; 
    skewTransform.b = skewAmount; 
    return skewTransform; 
} 

然後，歪斜等那些垂直的東西與水平線成45度角：

layer.affineTransform = CGAffineTransformMakeSkew(1.0f); 

Answer 3

可以使用矩陣運算來轉換CALayers。偏斜變換，如果你想要做一個傾斜變形沿x軸，您可以使用下面的示例由以下矩陣

如此表示。

CALayer* layer = [CALayer layer]; 
layer.frame = CGRectMake(50,50,50,50); 
layer.backgroundColor = [UIColor blueColor].CGColor; 
[self.window.layer addSublayer:layer]; 

float theta = -45.0f; 
CGAffineTransform t = CGAffineTransformIdentity; 
t.b = tan(theta*M_PI/180.0f); 
layer.transform = CATransform3DMakeAffineTransform(t); 

下面的示例將導致如下所示

層

Answer 4

有關於如何轉變工作了大量的資源，它需要一點時間來真正瞭解他們（至少對我來說），這裏有一些直接的代碼，它確保指出應用了變換的軸。

/*! 
* Positive `skewX` creates a shift to the left. 
* Negative `skewX` creates a shift to the right. 
* 
* `skewX` is NOT pixel based. Test values of 0.0f - 1.0f. 
*/ 
CGAffineTransform CGAffineTransformMakeSkewX(CGFloat skewX) 
{ 
    return CGAffineTransformMakeSkew(skewX, 0.0f); 
} 

/*! 
* Positive `skewY` creates a shift to the bottom. 
* Negative `skewY` creates a shift to the top. 
* 
* `skewY` is NOT pixel based. Test values of 0.0f - 1.0f. 
*/ 
CGAffineTransform CGAffineTransformMakeSkewY(CGFloat skewY) 
{ 
    return CGAffineTransformMakeSkew(0.0f, skewY); 
} 

/*! 
* Positive `skewX` creates a shift to the left. 
* Negative `skewX` creates a shift to the right. 
* 
* Positive `skewY` creates a shift to the bottom. 
* Negative `skewY` creates a shift to the top. 
* 
* The skew values are NOT pixel based. Test values of 0.0f - 1.0f. 
*/ 
CGAffineTransform CGAffineTransformMakeSkew(CGFloat skewX, CGFloat skewY) 
{ 
    return CGAffineTransformMake(1.0f, skewY, skewX, 1.0f, 0.0f, 0.0f); 
}