mieki256's diary

• 今敏監督の、「妄想代理人」制作メモ内に、「スポッティングシート」という単語が出てくるので、少なくとも2003年頃には「あるのが当たり前」になっていたらしい。
• 片渕須直監督が、テレコムで「リトルズ」(1983-1985年)を作ってた頃の回顧録中に、「スポッティングシート」という単語は無いものの、「スポッティング」という単語が出てきている。そこから想像するに、どうやら1980年代ですら似たようなものが存在していた可能性がありそう。
• そもそも、オープンリールテープを使って作ってた時期があるらしいから…。

• ストップウォッチ片手にさっさと作業を始めて、見事な神業を披露。
• 「PCとソフト貸して。こっちで調べるから」と、ニュータイプぶりを発揮。
• 「ココとココとココの時間だけシートにして」と、実に監督らしく的確な指示を出してくる。
• 「編集さんのほうでイイ感じに合わせちゃって」と丸投げ。ていうかスタッフの力を完全に信頼。

• Mキーを押すとマーカーをつけられる。
• TABキーで次のマーカー位置、Shift+TABキーで前のマーカー位置に再生開始位置を動かせる。
• Tools → Slicing/Region → Set maker at * で、BPM指定その他で自動でマーカーをつけられる。

• .fla の中身がさっぱり分からず。.fla はバイナリ形式の上に、フォーマット仕様も公開されてない。解析作業とかやってられない。
• 最近は、.fla をxml化してzipでまとめただけの .xfl というファイルフォーマットもある。これも資料が少ない・ほとんど公開されてない。
• テキストデータ(.xml)から .swf(Flashの再生用ファイルフォーマット)を作ることはできる。ming や swfmill を使えばいい。
• しかし、.swf は、Flash CS* 等で編集できない。編集するためには、.swf から .fla を作る、デコンパイラが必要。
• そもそも、Flash CS*でしか読み込めない .fla や .xfl を作ってもアレかなという気もしてきた。フリーで使えるFlash作成ソフトの、ParaFla や Suzuka で読めないと、使い道が限定されそう。

identify -verbose hoge.png

                      user     system      total        real
xml parse:        0.016000   0.000000   0.016000 (  0.023001)
get fps           0.000000   0.000000   0.000000 (  0.002000)
load image:       0.952000   0.172000   1.124000 (  1.161067)
load shape:       0.015000   0.000000   0.015000 (  0.006000)
load sprite:      0.000000   0.000000   0.000000 (  0.008000)
root tmline:      0.031000   0.000000   0.031000 (  0.031002)

• 金を払って他所に苦労を押し付けるか。
• 金を惜しんで自分で苦労を背負うか。

■利用について

PMCAによって生成されたモデルの利用許諾は、モデルの組み立てに使われたパーツの利用許諾に準じます。

PMCAに付属しているパーツは全てパブリックドメイン相当とし、その利用に制限を求めません。また、作者はパーツを利用した事によって生じた損害に対し一切の責任を負いません。

mato.sus304さんのぶろぐ PMCAv0.0.6について より

TuneちゃんMMDモデルの使用要件は簡単！ 作品紹介で「G-Tuneちゃん」を紹介するだけ！ 商用・非商用フリー！改造・改変制限なし！ 使用報告も必要なし！

TuneちゃんMMDモデルデータ無償配布開始！｜G-Tune −ハイエンド ゲームPC ブランド− より

■禁止事項
・反社会的な行為や目的、特定の信条や宗教、政治的発言のために弊社キャラクターを使用することを禁止します。
・弊社キャラクター、弊社、弊社が提供する製品およびサービスの名誉と品位を傷つける目的で使用することを禁止します。
・弊社による別途認可を受けた場合を除き、弊社公式製品のような誤解を招く利用をすることを禁止します。
・第三者の知的財産権およびその他一切の権利を損なう行為、またはかかる権利を損なう目的のために使用することを禁止します。

TuneちゃんMMDモデルデータ無償配布開始！｜G-Tune −ハイエンド ゲームPC ブランド− より

一般的な組み込みでの使用については、特に制限を行なうことは考えていません。元データの改変、改造、キャラクターの２次創作作品なども自由に公開して頂いて構いません。ルールを守って、ぜひ楽しいオリジナル作品を製作してください。

この素材は、Hot Soup Processor(HSP)とともに使用され、HSPの普及と発展に寄与することを願っています。意図的にイメージを悪化させることを目的とした使用、違法行為、迷惑行為、不正行為を助長する目的に使用しないでください。 また、3D素材 "珠音（たまね）"データのみを販売するなど、著作権を侵害する形での使用は禁止致します。

HSP3オフィシャル3D素材 "珠音（たまね）" より

require 'dxruby'

# 二次ベジェ曲線を描画するクラス
class BezierDraw
  DBG = true

  # 二次ベジェ曲線を描画するための頂点リストを生成
  #
  # @param [Number] x1 始点 x 座標
  # @param [Number] y1 始点 y 座標
  # @param [Number] x2 制御点 x 座標
  # @param [Number] y2 制御点 y 座標
  # @param [Number] x3 終点 x 座標
  # @param [Number] y3 終点 y 座標
  # @return [Array] ベジェ曲線を描画するための頂点座標配列
  #
  def BezierDraw.calc(x1, y1, x2, y2, x3, y3)
    p = []
    p.push([x1, y1])
    t = 0.05
    while t < 1.0
      v = 1.0 - t
      a = v * v
      b = 2 * v * t
      c = t * t
      x = a * x1 + b * x2 + c * x3
      y = a * y1 + b * y2 + c * y3
      p.push([x, y])
      t += 0.05
    end
    p.push([x3, y3])
    return p
  end

  # ベジェ曲線を描画
  #
  # @param [Object] img Imageオブジェクト
  # @param [Array] p 頂点座標配列
  # @param [Array] lcol 色配列。A,R,G,B が入ってる。
  #
  def BezierDraw.draw(img, p, lcol)
    (p.size - 1).times do |i|
      j = i + 1
      img.line(p[i][0], p[i][1], p[j][0], p[j][1], lcol)
    end
  end
end

if $0 == __FILE__
  # ----------------------------------------
  # 動作テスト

  img = Image.new(640, 480)
  p = [[30, 240], [300, 10], [600, 400]]
  lcol = [255, 255, 0, 0]

  Window.loop do
    break if Input.keyPush?(K_ESCAPE)

    p[1] = Input.mousePosX, Input.mousePosY

    x0, y0 = p[0]
    for i in 1..2 do
      x1, y1 = p[i]
      Window.drawLine(x0, y0, x1, y1, [128, 128, 128])
      x0, y0 = x1, y1
    end

    img.clear
    x1, y1 = p[0]
    x2, y2 = p[1]
    x3, y3 = p[2]
    np = BezierDraw.calc(x1, y1, x2, y2, x3, y3)
    BezierDraw.draw(img, np, lcol)
    Window.draw(0, 0, img)
  end
end

require 'dxruby'

# 与えられた多角形で塗りつぶしをするクラス
#
# @note 以下のページを参考にしました。
#       多角形塗りつぶし(1)
#       http://azskyetc.client.jp/paintprog/031_polygon1.html
#
class PolyFill

  # 塗り潰しをする
  #
  # @param [Object] img Imageオブジェクト
  # @param [Array] np 頂点座標配列 ((x,y), (x,y), ...)の形で入っている。
  # @param [Array] f0col 塗り潰しに使う色配列
  # @param [Array] f1col 塗り潰しに使う色配列
  # @param [Boolean] clip_enable trueなら画面サイズを超えた部分の描画をしない
  #
  def PolyFill.fill(img, np, f0col, f1col, clip_enable = true)

    return if np.size < 3

    # y座標の最小値と最大値を求める
    ymin = ymax = np[0][1]
    np.each do |p|
      ymin = p[1] if ymin > p[1]
      ymax = p[1] if ymax < p[1]
    end

    if clip_enable
      ymin = 0 if ymin < 0
      ymax = Window.height if ymax > Window.height
    end

    if clip_enable
      # 1ラインずつスキャンしていく
      ymin.step(ymax, 1.0) do |y|
        xlst = PolyFill.get_intersection_point(y.to_f, np) # 交点のx座標を求める
        next if xlst.empty? # 交点が無い
        next if xlst.size % 2 != 0 # 交点数が奇数
        i = 0
        while i < xlst.size
          x0, x1 = xlst[i], xlst[i+1]
          unless x1 < 0 or x0 > Window.width
            img.line(x0, y, x1, y, f0col)
          end
          i += 2
        end
      end
    else
      ymin.step(ymax, 1.0) do |y|
        xlst = PolyFill.get_intersection_point(y.to_f, np)
        next if xlst.empty? or xlst.size % 2 != 0
        i = 0
        while i < xlst.size
          img.line(xlst[i], y, xlst[i+1], y, f0col)
          i += 2
        end
      end
    end
  end

  # 与えられた頂点座標配列を元にして交点リストを求める
  #
  # @param [Number] y スキャンするy座標
  # @param [Array] lst 頂点座標配列
  # @return [Array] 交点のx座標を配列で返す
  #
  def PolyFill.get_intersection_point(y, lst)
    xlst = []
    len = lst.size
    len.times do |i|
      x1, y1 = lst[i]
      x2, y2 = lst[(i + 1) % len]

      next if y1 == y2 # 水平線なら処理しない

      # yが、現在の辺の終点と、次辺の始点であり、
      # 両辺が上方向、または下方向の場合は交点から除外
      if y == y2
        y3 = lst[(i + 2) % len][1]
        next if (y2 - y1 < 0 and y3 - y2 < 0)
        next if (y2 - y1 > 0 and y3 - y2 > 0)
      end

      # yが下方向になるように入れ替え
      if y1 > y2
        x1, x2 = x2, x1
        y1, y2 = y2, y1
      end

      if y1 <= y and y <= y2
        # 交点を追加
        x = ((y - y1) * (x2 - x1)).to_f / (y2 - y1) + x1
        xlst.push(x)
      end
    end

    # 交点を小さい順にソートして返す
    return xlst.sort
  end
