パラパラまんが (画像 → 映像)

導入
準備
サンプルプログラム
問題

1. 導入

何枚かの画像をつなげて、次のようなムービーを作成してみましょう。

構成画像：

1.jpg	2.jpg	3.jpg	4.jpg
5.jpg	6.jpg	7.jpg	8.jpg

2. 準備

まず、画像群をダウンロードし、展開します。

| aString aURL aFilename aTGZ aDirectory aFileBrowser aWindow |
aString := 'http://www.cc.kyoto-su.ac.jp/~atsushi/Programs/VisualWorks/Exercises/Exercise_ParaPara/ParaPara.tgz'.
aURL := JunURL named: aString.
aURL exists ifFalse: [^nil].
aFilename := Filename defaultDirectory construct: aURL asURI tail.
aURL downloadTo: aFilename.
aFilename exists ifFalse: [^nil].
aTGZ := JunTGZ named: aFilename asString.
aTGZ extractTo: Filename defaultDirectory asString.
aDirectory := Filename defaultDirectory construct: 'ParaPara'.
aDirectory := aDirectory construct: 'Dora'.
aFileBrowser := #{Tools.FileTools.FileBrowser} value new.
aFileBrowser open.
aWindow := aFileBrowser builder ifNil: [^nil] ifNotNil: [:aBuilder | aBuilder window].
aWindow displayBox: (JunGeometry alignedBoxWithScreenCenter: 800 @ 600).
aFileBrowser
    expandToDirectory: aDirectory;
    selectDirectory: aDirectory

次に、サンプルプログラムのソースをファイルインします。

| aString aURL aFilename aBrowser aWindow aPackage aNavigator aClass aProtocol aSelector |
aString := 'http://www.cc.kyoto-su.ac.jp/~atsushi/Programs/VisualWorks/Exercises/Exercise_ParaPara/Exercise-ParaPara.st'.
aURL := JunURL named: aString.
aURL exists ifFalse: [^nil].
aFilename := Filename defaultDirectory construct: aURL asURI tail.
aURL downloadTo: aFilename.
aFilename exists ifFalse: [^nil].
aFilename fileIn.
aBrowser := #{Refactory.Browser.RefactoringBrowser} value open.
aWindow := aBrowser builder ifNil: [^nil] ifNotNil: [:aBuilder | aBuilder window].
aWindow displayBox: (JunGeometry alignedBoxWithScreenCenter: 800 @ 600).
aPackage := Store.Registry packageNamed: 'Foo-ParaPara'.
aPackage ifNil: [^nil].
aNavigator := aBrowser navigator.
aNavigator selectPundle: aPackage.
aClass := #{ParaParaManga} value class.
aProtocol := #examples.
aSelector := #example0.
(aNavigator state)
    classesAndNameSpaces: (Array with: aClass);
    protocols: (Array with: aProtocol);
    selectors: (Array with: aSelector).
aNavigator
    setState: aNavigator state;
    changed

3. サンプルプログラム

サンプルプログラムを見てみましょう。
ParaParaManga クラスの examples カテゴリに登録されています。
システムブラウザで、「Foo-ParaPara」→「ParaParaManga」→ class タブ選択 →「examples」をたどってください。

example0 ：ムービー表示
example1 ：画像表示
example2 ：画像(１枚) → ムービー
example3 ：画像(複数枚) → ムービー
example4 ：繰り返し&インターバル設定

example0 ：ムービー表示

ムービー（GIFアニメーションファイル）をカートゥーンムービー（パラパラまんが）として開いて表示します。

プログラム："ParaParaManga example0."

| aFilename aMovie |
aFilename := Filename defaultDirectory construct: 'Doraemon.gif'.
aFilename exists ifFalse: [^nil].
aMovie := JunCartoonMovie filename: aFilename.
aMovie ifNil: [^nil].
aMovie
    oneWay;
    openLightWeightWindowSpec.
^aMovie

example1 ：画像表示

JPEG 画像を読み込んで表示します。

プログラム："ParaParaManga example1."

| aDirectory aFilename anImage |
aDirectory := Filename defaultDirectory construct: 'ParaPara'.
aDirectory := aDirectory construct: 'Dora'.
aFilename := aDirectory construct: '1.jpg'.
aFilename exists ifFalse: [^nil].
anImage := JunImageUtility fromFile: aFilename.
JunImageUtility show: anImage.
^anImage

example2 ：画像(１枚) → ムービー

１枚の画像をムービーにします。

プログラム："ParaParaManga example2."

| aFilename aGenerator |
aFilename := Filename defaultDirectory construct: 'Doraemon.gif'.
aGenerator := JunImagesToGifAnimation
    filename: aFilename
    extent: 296 @ 272.
aGenerator
    do:
        [| aDirectory |
        aDirectory := Filename defaultDirectory construct: 'ParaPara'.
        aDirectory := aDirectory construct: 'Dora'.
        aFilename := aDirectory construct: '1.jpg'.
        aFilename exists
            ifTrue:
                [| anImage |
                anImage := JunImageUtility fromFile: aFilename.
                aGenerator addImage: anImage framesPerSecond: 1]].
^aGenerator

example3 ：画像(8枚) → ムービー

8枚の画像をムービーにします。1fps（frames per second）で。

プログラム："ParaParaManga example3."

| aFilename aGenerator |
aFilename := Filename defaultDirectory construct: 'Doraemon.gif'.
aGenerator := JunImagesToGifAnimation
    filename: aFilename
    extent: 296 @ 272.
aGenerator
    do:
        [| aDirectory |
        aDirectory := Filename defaultDirectory construct: 'ParaPara'.
        aDirectory := aDirectory construct: 'Dora'.
        (1 to: 8 by: 1)
            do:
                [:aNumber | 
                | aString |
                aString := aNumber printString , '.jpg'.
                aFilename := aDirectory construct: aString.
                aFilename exists
                    ifTrue:
                        [| anImage |
                        anImage := JunImageUtility fromFile: aFilename.
                        aGenerator addImage: anImage framesPerSecond: 1]]].
^aGenerator

example4 ：繰り返し&インターバル設定

さらに（8枚を4回）繰り返して、適正なインターバル（5fps）も考慮します。

プログラム："ParaParaManga example4."

| aFilename aGenerator |
aFilename := Filename defaultDirectory construct: 'Doraemon.gif'.
aGenerator := JunImagesToGifAnimation
    filename: aFilename
    extent: 296 @ 272.
aGenerator
    do:
        [| aDirectory |
        aDirectory := Filename defaultDirectory construct: 'ParaPara'.
        aDirectory := aDirectory construct: 'Dora'.
        4
            timesRepeat:
                [(1 to: 8 by: 1)
                    do:
                        [:aNumber | 
                        | aString |
                        aString := aNumber printString , '.jpg'.
                        aFilename := aDirectory construct: aString.
                        aFilename exists
                            ifTrue:
                                [| anImage |
                                anImage := JunImageUtility fromFile: aFilename.
                                aGenerator addImage: anImage framesPerSecond: 5]]]].
^aGenerator

4. 問題

8枚の画像から8fpsのムービーを作成した後、カートゥーンムービー（パラパラまんが）として開き、繰り返し再生を始めるプログラムを作成してください。

プログラム："ParaParaManga example5."

Updated: 2011/11/19 (Created: 2008/04/01)