iPhone歪斜了一个CALayer答案

【问题标题】：iPhone skew a CALayeriPhone歪斜了一个CALayer
【发布时间】：2011-09-06 10:04:32
【问题描述】：

我是初学者，我正在做一些练习以熟悉 CALayer ...

我只想知道如何“倾斜”（或倾斜）CALayer 45° 角？

谢谢。

【问题讨论】：

您需要将其中一个答案标记为正确。

标签： iphone calayer

【解决方案1】：

有很多关于转换如何工作的资源，真正理解它们需要一些时间（至少对我而言！），这里有一些直截了当的代码，可以确保指出哪个轴应用了变换。

/*!
 * 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);
}

【讨论】：

【解决方案2】：

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);

以下示例将生成如下所示的图层

【讨论】：

你的 3 个回答对我很有用，让我继续练习！！
我在寻找 tan(theta*M_PI/180.0f)。谢谢你。

【解决方案3】：

您可以这样做，但您必须弄乱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 );

检查我的数学。应该是对的。

【讨论】：

【解决方案4】：

CALayers 有一个属性affineTransform，它接受CAAffineTransform。该文档明确指出：

缩放、旋转和平移是最常用的操作仿射变换支持，但是也可以倾斜。

（显然是我的重点）

没有构建倾斜变换的内置助手，但您可以执行类似（未经测试）的操作：

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

然后，对于垂直的东西与您要使用的水平成 45 度的倾斜：

layer.affineTransform = CGAffineTransformMakeSkew(1.0f);

【讨论】：