end

if $0 == __FILE__
  # ----------------------------------------
  # 動作テスト

  img = Image.new(640, 480)
  lst = [
    [200, 30],
    [300, 130],
    [350, 230],
    [300, 330],
    [200, 230],
    [50, 330],
    [100, 130],
    [200, 30]
  ]
  f0col = [255, 0, 255, 0]
  f1col = [255, 255, 0, 0]

  Window.loop do
    break if Input.keyPush?(K_ESCAPE)
    lst[4] = Input.mousePosX, Input.mousePosY
    img.clear
    PolyFill.fill(img, lst, f0col, f1col, false)
    Window.draw(0, 0, img)
  end
end

# Xiaolin Wu's line algorithm - Rosetta Code
# http://rosettacode.org/wiki/Xiaolin%5FWu%27s%5Fline%5Falgorithm

require 'dxruby'

class XiaolinWuDraw

  def XiaolinWuDraw.draw_line(img, x1, y1, x2, y2, colour)
    if x1 == x2 and y1 == y2
      # not line. this is a dot.
      img[x1, y1] = colour
      return
    end

    dx, dy = x2 - x1, y2 - y1
    steep = (dy.abs > dx.abs)? true : false
    x1, y1, x2, y2, dx, dy = y1, x1, y2, x2, dy, dx if steep
    x1, y1, x2, y2 = x2, y2, x1, y1 if x1 > x2
    gradient = dy.to_f / dx.to_f

    # handle the first endpoint
    xend = x1.round
    yend = y1 + gradient * (xend - x1)
    fp = (x1 + 0.5) - (x1 + 0.5).truncate
    rfp = 1.0 - fp
    xgap = rfp
    xpxl1 = xend
    ypxl1 = yend.truncate
    fp = yend - yend.truncate
    rfp = 1.0 - fp
    XiaolinWuDraw.put_colour(img, xpxl1, ypxl1,     colour, steep, rfp * xgap)
    XiaolinWuDraw.put_colour(img, xpxl1, ypxl1 + 1, colour, steep,  fp * xgap)
    itery = yend + gradient

    # handle the second endpoint
    xend = x2.round
    yend = y2 + gradient * (xend - x2)
    fp = (x2 + 0.5) - (x2 + 0.5).truncate
    rfp = 1.0 - fp
    xgap = rfp
    xpxl2 = xend
    ypxl2 = yend.truncate
    fp = yend - yend.truncate
    rfp = 1.0 - fp
    XiaolinWuDraw.put_colour(img, xpxl2, ypxl2,     colour, steep, rfp * xgap)
    XiaolinWuDraw.put_colour(img, xpxl2, ypxl2 + 1, colour, steep,  fp * xgap)

    # in between
    (xpxl1 + 1).upto(xpxl2 - 1).each do |x|
      itt = itery.truncate
      fp = itery - itery.truncate
      rfp = 1.0 - fp
      XiaolinWuDraw.put_colour(img, x, itt,     colour, steep, rfp)
      XiaolinWuDraw.put_colour(img, x, itt + 1, colour, steep,  fp)
      itery = itery + gradient
    end
  end

  def XiaolinWuDraw.put_colour(img, x, y, col, steep, c)
    return if c == 0.0 or col[0] == 0
    x, y = y, x if steep
    o = img[x, y]
    n = Array.new(4)
    if o[0] >= 255
      # Bg Alpha = 255
      n[0] = 255
      for i in 1..3 do
        n[i] = (col[i] * c + o[i] * (1.0 - c)).round
      end
    elsif o[0] == 0
      # Bg Alpha = 0
      n[0] = (255 * c).round
      for i in 1..3 do
        n[i] = col[i]
      end
    else
      na = (255 * c).round
      n[0] = (na > o[0])? na : o[0]
      for i in 1..3 do
        n[i] = (col[i] * c + o[i] * (1.0 - c)).round
      end
    end
    img[x, y] = n
  end
end

# ----------------------------------------
# test

if $0 == __FILE__
  font = Font.new(14)

  w, h = 500, 500
  bgcol = [0, 0, 255] # blue (R,G,B)
  fgcol = [255, 255, 255, 0] # Yellow (A,R,G,B)
  fgcol2 = [255, 0, 255, 0] # Green (A,R,G,B)

  p = []
  10.step(460, 30) do |a|
    p.push([10, 10, 490, a, fgcol])
    p.push([10, 10, a, 490, fgcol])
  end
  p.push([10, 10, 490, 490, fgcol])

  img0 = Image.new(w, h)
  # img0.fill(bgcol)
  p.each do |d|
    x1, y1, x2, y2, col = d
    XiaolinWuDraw.draw_line(img0, x1, y1, x2, y2, col)
  end
  # img0.save("test.png")

  img1 = Image.new(w, h)
  p.each do |d|
    x1, y1, x2, y2, col = d
    img1.line(x1, y1, x2, y2, col)
  end

  img2 = Image.new(640, 480)

  Window.bgcolor = bgcol
  Window.loop do
    break if Input.keyPush?(K_ESCAPE)

    # Push A key
    aa_enable = (Input.keyDown?(K_A))? false : true

    img2.clear
    x1, y1 = 320, 240
    x2, y2 = Input.mousePosX, Input.mousePosY

    if aa_enable
      XiaolinWuDraw.draw_line(img2, x1, y1, x2, y2, fgcol2)
      Window.draw(0, 0, img0)
      Window.draw(0, 0, img2)
    else
      img2.line(x1, y1, x2, y2, fgcol2)
      Window.draw(0, 0, img1)
      Window.draw(0, 0, img2)
    end

    s = "#{Window.real_fps} FPS  CPU: #{Window.getLoad.to_i} %"
    Window.drawFont(640 - 140, 2, s, font)
    s = "Push A key"
    Window.drawFont(640 - 140, 20, s, font)
  end
end

require 'dxruby'
require_relative 'xiaolinwu'

