大物としては最後になる塗りつぶし機能。NanoVGではベジェ曲線だろうがなんだろうが囲まれた部分を指定の色やグラデーションで塗りつぶすことができる。塗りつぶした三角形なら簡単に描画できるが、形状が不定のものをどうやって塗りつぶすかという問題であ…

今まで放置していた色をつける機能を追加する。NanoVGではnvgStrokeColorでベタ塗りの色を指定して、nvgStrokePaintでグラデーションを設定できる。どちらも内部的にはNVGstate構造体のstrokeメンバにNVGpaint構造体を格納しているだけである。よってベタ塗…

今回は3次ベジェ曲線を作る。ベジェ曲線というのは始点終点であるアンカー2つと制御点を使って曲線を描画するアルゴリズムである。具体的にはベジェ曲線 - Wikipediaの下のほうの作図法を見てもらうとわかりやすい。また、3次ベジェ曲線体験ツールを作ったの…

端の処理はあるが接続点の処理が無いので今回はこれを作る。 各種フラグ まずPointクラスに項目を追加して各種フラグを持てるようにする。 class Point < Struct.new(:v, :dv, :dmv, :len, :left, :inner_bevel, :bevel, :corner);end lenは線の長さでフラグ…

現状ではパスは1つだけでOreVGクラスで扱っているが、NanoVGはサブパスを複数持つような構造になっている。これはたぶん閉じたり閉じなかったりする複数のパスを一まとめにしてグラデーションしたりするためにそうなっているんじゃないかと思うのだが、今回…

端の処理がbuttだけなのでroundとsquareを追加しよう。ついでにclose_pathでループを作れるようにもしてみる。 ループ処理 NanoVGではnvgClosePath関数を呼ぶことでそのパスのclosedフラグを立てる。これが立っていると最初の点と最後の点が自動的に接続され…

DXRubyタグにしているが結果の確認に使っているだけで別にDXRubyである必要性も何も無いんだよな。いずれはNanoVGみたいに本体とバックエンドを分離してみたいところ。まあいずれ。 今回は前回手を抜いた頂点配列の生成のところを作ってみよう。 頂点配列と…

新年あけましておめでとうございます。今年もよろしくお願いいたします。 さて、ちょと前に作ったラスタライザを、NanoVGを参考にしながら手を入れていってベクタグラフィックスにチャレンジしよう。 基本的な流れ NanoVGではnvgBeginFrame〜nvgBeginPath〜…