以前のstackoverflowの提案に基づいて、CATransformLayerに追加されたCALayersを使用してトランプを作成しようとしています。アイデアは、前面と背面のCALayerを作成し、それらをCATransformLayerで結合して、適切な面が自動的に表示されるように回転、反転などできるようにすることです。以下は、前面が緑色で背面が赤色の単一のカードを作成しようとしているコードの例です。
赤い後ろはY軸を中心に反転し、緑の前とは反対側を向いています。緑のフロントキャレイヤーは、赤のバックよりも「高い」Z位置にあります。
ただし、変換を実行すると、カードが反転していない状態のように見えるだけです。私がここで間違っているアイデアはありますか?
#define DEGREES_TO_RADIANS(angle) (angle * M_PI / 180.0)
- (void)viewDidLoad
{
[super viewDidLoad];
CATransformLayer *cardContainer = [CATransformLayer layer];
cardContainer.bounds = CGRectMake(0,0, 150,200);
CALayer *cardFront = [CALayer layer];
cardFront.frame = cardContainer.bounds;
cardFront.backgroundColor = [UIColor greenColor].CGColor;
cardFront.borderColor = [UIColor blackColor].CGColor;
cardFront.borderWidth = 2.0;
cardFront.cornerRadius = 30.0;
cardFront.zPosition = 2; // Put front of card on top relative to back of card
cardFront.doubleSided = NO;
[cardContainer addSublayer:cardFront];
CALayer *cardBack = [CALayer layer];
cardBack.frame = cardContainer.bounds;
cardBack.backgroundColor = [UIColor redColor].CGColor;
cardBack.zPosition = 1;
cardBack.doubleSided = NO;
// Flip cardBack image so it is facing outward and visible when flipped
cardBack.transform = CATransform3DMakeRotation(DEGREES_TO_RADIANS(180),0.0,1.0,0.0);
[cardContainer addSublayer:cardBack];
UIView* cardView = [[UIView alloc] initWithFrame:cardContainer.bounds];
cardView.center = CGPointMake(self.view.center.x, self.view.center.y);
[cardView.layer addSublayer:cardContainer];
[self.view addSubview:cardView];
// Show the card flipped over (desired the red side to be showing, but instead shows green)
cardView.layer.transform = CATransform3DMakeRotation(DEGREES_TO_RADIANS(180),0.0,1.0,0.0);
}