#
# 直線を描画するクラス
#
class LineDraw

  # 直線を描画
  #
  # @param [Object] img 描画対象のImageオブジェクト
  # @param [Number] x1 直線始点 x
  # @param [Number] y1 直線始点 y
  # @param [Number] x2 直線終点 x
  # @param [Number] y2 直線終点 y
  # @param [Array] col 描画色配列 A,R,G,B
  # @param [Number] linew 線幅
  # @param [Number] aa アンチエイリアス処理の分割数
  # @param [Number] last_t 前回描画時の余った値
  # @param [Boolean] aa2 trueなら線幅が太い場合もアンチエイリアスをかけるが激しく遅い
  # @param [Boolean] edge_only trueならエッジのみ描画。動作確認用
  # @return [Number] 描画時の余った値
  #
  def LineDraw.draw(img, x1, y1, x2, y2, col, linew = 1,
                    aa = 1, last_t = 0, aa2 = false, edge_only = false)
    ret = 0
    if linew <= 1
      # 線幅 = 1 の時

      if aa <= 1
        # アンチエイリアス無し
        LineDraw.draw_dda(img, x1, y1, x2, y2, col)
        # img.line(x1, y1, x2, y2, col)
      else
        # アンチエイリアス有り
        XiaolinWuDraw.draw_line(img, x1, y1,x2, y2, col)
      end
    else
      # 線幅 > 1 の時

      if aa2
        # アンチエイリアス有りで描画。激しく遅い
        ret = LineDraw.draw_aa(img, x1, y1, x2, y2, col, linew, aa, last_t)
      else
        # アンチエイリアス無しで描画

        # 三角形ポリゴン＋円塗りつぶしで描画
        ret = LineDraw.draw_poly(img, x1, y1, x2, y2, col, linew, edge_only)

        # ブラシで描画
        # ret = LineDraw.draw_brush(img, x1, y1, x2, y2, col, linew, last_t)
      end
    end
    return ret
  end

  # ----------------------------------------
  # 直線をDDAで描画。アンチエイリアス無し
  #
  # @note 以下参考ページ
  #       DDAによる線・円の描画３
  #       http://www7.plala.or.jp/nekogrammer/dda/DDA3.htm
  #
  # @param [Object] img 描画対象のImageオブジェクト
  # @param [Number] x1 直線始点 x
  # @param [Number] y1 直線始点 y
  # @param [Number] x2 直線終点 x
  # @param [Number] y2 直線終点 y
  # @param [Array] col 描画色配列。A,R,G,B
  #
  def LineDraw.draw_dda(img, x1, y1, x2, y2, col)
    x1 = x1.to_i
    y1 = y1.to_i
    x2 = x2.to_i
    y2 = y2.to_i
    dx = x2 - x1
    dy = y2 - y1
    a = dx.abs
    b = dy.abs
    xadd = LineDraw.get_sign(dx)
    yadd = LineDraw.get_sign(dy)
    x, y = x1, y1
    if a >= b
      # x方向のほうが大きい
      e = dy.abs * -1
      fg = true
      while fg
        img[x, y] = col
        break if x == x2
        x += xadd
        e += 2 * b
        if e >= 0
          y += yadd
          e -= 2 * a
        end
      end
    else
      # y方向のほうが大きい
      e = dx.abs * -1
      fg = true
      while fg
        img[x, y] = col
        break if y == y2
        y += yadd
        e += 2 * a
        if e >= 0
          x += xadd
          e -= 2 * b
        end
      end
    end
    return 0
  end

  def LineDraw.get_sign(x)
    return 0 if x == 0
    return -1 if x < 0
    return 1
  end

  # ----------------------------------------
  # 直線をブラシ画像で描画
  #
  # @param [Object] img 描画対象のImageオブジェクト
  # @param [Number] x1 直線始点 x
  # @param [Number] y1 直線始点 y
  # @param [Number] x2 直線終点 x
  # @param [Number] y2 直線終点 y
  # @param [Array] col 描画色配列 A,R,G,B
  # @param [Number] linew 線幅
  # @param [Number] last_t 前回描画時の余った値
  # @param [Number] line_interval 描画間隔
  # @return [Number] 描画時の余った値
  #
  def LineDraw.draw_brush(img, x1, y1, x2, y2, col, linew,
                          last_t = 0, line_interval = 0.2)

    brush = LineDraw.get_brush_image(col, linew, aa = 4)
    dx = (x2 - x1).to_f
    dy = (y2 - y1).to_f
    len = Math.sqrt(dx * dx + dy * dy)
    return if len == 0
    ti = line_interval / len
    t = last_t / len
    r = brush.width / 2
    while t < 1.0
      x = dx * t + x1 - r
      y = dy * t + y1 - r
      img.draw(x, y, brush)
      dt = r * ti
      dt = 0.0001 if dt < 0.0001
      t += dt
    end
    last_t = len * (t - 1.0)
    brush.dispose
    return last_t
  end

  # 描画用のブラシImageを取得
  #
  # @param [Array] col ブラシ色
  # @param [Number] linew 線幅
  # @param [Number] aa アンチエイリアス値
  # @return [Object] ブラシ用Image
  #
  def LineDraw.get_brush_image(col, linew, aa = 9)
    w, h = linew, linew
    r = linew / 2.0
    if w <= 0 or h <= 0
      w, h = 1, 1
      r = 0.5
    end
    img = Image.new(w, h)
    rr = r * r
    aad = aa * aa
    0.step(h, 1.0) do |y|
      0.step(w, 1.0) do |x|
        v = 0
        aa.times do |jy|
          yy = jy * (1.0 / aa) + y - r
          aa.times do |jx|
            xx = jx * (1.0 / aa) + x - r
            d = (xx * xx + yy * yy) / rr
            v += (1.0 - d) if d < 1.0
          end
        end
        a = col[0] * v.to_f / aad
        img[x, y] = [a, col[1], col[2], col[3]]
      end
    end
    return img
  end

  # ----------------------------------------
  # 直線をアンチエイリアス有りで描画
  #
  # @note 以下参考ページ
  #       アンチエイリアス付きの自由線描画(1)
  #       http://azskyetc.client.jp/paintprog/025_aaline1.html
  #
  # @param [Object] img 描画対象のImageオブジェクト
  # @param [Number] x1 直線始点 x
  # @param [Number] y1 直線始点 y
  # @param [Number] x2 直線終点 x
  # @param [Number] y2 直線終点 y
  # @param [Array] col 描画色配列 A,R,G,B
  # @param [Number] linew 線幅
  # @param [Number] aa アンチエイリアス処理の分割数
  # @param [Number] last_t 前回描画時の余った値
  # @param [Number] line_interval 描画間隔
  # @return [Number] 描画時の余った値
  #
  def LineDraw.draw_aa(img, x1, y1, x2, y2, col, linew,
                       aa = 4, last_t = 0, line_interval = 0.25)
    dx = (x2 - x1).to_f
    dy = (y2 - y1).to_f
    len = Math.sqrt(dx * dx + dy * dy)
    return if len == 0
    ti = line_interval / len
    t = last_t / len
    while t < 1.0
      x = dx * t + x1
      y = dy * t + y1
      LineDraw.draw_point(img, x, y, col, linew, aa)
      dt = linew * ti
      dt = 0.0001 if dt < 0.0001
      t += dt
    end
    last_t = len * (t - 1.0)
    return last_t
  end

  # アンチエイリアス付きで円を描画
  #
  # @param [Object] img Imageオブジェクト
  # @param [Number] px x座標
  # @param [Number] py y座標
  # @param [Array] col 描画色配列。A,R,G,B
  # @param [Number] linew 線幅
  # @param [Number] aa アンチエイリアス処理の分割数
  #
  def LineDraw.draw_point(img, px, py, col, linew, aa = 4)
    r = linew / 2.0
    x1, y1 = (px - r).floor, (py - r).floor
    x2, y2 = (px + r).ceil, (py + r).ceil
    rr = r * r
    aad = aa * aa
    cc = [255, col[1].to_i, col[2].to_i, col[3].to_i]
    for y in y1..y2
      for x in x1..x2
        next if img.compare(x,y,cc)

        v = 0.0
        xa = x - px
        ya = y - py
        for jy in 0..aa
          yy = ya + (jy.to_f / aa)
          for jx in 0..aa
            xx = xa + (jx.to_f / aa)
            d = (xx * xx + yy * yy) / rr
            v += (1.0 - d) if d < 1.0
          end
        end
        ao = col[0] * v / aad
        ao = 0 if ao < 0
        ao = 255.0 if ao > 255.0

        s = img[x,y]
        s[0] = (s[0] > ao)? s[0] : ao
        a = ao / 255.0
        ma = 1.0 - a
        s[1] = s[1] * ma + cc[1] * a
        s[2] = s[2] * ma + cc[2] * a
        s[3] = s[3] * ma + cc[3] * a
        img[x,y] = s
      end
    end
  end

  # ----------------------------------------
  # 三角形塗りつぶしと円塗りつぶしを使って直線を描画
  #
  # @note 線本体を三角形塗りつぶしを2回使って描く。始点と終点は円塗りつぶしで描く。
  #
  # @param [Object] img 描画対象のImageオブジェクト
  # @param [Number] x1 直線始点 x
  # @param [Number] y1 直線始点 y
  # @param [Number] x2 直線終点 x
  # @param [Number] y2 直線終点 y
  # @param [Array] col 描画色配列 A,R,G,B
  # @param [Number] linew 線幅
  # @param [Boolean] edge_only trueならエッジのみ描画。動作確認用
  # @return [Number] 描画で余った値
  #
  def LineDraw.draw_poly(img, x1, y1, x2, y2, col, linew, edge_only = false)
    r = linew / 2.0
    dx = x2 - x1
    dy = y2 - y1
    rad = Math.atan2(dy, dx) + (Math::PI / 2.0)
    xd = r * Math.cos(rad)
    yd = r * Math.sin(rad)

    # 線幅を持った線、つまり、矩形の4点を求める
    np = []
    np.push([x1 + xd, y1 + yd])
    np.push([x2 + xd, y2 + yd])
    np.push([x2 - xd, y2 - yd])
    np.push([x1 - xd, y1 - yd])

    if edge_only
      # エッジだけ描画して動作確認
      np.size.times do |i|
        x3, y3 = np[i]
        x4, y4 = np[(i+1) % np.size]
        img.line(x3, y3, x4, y4, col)
      end
      img.circle(x1, y1, r, col)
      img.circle(x2, y2, r, col)
    else
      # 塗り潰し

      # 三角形塗りつぶしを2回
      img.triangleFill(np[0][0], np[0][1], np[1][0], np[1][1],
                       np[2][0], np[2][1], col)
      img.triangleFill(np[2][0], np[2][1], np[3][0], np[3][1],
                       np[0][0], np[0][1], col)
      # 始点と終点を円で塗りつぶし
      img.circleFill(x1, y1, r, col)
      img.circleFill(x2, y2, r, col)
    end

    return 0
  end

