Gjs で Clutter Timeline
タイマーアプリを Gjs と Clutter で作ってみた。これって、 GLib 使うのが一般的なのだが、 Clutter.Timeline で簡単にできたので公開。
ほとんどは、いつもどおりなので、timelineだけ説明する。
const Clutter = imports.gi.Clutter; Clutter.init(null); let stage = Clutter.Stage.get_default(); stage.set_title("Timeline Test"); stage.set_size(200, 200); stage.set_background_color(new Clutter.Color({red:0, blue:0, green:0, alpha:255})); stage.connect('destroy', Clutter.main_quit); let actor = new Clutter.Actor(); actor.set_size(50, 50); actor.set_position(50, 50); actor.set_background_color(new Clutter.Color({red:0, blue:255, green:0, alpha:255})); stage.add_actor(actor); let timeline = new Clutter.Timeline({duration:1000}); timeline.set_loop(true); timeline.connect('completed', function() {actor.set_position(200 * Math.random(), 200 * Math.random())}); timeline.start(); stage.show(); Clutter.main();
ここで重要なのは、以下のところ
let timeline = new Clutter.Timeline({duration:1000}); timeline.set_loop(true); timeline.connect('completed', function() {actor.set_position(200 * Math.random(), 200 * Math.random())}); timeline.start();
Clutter.Timeline の duration(ms)を作成し、無限ループにして、completeイベント発生時に actor をランダムに動かすだけ。設定が終われば start() メソッドを呼びだせば完成。
devhelp を見ると、"Defining Timelines in ClutterScript"というのがあり、JSON 表記で設定できることが分かる。また、 "ClutterAnimationMode" というのがあり、tweener 風味の動作をさせることも可能っぽい。
ベクター画像の描画や3D 2D の表示は簡単にできそう。今後はラスタ画像の処理を調べてみる。