iOS開發基礎-序列幀動畫之Tom貓

  新建一個Single View Application,向該工程中導入Tom貓的圖片資源,本示例演示Tom貓喝牛奶的動做。圖片的名字爲 drink_00.jpg、drink_01.jpg、...、drink_80.jpg 。html

  向 Main.storyboard 中添加 UIImageView ,將圖片 drink_00.jpg 做爲默認顯示的畫面。將該控件與 ViewController 類創建一個 IBOutlet 鏈接,屬性名爲: @property (weak, nonatomic) IBOutlet UIImageView *tomCat; 數組

  再添加大小爲60*60的 UIButton 控件,將控件的名字設爲 drink ,標題文字顏色爲 Clear Color ,再將圖片 milk.png 做爲該按鈕的背景圖片。將該按鈕控件與 ViewController 類創建一個 IBAction 動做鏈接,方法爲 - (IBAction)buttonClicked:(id)sender; 。動畫

  在 ViewController.m 中添加以下代碼實現序列幀動畫:atom

 1 //ViewController.m
 2 - (void)playAnimation:(int)count fileName:(NSString *)fileName {
 3     //建立可變數組存放序列幀圖片
 4     NSMutableArray *images = [NSMutableArray array];
 5     for (int i = 0; i < count; i++) {
 6         // 圖片名。%02d -- 當整數位數小於兩位時,在前面自動補1個零
 7         NSString *name = [NSString stringWithFormat:@"%@_%02d.jpg", fileName, i];
 8         NSString *path = [[NSBundle mainBundle] pathForResource:name ofType:nil];
 9         UIImage *img = [[UIImage alloc] initWithContentsOfFile:path];
10         [images addObject:img];
11     }
12     self.tomCat.animationImages = images;
13     self.tomCat.animationRepeatCount = 1;
14     self.tomCat.animationDuration = count * 0.1;
15     [self.tomCat startAnimating];
16 }
17 
18 - (IBAction)buttonClicked:(id)sender {
19     //若是正在播放動畫則直接返回
20     if (self.tomCat.isAnimating) {
21         return;
22     }
23     int count = 81;     //圖片數量
24     NSString *title = @"drink";
25     //播放動畫
26     [self playAnimation:count fileName:title];
27 }

效果圖以下:spa

參考博客:iOS開發UI篇—iOS開發中三種簡單的動畫設置3d

實例代碼:http://pan.baidu.com/s/1pKgR56Vcode

相關文章
相關標籤/搜索