end

if $0 == __FILE__
  # ----------------------------------------
  # 動作テスト

  font = Font.new(14)
  img = Image.new(640, 480)
  col = [255, 0, 255, 0]
  p = [
    [
      [58.15, 39.0],
      [58.15, 230.1],
      [171.1, 230.1],
      [171.1, 39.0],
      [58.15, 39.0]
    ],
    [
      [20.0, 240.0],
      [100.0, 300.0],
      [600.0, 400.0]
    ]
  ]

  linew = 1
  aa = 1
  aa2 = false
  list_kind = 0
  point_mv = false
  edge_only = false

  # Window.scale = 2
  Window.bgcolor = [128, 128, 128]

  Window.loop do
    break if Input.keyPush?(K_ESCAPE)

    # Eキーで塗りつぶし/エッジのみ描画を切替
    edge_only = !edge_only if Input.keyPush?(K_E)

    # 上下キーで線幅を変更
    linew += 0.5 if Input.keyPush?(K_UP)
    linew -= 0.5 if Input.keyPush?(K_DOWN)
    linew = 1 if linew < 1

    # Aキーで、ブラシ描画/アンチエイリアス描画の切り替え
    aa = ((aa == 1)? 3 : 1) if Input.keyPush?(K_A)

    # Sキーで、線幅が太い時もアンチエイリアス描画
    aa2 = !aa2 if Input.keyPush?(K_S)

    # Kキーで、座標配列を切替
    list_kind = (list_kind + 1) % p.size if Input.keyPush?(K_K)

    # Mキーで、座標のマウス移動を切替
    point_mv = !point_mv if Input.keyPush?(K_M)
    if point_mv
      p[list_kind][1][0] = Input.mousePosX
      p[list_kind][1][1] = Input.mousePosY
    end

    img.clear
    (p[list_kind].size - 1).times do |i|
      x0, y0 = p[list_kind][i]
      x1, y1 = p[list_kind][(i+1) % p[list_kind].size]
      LineDraw.draw(img, x0, y0, x1, y1, col, linew,
                    aa, 0, aa2, edge_only)
    end

    Window.draw(0, 0, img)

    s = "LineWidth=#{linew}  #{Window.real_fps} FPS  CPU: #{Window.getLoad.to_i}%"
    Window.drawFont(8, 2, s, font)
    s = "A , S , K , E , M , up , down key"
    Window.drawFont(8, 16, s, font)
  end
end

• 上下キー : 線幅の増減
• Kキー : 描画する形状を変更
• Mキー : 1点だけマウスカーソルで移動
• Aキー : (線幅が1の時) アンチエイリアスの有効無効
• Eキー : (線幅が1より大きい時) エッジだけ描画するか、塗り潰すか
• Sキー : (線幅が1より大きい時) アンチエイリアスの有効無効 (※ 滅茶苦茶重い)

• DDA : 1ドット幅、アンチエイリアス無。
• Xiaolin Wu's line algorithm : 1ドット幅、アンチエイリアス有。(xiaolinwu.rb を利用)
• 三角形塗りつぶし＋円塗りつぶし : 線幅有、アンチエイリアス無。
• ブラシ画像 : 線幅有、なんちゃってアンチエイリアス有。
• オーバーサンプリング : 線幅有、アンチエイリアス有。

require 'nokogiri'
require 'dxruby'
require_relative 'polyfill'
require_relative 'bezierdraw'
require_relative 'linedraw'

# swfのシェイプを解析してImageに描画するクラス
class ShapeParse
  DBG = false
  DBG2 = true
  TWIP = 20.0
  attr_accessor :id
  attr_accessor :width
  attr_accessor :left
  attr_accessor :top
  attr_accessor :height
  attr_accessor :image
  attr_accessor :draw_data
  attr_accessor :clip_enable

  def initialize(node, clip_enable = true)
    self.clip_enable = clip_enable
    self.id = node["objectID"].to_i
    puts "id[#{self.id}] #{node.name}" if DBG

    n = node.at(".//bounds/Rectangle")
    self.left = n["left"].to_i / ShapeParse::TWIP
    self.top = n["top"].to_i / ShapeParse::TWIP
    self.width = n["right"].to_i / ShapeParse::TWIP
    self.height = n["bottom"].to_i / ShapeParse::TWIP
    puts "size : (x,y)=#{self.left},#{self.top} (w,h)=#{self.width},#{self.height}" if DBG

    self.width = Window.width if self.width < Window.width
    self.height = Window.height if self.height < Window.height

    self.image = Image.new(self.width, self.height)

    x0, y0 = 0, 0
    x1, y1 = 0, 0
    x2, y2 = 0, 0
    f0_enable = true
    f1_enable = true
    l_enable = true
    fc = [[0, 0, 0, 0], [0, 0, 0, 0]]
    lc = [0, 0, 0, 0]
    lwidth = ShapeParse::TWIP
    lines = []
    self.draw_data = []

    n = node.at(".//shapes/Shape/edges").child

    while n != nil
      case n.name
      when "ShapeSetup"
        unless lines.empty?
          save_draw_data(lines, f0_enable, f1_enable, l_enable,
                         lwidth, fc[0], fc[1], lc)
          lines = []
        end

        s = "#{n.name} "
        x0 = n["x"].to_f if n.key?("x")
        y0 = n["y"].to_f if n.key?("y")
        f0_enable = (n["fillStyle0"] == "1")? true : false
        f1_enable = (n["fillStyle1"] == "1")? true : false
        l_enable =  (n["lineStyle"] == "1")? true : false

        if false
          s += "(x,y)=#{x0/TWIP}, #{y0/TWIP} ("
          s += (f0_enable)? "f0 " : "   "
          s += (f1_enable)? "f1 " : "   "
          s += (l_enable)? "l" : " "
          s += ")"
          puts s
        end

        n.xpath(".//fillStyles").each do |nn|
          nn.xpath(".//Solid/color/Color").each_with_index do |m, i|
            fc[i] = get_color(m)
          end
        end

        n.xpath(".//lineStyles").each do |nn|
          nn.xpath(".//LineStyle").each do |m|
            lwidth = m["width"].to_i if m.key?("width")
            m.xpath(".//color//Color").each do |c|
              lc = get_color(c)
            end
          end
        end

        if n.key?("x") and n.key?("y")
          lines.push([x0, y0])
        end

      when "CurveTo"
        # 二次ベジェ曲線
        x1 = x0 + n["x1"].to_f
        y1 = y0 + n["y1"].to_f
        x2 = x1 + n["x2"].to_f
        y2 = y1 + n["y2"].to_f
        lst = BezierDraw.calc(x0, y0, x1, y1, x2, y2)
        lines.concat(lst.slice(1..-1))
        x0 = x2
        y0 = y2

      when "LineTo"
        # 直線
        x1 = x0 + n["x"].to_f
        y1 = y0 + n["y"].to_f
        lines.push([x1, y1])
        x0 = x1
        y0 = y1

      else
        puts "!! Unknown Tag : #{n.name}"
      end
      n = n.next
    end

    draw(false)
  end

  # 色配列を取得
  #
  # @param [Object] node 「Color」ノード
  # @return [Array] A,R,G,Bが入った配列
  #
  def get_color(node)
    col = [255, 0, 0, 0] # ARGB
    ["alpha", "red", "green", "blue"].each_with_index do |s,i|
      col[i] = node[s].to_f if node.key?(s)
    end
    return col
  end

  # 描画用の直線データを記録
  #
  # @param [Array] lines 直線データ配列
  # @param [Boolean] fe0 塗り潰し0をするか否か
  # @param [Boolean] fe1 塗り潰し1をするか否か
  # @param [Boolean] le 線を描くか否か
  # @param [Number] lw 線幅
  # @param [Array] fc0 塗り潰し0の色配列
  # @param [Array] fc1 塗り潰し1の色配列
  # @param [Array] lc1 線描画の色配列
  #
  def save_draw_data(lines, fe0, fe1, le, lw, fc0, fc1, lc)
    np = []
    ox, oy = nil, nil
    lines.each do |p|
      x, y = p
      x /= TWIP
      y /= TWIP
      np.push([x, y]) if x != ox or y != oy
      ox, oy = x, y
    end

    # 記録
    self.draw_data.push([np, fe0, fe1, le, lw, fc0.dup, fc1.dup, lc.dup])
  end

  # Imageオブジェクトに描画
  #
  # @param [Boolean] clear_enable trueならImageをクリアしてから描画
  #
  def draw(clear_enable = true, scale_x = 1.0, scale_y = 1.0)
    self.image.clear if clear_enable

    self.draw_data.each do |d|
      p, fe0, fe1, le, lw, fc0, fc1, lc = d
      np = []
      p.each { |q| np.push([q[0] * scale_x, q[1] * scale_y]) }
      draw_line(self.image, np, fe0, fe1, le, lw, fc0, fc1, lc)
    end
  end

  # 多角形を描画
  #
  # @param [Object] img Imageオブジェクト
  # @param [Array] p 頂点座標が入った配列。
  # @param [Boolean] f0_enable trueなら塗り潰し有、falseなら塗り潰し無
  # @param [Boolean] f1_enable trueなら塗り潰し有、falseなら塗り潰し無
  # @param [Boolean] l_enable trueなら線を描く、falseなら線を描かない
  # @param [Number] lwidth 線幅
  # @param [Array] fc0 色配列。A,R,G,B
  # @param [Array] fc1 色配列。A,R,G,B
  # @param [Array] lc 色配列。A,R,G,B
  #
  def draw_line(img, p, f0_enable, f1_enable, l_enable,
                lwidth, fc0, fc1, lc)
    if f0_enable and p.size >= 3
      # 塗り潰しを行う
      PolyFill.fill(img, p, fc0, fc1, self.clip_enable)
    end

    if l_enable
      # 線描画を行う
      (p.size - 1).times do |i|
        x0, y0 = p[i]
        x1, y1 = p[(i+1) % p.size]
        LineDraw.draw(img, x0, y0, x1, y1, lc, lwidth / TWIP,
                      3, 0, false, false)
      end
    end
    lines = []
  end
