2012年12月10日 星期一

Core Animation的基本使用(十ㄧ)

Layer的幾何設定



CALayer geometry properties



 Layer的錨點

 錨點設定例,由實作發現,錨點設定似乎與官方圖示相反???(0,0) 在左上,(0,1)在左下。


Three anchorPoint values  


 錨點的作用

Layer Origin of (0.5,0.5)

Layer Origin of (0.0,0.0)

 

example code

    pinLayer = [CALayer layer];
    pinLayer.bounds = CGRectMake(0, 0, 72, 54);
    pinLayer.contents = (id)[UIImage imageNamed:@"pin.png"].CGImage;
    pinLayer.position = CGPointMake(150, 150);
    pinLayer.anchorPoint = CGPointMake(1.0, 1.0);



以下是實作例,延續前一篇的專案。

1.在storyboard加上一個Button
 
 2. 在mainViewController.h加入Button的註冊,及另一個CGPoint的變數。
@property (nonatomic) CGPoint anchorPointSetting;
@property (weak, nonatomic) IBOutlet UIButton *anchorPointButton;


3. 在mainViewController.m加入所需程式碼

@synthesize anchorPointSetting;
@synthesize anchorPointButton;

int changeAnchorPoint = 0;

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
   
    layer = [CALayer layer];
    layer.bounds = CGRectMake(0, 0, 200, 200);
    layer.position =  ORGINAL_POSITION;   ///CGPointMake(500, 300);
    layer.backgroundColor = [UIColor redColor].CGColor;
    layer.borderColor = [UIColor blackColor].CGColor;
    layer.opacity = 1.0f;
    [self.view.layer addSublayer:layer];
   
    actionsSwitch.on = NO;
   
    UIImage *image = [UIImage imageNamed:@"TaiwanMap.jpg"];
   
    UIImageView *a1 = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 200,200)];
   
    [a1 setImage:image];
   
      layer2 = [CALayer layer];
    //layer2.contents = (id)image.CGImage;
    layer2.contents = (id) a1.image.CGImage;
    layer2.bounds = CGRectMake(0, 0, 200, 200);
    layer2.position = CGPointMake(350, 650);
   
    anchorPointSetting = CGPointMake(0.0, 0.0);   
    

   [self.view.layer addSublayer:layer2];
   
    pauseState = NO;
}


- (IBAction)changeAnchor:(id)sender {
   
    changeAnchorPoint ++;
   
    if (changeAnchorPoint>=4)
        changeAnchorPoint = 0;
   
    switch (changeAnchorPoint) {
        case 0:
            layer2.anchorPoint = CGPointMake(0,0);
            [anchorPointButton setTitle:@"anchor(0,0)" forState:UIControlStateNormal];
            break;
           
        case 1:
            layer2.anchorPoint = CGPointMake(1,0);
            [anchorPointButton setTitle:@"anchor(1,0)" forState:UIControlStateNormal];
            break;
       
        case 2:
            layer2.anchorPoint = CGPointMake(1,1);
            [anchorPointButton setTitle:@"anchor(1,1)" forState:UIControlStateNormal];
            break;
       
        case 3:
            layer2.anchorPoint = CGPointMake(0,1);
            [anchorPointButton setTitle:@"anchor(0,1)" forState:UIControlStateNormal];
            break;
           
           
        default:
           
            layer2.anchorPoint = CGPointMake(0,0);
            [anchorPointButton setTitle:@"anchor(0,0)" forState:UIControlStateNormal];
           
            break;
    }
   
}

 


4. 結果圖,圖一為原始狀態,一旦更動anchorPoint就會讓圖的參考點改變(不需其他動作)。此處又做了一次的RotateX作測試。最後使用Scale做了暫停的測試,在animation暫停時,anchorPoint的變動無作用,但是動作中是可以跟anchorPoint的更動而改變參考點








 

沒有留言: