読者です 読者をやめる 読者になる 読者になる

Swift,Objective-Cプログラミング ~ iOS ~

Objective-C,Swift,Apple Watchなどのプログラミング

【iOS Swift入門 #234】GIFアニメーションを再生するサンプル(FLAnimatedImage)

GIFアニメーションを再生するには?

Flipboardが公開しているFLAnimatedImageを使うと簡単。github.com


使い方は下記の通り。
①FLAnimatedImageのイニシャライザにGIFアニメーションデータを渡し、初期化。
②作成したFLAnimatedImageオブジェクトをFLAnimatedImageViewに渡す
③FLAnimatedImageViewを画面に追加

↓のソースを見ると簡単に使えるのがわかる。

FLAnimatedImage *image = [FLAnimatedImage animatedImageWithGIFData:GIFアニメーションデータ];
FLAnimatedImageView *imageView = [[FLAnimatedImageView alloc] init];
imageView.animatedImage = image;
imageView.frame = view.bounds;
[self.view addSubview:imageView];

GIFアニメーションを使ったログイン画面サンプルを作る。
(Uberでやってるのを見てかっこよかったので、やってみた)

↓の動画のとおり。


■実装
GIFアニメーションのファイルを持っていない方は
下記のサンプルプロジェクト内にある「Top2.gif」を使うといい。
SampleTopAnimation.zip - Google ドライブ


1.GIFアニメーション再生のため、ライブラリ追加

pod 'FLAnimatedImage', '~> 1.0'
||

<b>2.Bridging-Headerファイルにimport文を追加</b>
FLAnimatedImageObjective-Cで作成されているので、
Swiftで使用するためにはBridging-Headerファイルにimport文を追加する必要があります。

>|swift|
#import "FLAnimatedImage.h"
#import "FLAnimatedImageView.h"

3.画面にGIFアニメーションを表示するコードを書く
デフォルトで作成されるViewController.swift
GIFアニメーションを表示するようにしました。

import UIKit

class ViewController: UIViewController {
    let backgroundAnimationImage = FLAnimatedImageView()


    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        let path = NSBundle.mainBundle().pathForResource("top2", ofType: "gif")!
        let url = NSURL(fileURLWithPath: path)!
        let animatedImage = FLAnimatedImage(animatedGIFData: NSData(contentsOfURL: url))

        backgroundAnimationImage.animatedImage = animatedImage
        backgroundAnimationImage.frame = view.bounds
        view.insertSubview(backgroundAnimationImage, atIndex: 0)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

4.実行する
ちなみに「Sign in」ボタンと「Sign up」ボタンはStoryboardで追加しています。
Storyboardでボタンを追加していない方はボタンが表示されない。

上記動画のようになるはず。

うまくいかなかった方はこちらからサンプルプロジェクトを
ダウンロードし試してみよう。
SampleTopAnimation.zip - Google ドライブ



■おわりに
Chrome Castが安い。

Google Chromecast ( Wi-Fi経由 テレビ接続 ストリーミング / HDMI / 802.11b/g/n / 1080p ) GA3A00035A16


【参考情報】
iOSアプリ開発未経験の人向け
iOSアプリ開発をはじめたとき最初に買った書籍
【アプリ作成未経験の人向け】
Storyboardを使って画面を作成していく。
手順にしたがって操作していくと、ボタンの作成やWebViewの作成などができる。
アプリって、こんな感じで作るんだというのを体験できる。

Swiftではじめる iPhoneアプリ開発の教科書 【iOS 8&Xcode 6対応】

Swiftではじめる iPhoneアプリ開発の教科書 【iOS 8&Xcode 6対応】

・わかりやすくていい、と聞いた本
立ち読みした感じだと【アプリ作成未経験の人向け】

絶対に挫折しない iPhoneアプリ開発「超」入門【Swift & iOS8.1以降 完全対応】

絶対に挫折しない iPhoneアプリ開発「超」入門【Swift & iOS8.1以降 完全対応】

②を終えたくらいの知識の方向け
・アプリ開発独学中に2冊めに購入した書籍
プログラミング知識はなくても、若干理解するのに時間がかかる程度で、
読み進められるわかりやすさがある。

iPhoneアプリ開発塾

iPhoneアプリ開発塾

③中級者、上級者向け

詳解 Swift

詳解 Swift