end

if $0 == __FILE__
  # ----------------------------------------
  # 動作テスト

  font = Font.new(14)

  # swfmillで swf → xml変換したxmlを解析

  # infile = "swfdata/test_pdr1.xml"
  infile = "swfdata/test_pdr2.xml"

  doc = Nokogiri::XML(File.open(infile)) {|cfg| cfg.noblanks}

  objs = Hash.new
  doc.xpath("//DefineShape3").each do |node|
    pdr = ShapeParse.new(node, false) # ベクターデータを解析して画像化
    objs[pdr.id] = pdr
  end

  redraw_fg = false
  ang = 0
  scale = 1.0

  Window.bgcolor = [0, 190, 118]
  Window.fps = 60

  # メインループ
  Window.loop do
    break if Input.keyPush?(K_ESCAPE)

    # Rキー押しでスケールを変えて再描画
    redraw_fg = false
    redraw_fg = true if Input.keyDown?(K_R)

    objs.each_value do |o|
      # ベクターデータを再描画できなくもないが、遅くて実用にならない
      o.draw(true, scale, scale) if redraw_fg

      Window.draw(0, 0, o.image)
    end

    s = "#{Window.real_fps} FPS / CPU: #{Window.getLoad.to_i}%"
    Window.drawFont(4, 4, s, font)

    ang += 10
    scale = Math.cos(ang * Math::PI / 180.0) + 1.5
  end
end

• Rキー : 押してる間、ベクターデータ(シェイプ)を、大きさを変えて再描画。数秒無反応になるぐらいに遅い。

ruby install_rubysdl.rb

C:/Ruby/Ruby193mingw/lib/ruby/site_ruby/1.9.1/i386-msvcrt/opengl.so

gem install opengl -v=0.8.0
gem install ruby-opengl -v=0.61.0

> gem list | grep "opengl\|ruby-opengl"

opengl (0.8.0 x86-mingw32)
ruby-opengl (0.61.0)

• swfmill で swf を xml に変換。
• Ruby + Nokogiri を使って xml を解析しつつ、DXRuby で描画。

• ビットマップ画像の移動・拡大縮小・回転・傾斜・半透明表示
• 輝度変更 (明度変更)、色変更
• 簡素な階層のスプライト (MovieClip)
• 静止テキスト (デバイスフォント "_ゴシック", "_明朝", "_等幅" 等を指定していて、入れ子になってない簡素なもの)

• シェイプ(ベクターデータ)
• サウンド
• ActionScript
• 複雑な階層のスプライト(MovieClip)
• テキストの拡大縮小・回転・傾斜、入れ子構造

require "nokogiri"
require "dxruby"
require "find"
require 'benchmark'

# swfから変換したxmlを読み込んでDXRubyで再生するクラス
#
# @note swf から xml への変換は、swfmill を利用。
# @note DXRuby、Nokogiri が必要。
# @note License : Public domain
#
# @example
#   require "playxmlmove"
#   m = PlayXmlMovie.new("hoge.xml")
#   m.init
#   Window.loop do
#     break unless m.play
#   end
#
class PlayXmlMovie
  DBG = false
  TMDBG = false
  BMDBG = false

  # 論理ピクセル値
  TWIP = 20.0

  # ----------------------------------------
  # 色変更をするためのShader
  #
  class SpriteShader < Shader

    hlsl = <<EOS
  float4 g_mul;
  float4 g_ofs;
  texture tex0;

  sampler Samp0 = sampler_state
  {
   Texture =<tex0>;
  };

  float4 PS(float2 input : TEXCOORD0) : COLOR0
  {
    float4 output;

    output = tex2D( Samp0, input );
    output.r = (output.r * g_mul[0]) + g_ofs[0];
    output.g = (output.g * g_mul[1]) + g_ofs[1];
    output.b = (output.b * g_mul[2]) + g_ofs[2];
    output.a = (output.a * g_mul[3]) + g_ofs[3];
    return output;
  }

  technique
  {
   pass
   {
    PixelShader = compile ps_2_0 PS();
   }
  }
