Android+KotlinでGIF動画をフレーム分割⇒画像保存する方法

AndroidでGif動画をこのように扱いたい

GIF動画をフレームに分割
それぞれを画像として保存する

ここでのGIFとはアニメGIFのことです。

アニメGIFはパラパラ漫画のコマとして分割し、
その各フレームをPNG画像として保存したかったです。

その方法がようやくわかったので、
AndroidでGIFを画像保存するKotlinコード例を紹介！

このページの目次

１．GifDrawableというライブラリを導入する
２．GIF動画を外部ピッカーから選択してもらう
３．GIF動画を分割して全フレームを画像保存
４．実際にGIF動画をフレーム分割保存してみた

１．GifDrawableというライブラリを導入する

Android標準でGIFを扱えるAPIはありません。
だから優秀な外部ライブラリに頼ることにします。

その名も android-gif-drawable というライブラリ

次のGitHubページで公開されています。

▼ Github : koral--/android-gif-drawable

GitHub

GitHub - koral--/android-gif-drawable: Views and Drawable for displaying anim...

https://github.com/koral--/android-gif-drawable

Views and Drawable for displaying animated GIFs on Android - GitHub - koral--/android-gif-drawable: Views and Drawable for displaying animated GIFs on Android

▼ Android Studio : build.gradleに以下を追加

/// Gif drawable
implementation 'pl.droidsonroids.gif:android-gif-drawable:1.2.24'

1 2	/// Gif drawable implementation 'pl.droidsonroids.gif:android-gif-drawable:1.2.24'

最新バージョンは1.2.24の模様。
ライセンスもMITライセンスだから安心です。

２．GIF動画を外部ピッカーから選択してもらう

ここから具体的なコード部分です。

まずGIF動画をアプリ側で選択させる処理を書きます。

▼ ちょうどこのようなコード例

 val openVideoLauncher = registerForActivityResult(
     ActivityResultContracts.StartActivityForResult()
 ) { result ->
     if (result.resultCode == Activity.RESULT_OK && result.data != null) {
         val uri: Uri? = result.data?.data
         
         /// GIFをフレーム毎に画像保存する処理
         /// 後述するのでスルーしてOK
         splitGifToImages(uri)
     }
 }
 
 val intent = Intent(Intent.ACTION_OPEN_DOCUMENT)
 intent.type = "image/gif"
 val title = "Select animated GIF"
 val chooser = Intent.createChooser(intent, title)
 openVideoLauncher.launch(chooser)

val openVideoLauncher = registerForActivityResult(

ActivityResultContracts.StartActivityForResult()

) { result ->

if (result.resultCode == Activity.RESULT_OK && result.data != null) {

val uri: Uri? = result.data?.data

/// GIFをフレーム毎に画像保存する処理

/// 後述するのでスルーしてOK

splitGifToImages(uri)

}

val intent = Intent(Intent.ACTION_OPEN_DOCUMENT)

intent.type = "image/gif"

val title = "Select animated GIF"

val chooser = Intent.createChooser(intent, title)

openVideoLauncher.launch(chooser)

ここでは ACTION_OPEN_DOCUMENT を使ってます。

▼ ACTION_OPEN_DOCUMENTの扱いについて

AndroidのIntentから複数画像選択を行う【ACTION_OPEN_DOCUMENT】

そしてIntentから外部のファイルピッカーを起動し、その結果を registerForActivityResult() からURIとして取得しています。

もちろん Activity#onActivityForResult() を実装してもいいのですが、Kotlinでは registerForActivityResult() を使って結果を受け取るのがベストな方法みたいです。

３．GIF動画を分割して全フレームを画像保存

最後にGIF動画を分割します。

そして全フレームをPNG画像で保存してみます。

▼ そのために定義したメソッドコード例

private fun splitGifToImages(uri: Uri?){
    /// GIF動画URIをGifDrawableに変換
    val gif = GifDrawable(contentResolver, uri!!)
    /// GIF動画の最終フレームインデックス取得
    val lastFrameIndex = gif.numberOfFrames-1
    /// ひたすら各フレームを画像保存していく
    for(i in 0..lastFrameIndex){
        val thread = Thread {
            /// i番目のフレームをBitmapで取得
            val bitmap = gif.seekToFrameAndGet(i)
            /// アプリの外部ディレクトリに保存
            val f = File(
                getExternalFilesDir(
                    Environment.DIRECTORY_MOVIES
                ), "frame${i}.png"
            )
            if (!f.exists()) f.createNewFile()
            /// 実際にファイルに画像データを書き込み
            val byteArrayOutputStream = ByteArrayOutputStream()
            bitmap!!.compress(Bitmap.CompressFormat.PNG, 50, byteArrayOutputStream)
            val byteArray: ByteArray = byteArrayOutputStream.toByteArray()
            f.writeBytes(byteArray)
        }
        thread.start()
    }
}

private fun splitGifToImages(uri: Uri?){

/// GIF動画URIをGifDrawableに変換

val gif = GifDrawable(contentResolver, uri!!)

/// GIF動画の最終フレームインデックス取得

val lastFrameIndex = gif.numberOfFrames-1

/// ひたすら各フレームを画像保存していく

for(i in 0..lastFrameIndex){

val thread = Thread {

/// i番目のフレームをBitmapで取得

val bitmap = gif.seekToFrameAndGet(i)

/// アプリの外部ディレクトリに保存

val f = File(

getExternalFilesDir(

Environment.DIRECTORY_MOVIES

), "frame${i}.png"

)

if (!f.exists()) f.createNewFile()

/// 実際にファイルに画像データを書き込み

val byteArrayOutputStream = ByteArrayOutputStream()

bitmap!!.compress(Bitmap.CompressFormat.PNG, 50, byteArrayOutputStream)

val byteArray: ByteArray = byteArrayOutputStream.toByteArray()

f.writeBytes(byteArray)

}

thread.start()

}

何をしているかはコメント参照。

先ほど導入したGifDrawableを使ってURIからGifDrawableに変換、そのあと１枚１枚のフレームをPNG画像として保存しているだけです。

４．実際にGIF動画をフレーム分割保存してみた

ひとまず適当なGIF動画を用意してみました。

▼ URL : http://tsukikoya.com/sample-gif-image/

これを先ほどのコードでフレーム分割。

各フレームをPNG画像として保存を試しました。

▼ 問題なくフレーム分割＆保存ができた！

▼ 当環境では次のディレクトリに保存された

/storage/emulated/0/Android/data/[アプリパッケージ名]/files/Movies/frame0.png

1	/storage/emulated/0/Android/data/[アプリパッケージ名]/files/Movies/frame0.png

保存先はアプリの外部ディレクトリです。

しっかり全フレーム漏らさず画像保存できてました。

Android+KotlinでGIF動画をフレーム分割⇒画像保存する方法

１．GifDrawableというライブラリを導入する

２．GIF動画を外部ピッカーから選択してもらう

３．GIF動画を分割して全フレームを画像保存

４．実際にGIF動画をフレーム分割保存してみた

関連記事

プロフィール

人気記事

検索してみる