EOS

    @@core = Shader::Core.new(hlsl, {:g_mul => :float, :g_ofs => :float})

    def initialize
      super(@@core, "TShader")
      self.g_mul = [1.0, 1.0, 1.0, 1.0]
      self.g_ofs = [0.0, 0.0, 0.0, 0.0]
      @col = [1.0, 1.0, 1.0, 1.0, 0.0, 0.0, 0.0, 0.0]
      class << self
        protected :g_mul, :g_mul=, :g_ofs, :g_ofs=
      end
    end

    def set_color(a)
      v = 256.0
      self.g_mul = [ a[0] / v, a[1] / v, a[2] / v, a[3] / v]
      v = 255.0
      self.g_ofs = [ a[4] / v, a[5] / v, a[6] / v, a[7] / v]
      @col = a
    end
  end

  # ----------------------------------------
  # MATRIX情報格納用クラス
  #
  class TMatrix
    attr_accessor :trans_x, :trans_y
    attr_accessor :scale_x, :scale_y
    attr_accessor :skew_x, :skew_y
    attr_accessor :color

    def initialize(trans_x = 0, trans_y = 0,
                   scale_x = 1, scale_y = 1,
                   skew_x = 0, skew_y = 0,
                   mul_r = 256, mul_g = 256, mul_b = 256, mul_a = 256,
                   ofs_r = 0, ofs_g = 0, ofs_b = 0, ofs_a = 0)
      self.trans_x, self.trans_y = trans_x,trans_y
      self.scale_x, self.scale_y = scale_x, scale_y
      self.skew_x, self.skew_y = skew_x, skew_y
      self.color = [ mul_r, mul_g, mul_b, mul_a, ofs_r, ofs_g, ofs_b, ofs_a]
    end

    #
    # 属性値を更新
    #
    # @param [Hash] v 属性と値のハッシュ
    #
    def set_value(v)
      self.trans_x = v["transX"].to_f if v.has_key?("transX")
      self.trans_y = v["transY"].to_f if v.has_key?("transY")
      self.scale_x = v["scaleX"].to_f if v.has_key?("scaleX")
      self.scale_y = v["scaleY"].to_f if v.has_key?("scaleY")
      self.skew_x = (v.has_key?("skewX"))? v["skewX"].to_f : 0
      self.skew_y = (v.has_key?("skewY"))? v["skewY"].to_f : 0

      [
        "factorRed", "factorGreen", "factorBlue", "factorAlpha",
        "offsetRed", "offsetGreen", "offsetBlue", "offsetAlpha"
      ].each_with_index do |s, i|
        self.color[i] = v[s].to_f if v.has_key?(s)
      end
    end

    #
    # 座標変換
    #
    # @param [Number] x x座標
    # @param [Number] y y座標
    # @return [Array] 座標変換後のx,y座標
    #
    def trans(x, y)
      nx = (x * self.scale_x) + (y * self.skew_y) + self.trans_x
      ny = (x * self.skew_x) + (y * self.scale_y) + self.trans_y
      return nx, ny
    end

    #
    # 色変換パラメータを更新
    #
    # @param [Array] c 色変更情報の配列
    # @return [Array] 変更後の色変更情報配列
    #
    def trans_color(c)
      nc = Array.new(8)
      for i in 0..3 do
        nc[i] = c[i] * self.color[i] / 256.0
        nc[i] = 512 if nc[i] > 512
        nc[i] = -512 if nc[i] < -512
      end
      for i in 4..7 do
        nc[i] = c[i] + self.color[i]
        nc[i] = 255 if nc[i] > 255
        nc[i] = -256 if nc[i] < -256
      end
      return nc
    end

    #
    # 色変換が必要かどうかを返す
    #
    # @param [Array] c 色変換情報配列
    # @return [Boolean] trueなら色変換が必要。falseなら色変換は不要。
    #
    def TMatrix.trans_color?(c)
      [
        [0, 256.0], [1, 256.0], [2, 256.0],
        [4, 0.0], [5, 0.0], [6, 0.0]
      ].each do |n|
        return true if c[n[0]] != n[1]
      end
      return false
    end

    #
    # 色変換情報を格納するハッシュを初期化する
    #
    # @param [Hash] v 色変換情報格納用ハッシュ
    # @return [Hash] 初期化したハッシュを返す
    #
    def TMatrix.init_color(v)
      v.merge!({ "factorRed" => 256, "factorGreen" => 256,
          "factorBlue" => 256, "factorAlpha" => 256,
          "offsetRed" => 0, "offsetGreen" => 0,
          "offsetBlue" => 0, "offsetAlpha" => 0 })
      return v
    end
  end

  # ----------------------------------------
  # 画像を格納するキャラobjクラス
  #
  class CharaObjImage
    attr_accessor :id, :src, :image

    def initialize(id, fname)
      self.id = id
      self.src = fname
      self.image = Image.load(fname)
      # puts "id[#{id}] Load Image ok #{fname}"
    end
  end

  # ----------------------------------------
  # シェイプを格納するクラス
  #
  class CharaObjShape
    attr_accessor :id, :imgs

    def initialize(id, imgs)
      self.id = id
      self.imgs = imgs
    end
  end

  # ----------------------------------------
  # スプライト(MovieClip)を格納するクラス
  #
  class CharaObjSprite
    attr_accessor :id
    attr_accessor :start_node

    def initialize(id, start_node)
      self.id = id
      self.start_node = start_node
    end
  end

  # ----------------------------------------
  # フォント名を格納するクラス
  #
  class CharaObjFont
    attr_accessor :id, :fontname

    def initialize(id, fontname)
      self.id = id
      self.fontname = fontname
      puts "id[#{id}] font [#{fontname}]" if PlayXmlMovie::DBG
    end
  end

  # ----------------------------------------
  # テキストを格納するクラス
  #
  class CharaObjText
    attr_accessor :id, :font, :text, :size, :fontname, :col

    def initialize(id, text, size, fontname, col = [0, 0, 0, 255])
      self.id = id
      self.text = text
      self.size = size
      self.fontname = fontname
      self.font = Font.new(self.size, fontname)
      self.col = col
      if PlayXmlMovie::DBG
        puts "id[#{id}] DefineEditText \"#{text}\",#{size},\"#{fontname}\""
      end
    end
  end

  # ----------------------------------------
  # 描画用クラス
  #
  class MySprite

    attr_accessor :objs
    attr_accessor :cobj
    attr_accessor :pobj
    attr_accessor :z
    attr_accessor :mat
    attr_accessor :sprs
    attr_accessor :rt
    attr_accessor :shader
    attr_accessor :enable_loop

    # コンストラクタ
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @param [Number] cid 発生させたいキャラobjのID
    # @param [Object] pobj 親スプライト。nilなら親は居ない
    # @param [Number] depth 描画深度
    # @param [Hash] v MATRIX情報+半透明度を格納したハッシュ
    #
    def initialize(objs, cid, pobj, depth, v)
      self.objs = objs
      self.cobj = self.objs[cid]
      self.pobj = pobj
      self.z = depth
      self.mat = TMatrix.new
      self.sprs = Hash.new
      self.rt = nil
      self.shader = nil
      update(depth, v)
    end

    # 描画に必要な値を設定
    #
    # @param [depth] depth 描画深度
    # @param [Hash] v MATRIX情報と半透明度情報を格納したハッシュ
    #
    def update(depth, v)
      self.z = depth
      self.mat.set_value(v)
    end

    # RenderTargetを解放
    #
    def dispose
      if self.sprs != nil
        self.sprs.keys {|k| self.sprs[k].dispose }
      end

      if self.rt != nil
        self.rt.dispose unless self.rt.disposed?
      end
    end

    # 拡大縮小、半透明、回転描画
    #
    # @param [Object] img Imageクラス
    # @param [Object] im_mat TMatrixクラス
    #
    def draw_image(img, img_mat)
      pobj = self.pobj

      # 矩形の4点を配列にする
      w = img.width
      h = img.height
      p = [0, 0, w, 0, w, h, 0, h]

      c = Marshal.load(Marshal.dump(self.mat.color))

      # Shapeに割り当てられたMATRIXで変形
      4.times do |i|
        p[i * 2], p[i * 2 + 1] = img_mat.trans(p[i * 2], p[i * 2 + 1])
      end

      # 自身のMATRIXで変形
      4.times do |i|
        p[i * 2], p[i * 2 + 1] = self.mat.trans(p[i * 2], p[i * 2 + 1])
      end

      # 親スプライトのMATRIXで変形
      while pobj != nil
        4.times do |i|
          p[i * 2], p[i * 2 + 1] = pobj.mat.trans(p[i * 2], p[i * 2 + 1])
        end
        c = pobj.mat.trans_color(c)
        pobj = pobj.pobj
      end

      # 論理ピクセル値から画面座標に変換
      8.times {|i| p[i] /= PlayXmlMovie::TWIP }

      if TMatrix.trans_color?(c)
        # 色変換が必要
        # 色変更用のShaderはアルファチャンネル付き画像描画がおかしいので、
        # 色変更が必要な時だけ使うことにする。
        self.rt = RenderTarget.new(Window.width, Window.height) if self.rt == nil
        self.shader = SpriteShader.new if self.shader == nil
        self.rt.drawMorph(p[0], p[1], p[2], p[3], p[4], p[5], p[6], p[7],
                          img, :dividex => 3, :dividey => 3)
        self.rt.update
        self.shader.set_color(c)
        Window.drawEx(0, 0, self.rt, :shader => self.shader)
      else
        # 色変換は不要
        a = (255 * c[3] / 256.0).to_i
        if a != 255
          # 半透明描画
          Window.drawMorph(p[0], p[1], p[2], p[3], p[4], p[5], p[6], p[7],
                           img, :dividex => 3, :dividey => 3,
                           :alpha => a, :blend => :alpha)
        else
          # 不透明描画
          Window.drawMorph(p[0], p[1], p[2], p[3], p[4], p[5], p[6], p[7],
                           img, :dividex => 3, :dividey => 3)
        end
      end
    end

    # フォントを描画
    #
    # @param [String] text 描画文字列
    # @param [Object] font Fontオブジェクト
    # @param [Array] c RGBA配列
    #
    def draw_font(text, font, c)
      x = self.mat.trans_x / PlayXmlMovie::TWIP
      y = self.mat.trans_y / PlayXmlMovie::TWIP
      Window.drawFontEx(x, y, text, font,
                        :color => [c[0], c[1], c[2]],
                        :alpha => c[3], :blend => :alpha, :aa => true)
    end

    # 再生描画処理
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @return [Boolean] trueなら再生中, falseなら再生終了
    #
    def play
      return true
    end
  end

  # ----------------------------------------
  # 画像描画obj
  #
  class ImageObj < MySprite

    # コンストラクタ
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @param [Number] cid 発生させたいキャラobjのID
    # @param [Object] pobj 親スプライト。nilなら親は居ない
    # @param [Number] depth 描画深度
    # @param [Hash] v MATRIX情報+半透明度を格納したハッシュ
    #
    def initialize(objs, cid, pobj, depth, v)
      super(objs, cid, pobj, depth, v)
    end

    # 再生描画処理
    #
    # @return [Boolean] trueなら再生中, falseなら再生終了
    #
    def play
      draw_image(self.cobj.image, TMatrix.new)
      return true
    end
  end

  # ----------------------------------------
  # シェイプ描画obj
  #
  class ShapeObj < MySprite

    # コンストラクタ
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @param [Number] cid 発生させたいキャラobjのID
    # @param [Object] pobj 親スプライト。nilなら親は居ない
    # @param [Number] depth 描画深度
    # @param [Hash] v MATRIX情報+半透明度を格納したハッシュ
    #
    def initialize(objs, cid, pobj, depth, v)
      super(objs, cid, pobj, depth, v)
    end

    # 再生描画処理
    #
    # @return [Boolean] trueなら再生中, falseなら再生終了
    #
    def play
      self.cobj.imgs.each do |v|
        draw_image(v[0].image, v[1])
      end
      return true
    end
  end

  # ----------------------------------------
  # スプライト描画obj
  #
  class SpriteObj < MySprite
    attr_accessor :node
    attr_accessor :now_frame
    attr_accessor :enable_loop

    # コンストラクタ
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @param [Number] cid 発生させたいキャラobjのID
    # @param [Object] cobj 発生させたいキャラobj
    # @param [Object] pobj 親スプライト。nilなら親は居ない
    # @param [Number] depth 描画深度
    # @param [Hash] v MATRIX情報+半透明度を格納したハッシュ
    # @param [Boolean] looped trueならループ再生
    #
    def initialize(objs, cid, pobj, depth, v, looped = true)
      super(objs, cid, pobj, depth, v)
      self.node = cobj.start_node
      self.now_frame = 0
      self.enable_loop = looped
    end

    # 再生描画処理
    #
    # @return [Boolean] trueなら再生中, falseなら再生終了
    #
    def play
      pobj = self
      endfg = false

      until endfg

        case self.node.name
        when "PlaceObject2"
          # シェイプやスプライトを配置、もしくは移動
          nn = self.node
          rn = nn["replace"].to_i
          depth = nn["depth"].to_i
          id = nn["objectID"]
          id = id.to_i if id != nil

          # 属性を取り出す
          v = {}
          nn.children.each do |n|
            n.children.each do |m|
              if m.name == "Transform"
                # 変形情報
                m.keys.each do |k|
                  a = m.attribute(k)
                  v[a.name] = a.value.to_f
                end
              elsif m.name == "ColorTransform2"
                # 色変換情報
                v = TMatrix.init_color(v)
                m.keys.each do |k|
                  a = m.attribute(k)
                  v[a.name] = a.value.to_f
                end
              end
            end
          end

          if id != nil
            abort "Error: Not found ChrObj[#{id}]" unless self.objs.has_key?(id)

            case self.objs[id]
            when PlayXmlMovie::CharaObjImage
              self.sprs[depth] = ImageObj.new(self.objs, id, pobj, depth, v)
            when PlayXmlMovie::CharaObjShape
              self.sprs[depth] = ShapeObj.new(self.objs, id, pobj, depth, v)
            when PlayXmlMovie::CharaObjSprite
              self.sprs[depth] = SpriteObj.new(self.objs, id, pobj, depth, v)
            when PlayXmlMovie::CharaObjText
              self.sprs[depth] = TextObj.new(self.objs, id, pobj, depth, v)
            end
          elsif rn == 1
            self.sprs[depth].update(depth, v) if self.sprs.has_key?(depth)
          end

          if TMDBG
            s = "PLACE, replace=#{rn}, depth=#{depth}, id=#{id}, {"
            v.each_key {|k| s += "#{k} => #{v[k]}, "}
            s += "}"
            puts s
          end

        when "RemoveObject2"
          # シェイプやスプライトを削除
          depth = node["depth"].to_i
          if self.sprs.has_key?(depth)
            self.sprs[depth].dispose
            self.sprs.delete(depth)
          end
          puts "REMOVE, depth=#{depth}" if TMDBG

        when "ShowFrame"
          # 現在フレームを描画
          self.now_frame += 1
          puts "ShowFrame #{now_frame}" if TMDBG
          endfg = true

        when "End"
          # タグが無くなった
          endfg = true
          puts "End" if TMDBG
          break

        else
          # puts node_name
        end

        # 次のノードを読む
        self.node = self.node.next
      end

      # ウインドウに描画
      key_list = self.sprs.keys.sort # depthでソート
      key_list.each {|k| self.sprs[k].play }

      return true if self.node.name != "End"

      # 再生終了
      sprs = Hash.new
      if self.enable_loop
        self.node = self.cobj.start_node
        self.now_frame = 0
      end
      return false
    end
  end

  # ----------------------------------------
  # テキスト描画obj
  #
  class TextObj < MySprite

    # コンストラクタ
    #
    # @param [Hash] objs キャラobj情報が入ったハッシュ
    # @param [Number] cid 発生させたいキャラobjのID
    # @param [Object] pobj 親スプライト。nilなら親は居ない
    # @param [Number] depth 描画深度
    # @param [Hash] v MATRIX情報+半透明度を格納したハッシュ
    #
    def initialize(objs, cid, pobj, depth, v)
      super(objs, cid, pobj, depth, v)
    end

    # 再生描画処理
    #
    # @return [Boolean] trueなら再生中, falseなら再生終了
    #
    def play
      o = self.cobj
      draw_font(o.text, o.font, o.col)
      return true
    end
  end

  # ----------------------------------------
  # コンストラクタ
  #
  # @param [String] infile xmlファイルのパス
  #
  def initialize(infile)
    @infile = infile
    abort "Error : Not found #{infile}" unless File.exist?(infile)

    if BMDBG
      Benchmark.bm(15) do |x|
        x.report("xml parse:") {
          @doc = Nokogiri::XML(File.open(infile)) {|config| config.noblanks}
        }

        x.report("get fps") {
          @framerate, @frames = get_framerate(@doc)
          @wdw_w, @wdw_h = get_widnow_size(@doc)
          @bgcol = get_bgcolor(@doc)
        }

        @objs = Hash.new

        x.report("load image:") { load_image(@doc, infile) }
        x.report("load font:") { load_font(@doc) }
        x.report("load shape:") { load_shape(@doc) }

        x.report("load sprite:") {
          load_sprite(@doc)
          n = @doc.at("//swf/Header/tags/PlaceObject2")
          @objs[0] = CharaObjSprite.new(0, n)
        }

      end
    else
      # xmlを解析
      @doc = Nokogiri::XML(File.open(infile)) {|config| config.noblanks}
      @framerate, @frames = get_framerate(@doc)
      @wdw_w, @wdw_h = get_widnow_size(@doc)
      @bgcol = get_bgcolor(@doc)

      # 画像、シェイプ、スプライトを登録
      @objs = Hash.new
      load_image(@doc, infile)
      load_font(@doc)
      load_shape(@doc)
      load_sprite(@doc)

      # rootスプライトを登録
      puts "\nid[0] DefineSprite" if DBG
      n = @doc.at("//swf/Header/tags/PlaceObject2")
      @objs[0] = CharaObjSprite.new(0, n)
    end

  end

  #
  # フレームレート、フレーム数を取得
  #
  # @param [Object] doc xmlノード情報
  # @return [Array] フレームレート, フレーム数を配列で返す
  #
  def get_framerate(doc)
    n = doc.at("//Header")
    fpsv = n["framerate"].to_i
    frms = n["frames"].to_i
    puts "framerate=#{fpsv} , frames=#{frms}" if DBG
    return fpsv, frms
  end

  #
  # 画面サイズを取得
  #
  # @param [Object] doc xmlノード情報
  # @return [Array] 画面横幅, 画面縦幅を配列で返す
  #
  def get_widnow_size(doc)
    n = doc.at("//Header/size/Rectangle")
    # x = n["left"].to_i / TWIP
    # y = n["top"].to_i / TWIP
    w = n["right"].to_i / TWIP
    h = n["bottom"].to_i / TWIP
    puts "Window size : #{w}, #{h}" if DBG
    return w, h
  end

  #
  # 背景色を取得
  #
  # @param [Object] doc xmlノード情報
  # @return [Array] 背景色red, green, blueを配列で返す
  #
  def get_bgcolor(doc)
    n = doc.at("//SetBackgroundColor/color/Color")
    c = []
    ["red", "green", "blue"].each {|k| c.push(n[k].to_i)}
    return c
  end

  #
  # 画像をロード
  #
  # @param [Object] doc xmlノード情報
  # @param [String] infile xmlファイルパス
  #
  def load_image(doc, infile)
    imglist = get_img_file_list(infile) # 画像ファイルパスの一覧を取得

    # 検索するタグ名を列挙
    taglst = "//DefineBitsJPEG2|//DefineBitsLossless2|//DefineBitsLossless"

    doc.xpath(taglst).each do |n|
      id = n["objectID"].to_i
      n.content = ""

      unless imglist.has_key?(id)
        # IDと一致する画像ファイルパスが存在しない
        puts "Not found image file : id = #{id}"
        next
      end

      # IDと一致する画像ファイルパスが存在する
      fn = imglist[id]
      n["src"] = fn
      @objs[id] = CharaObjImage.new(id, fn)
      puts "id[#{id}] Load Image : #{fn}" if DBG
    end
  end

  #
  # xmlファイルパスを元にして、全画像ファイルのパス一覧を取得
  #
  # @param [String] xmlファイルパス
  # @return [Hash] 画像ファイルパスを格納したハッシュ
  #
  def get_img_file_list(infile)
    bsn = File.basename(infile, ".xml") # ファイルの拡張子を取り除いた文字列を取得
    dir = File::dirname(infile) # ファイルのフォルダパスを取得
    imglist = {}

    # サブフォルダ以下も探索して、拡張子が画像ファイル形式なら記録していく
    Find.find(dir) do |f|
      next unless FileTest.file?(f)
      imglist[$1.to_i] = f if /#{bsn}\[(\d+)\]\.(png|jpg|bmp|gif)/ =~ f
    end

    return imglist
  end

  #
  # フォント情報やテキスト情報を読み込み
  #
  # @param [Object] doc xmlノード情報
  #
  def load_font(doc)
    lst = Hash.new
    lst.merge!(
      {
        "_ゴシック" => "MS UI Gothic",
        "_明朝" => "ＭＳ Ｐ明朝",
        "_等幅" => "ＭＳ ゴシック",
        "_sans" => "Arial",
        "_serif" => "Times New Roman",
        "_typewriter" => "Courier"
      })

    # 使用している全フォント名を取得
    doc.xpath("//DefineFont2|//DefineFont3").each do |n|
      id = n["objectID"].to_i
      fnt = n["name"].encode("Windows-31J") # xmlはutf-8なのでsjisに変換
      if lst.has_key?(fnt)
        fnt = lst[fnt]
        @objs[id] = CharaObjFont.new(id, fnt)
      else
        @objs[id] = CharaObjFont.new(id, fnt)
      end
    end

    # 使用している静止テキスト情報を取得
    doc.xpath("//DefineEditText").each do |n|
      id = n["objectID"].to_i
      fid = n["fontRef"].to_i # フォント種類ID
      abort "Error: Not found font [#{fid}]" unless @objs.has_key?(fid)

      size = n["fontHeight"].to_f / PlayXmlMovie::TWIP

      # Flash CS5で作成したswfは、initialText に html が入っている。
      # htmlタグを除去して描画文字列を取得する
      nm = Nokogiri::HTML(n["initialText"])
      text = nm.content.encode("Windows-31J")

      col = [0, 0, 0, 255]
      c = n.at(".//color/Color")
      if c != nil
        col[0] = c["red"].to_i
        col[1] = c["green"].to_i
        col[2] = c["blue"].to_i
        col[3] = c["alpha"].to_i
      end
      fontname = @objs[fid].fontname
      @objs[id] = CharaObjText.new(id, text, size, fontname, col)
    end
  end

  #
  # 画像を内包するShapeを生成
  #
  # @param [Object] doc xmlノード情報
  #
  def load_shape(doc)
    doc.xpath("//DefineShape|//DefineShape2").each do |n|
      id = n["objectID"].to_i
      sn = n.xpath(".//bounds/Rectangle")[0]
      # x = sn["left"].to_i / TWIP
      # y = sn["top"].to_i / TWIP
      w = sn["right"].to_i / TWIP
      h = sn["bottom"].to_i / TWIP

      imgs = []
      bn = n.xpath(".//styles/StyleList/fillStyles")
      bn.xpath(".//ClippedBitmap|.//ClippedBitmap2").each do |m|
        img_id = m["objectID"].to_i
        if img_id == 65535
          # objectID が 65535 の時がある。正体不明
          puts "id[#{id}] Unknown Image [#{img_id}]" if DBG
          next
        end

        unless @objs.has_key?(img_id)
          # 画像が存在しない
          abort "Error : id[#{id}] Not found Image [#{img_id}] #{w} x #{h}"
        end

        # 画像が存在するので、シェイプに割り当てる
        # MATRXI情報も反映させる
        puts "id[#{id}] Shape = bitmap[#{img_id}]" if DBG

        dic = {}
        mn = m.at(".//matrix/Transform")
        mn.keys.each do |k|
          atr = mn.attribute(k)
          dic[atr.name] = atr.value.to_f
        end
        v = TMatrix.new
        v.set_value(dic)
        imgs.push([@objs[img_id], v])
      end
      @objs[id] = CharaObjShape.new(id, imgs)
    end
  end

  #
  # スプライトを登録
  #
  def load_sprite(doc)
    doc.xpath("//DefineSprite").each do |n|
      id = n["objectID"].to_i
      frames = n["frames"].to_i
      puts "\nid[#{id}] DefineSprite, frames=#{frames}" if DBG
      node = n.at(".//PlaceObject2")
      @objs[id] = CharaObjSprite.new(id, node)
    end
  end

  # 再生開始のための初期化処理
  #
  # @note fpsや背景色が変更されるので、再生が終わったら本来のfps・背景色に戻すこと
  #
  # @param [Boolean] init_size ウインドウサイズをxmlに従って変更するかどうか
  # @param [Boolean] init_fps フレームレートをxmlに従って変更するかどうか
  # @param [Boolean] init_bgcol 背景色をxmlに従って変更するかどうか
  #
  def init(init_size = false, init_fps = true, init_bgcol = true)
    @now_frame = 0
    @root_sprite = SpriteObj.new(@objs, 0, nil, 0, {})

    Window.resize(@wdw_w, @wdw_h) if init_size
    Window.fps = @framerate if init_fps
    Window.bgcolor = [@bgcol[0], @bgcol[1], @bgcol[2]] if init_bgcol
  end

  # 再生描画処理
  #
  # @note メインループから毎フレーム呼ぶこと
  #
  # @return [Boolean] trueなら再生中, falseなら再生終了
  #
  def play
    return @root_sprite.play
  end

  #
  # 多少整理したxmlを標準出力にダンプする
  #
  def dump
    puts @doc.to_xml
  end

end

if $0 == __FILE__
  # ----------------------------------------
  # 使い方の例

  m = PlayXmlMovie.new("swfdata/movie0.xml")
  # m = PlayXmlMovie.new("swfdata/movie1.xml")
  # m = PlayXmlMovie.new("swfdata/movie2.xml")
  # m = PlayXmlMovie.new("swfdata/movie3.xml")
  # m = PlayXmlMovie.new("swfdata/movie4.xml")

  # 再生開始のための初期化
  # fpsや背景色が変更されるので、
  # 再生が終わったら本来のfps・背景色に戻すこと
  m.init

  # メインループ
  Window.loop do
    break if Input.keyPush?(K_ESCAPE) # ESCキーで終了

    # 1フレーム分描画
    unless m.play
      m.init # 再生が終了したら、再度頭から再生
    end

  end
end

require_relative "playxmlmovie"

m = PlayXmlMovie.new("hoge.xml")
m.init

Window.loop do
    break unless m.play
end

• SwfRuby は RMagick が必要。
• しかし、Windows で RMagick を導入するのは面倒。ImageMagick の特定バージョンを要求される。

• 最終的な再生ファイル形式としての Flash (swf)
• 中間ファイルとしての Flash (swf)
• アニメ制作アプリとしての Flash
• デスクトップアプリを作成できる基幹技術としての Flash (Adobe AIR)
• その他色々。

• 皆が持ってるスマホのブラウザ上で再生できないってのは、やっぱり痛い。
• アニメを再生したいなら、そもそも動画ファイルを再生しちゃえばいい。

• 連番画像をレンダリングできるか。これができれば、動画編集ソフト等に渡す素材や、スプライトシートが作れる。
• 出力したファイルを、Webブラウザ以外でも再生することができそうか。

• 下のサムネイル横の「+」ボタンを押していけばキーフレームを増やせる。
• そのキーフレームでオブジェクトの位置変更等をすれば、その間の位置移動等を補間してくれる。
• サムネイルとサムネイルの間のボタンを押せば、何秒間、どんな動きをさせるのかグラフ表示してくれる。
• 秒数の変更もできるし、グラフ部分をマウスでクリックすれば動きの種類も順々に変わっていく。

• タイムライン上で右クリックすれば、キーフレームの挿入、動きの種類の変更などができる。
• タイムライン上でキーフレームのマークをドラッグすれば、キーフレーム位置を変更できる。

• @-webkit-keyframes なる記述がキーフレームの情報だと予想。
• キーフレームに、12.7451% とか 49.0196% とか書いてあるのは、全体時間に対してどこにキーフレームがあるのかを割合で示しているのではないか。
• html本体部分の canvas てのがシェイプに相当するらしい。シェイプの形状はcssで定義。