新アプリ「カレイドツクール」をリリースしました。
およそ2年ぶりで通算40作目。そんなに経ってたのか…。
カレイドスコープ(万華鏡)画像を作るアプリです。
最近ハマってたOpenGLを使って作成しました。
新アプリ「カレイドツクール」をリリースしました。
およそ2年ぶりで通算40作目。そんなに経ってたのか…。
カレイドスコープ(万華鏡)画像を作るアプリです。
最近ハマってたOpenGLを使って作成しました。
gl-reactを使って画像(テクスチャ)をY軸周りに回転させることを考えます。
直接関係はないけどGLSLの練習【Crop, Tiling】の続きです。
一般的に画像を回転するというとZ軸周りの回転です。
この回転自体は単純な三角関数で可能ですし、拡大縮小、平行移動、せん断を含めてもアフィン変換で簡単に描画できます。
ただY軸周りの回転となると射影変換 (透視変換 / 透視投影)が必要です。
GLSLを書きつつも基本的な三角関数と線形代数をベースに書いていきます。
GLSL(OpenGL Shading Language)を使って画像処理する練習。
今回は色々な切り抜き(Cropping)と敷き詰め(Tiling)。
最終的にreact nativeで使いたいのでgl-reactを前提として書きます。
色々と機能の限られるReact Native(Expo managed)で画像処理することを考える。
細かい部分はドキュメントを参照するとして使うライブラリや全体的な流れをざっくりとまとめてみます。
I/Oに不満がなければわりと好き放題できる。
Expoでカメラを使う時ライブプレビュー画面にgl-reactでエフェクトをかけたい。
結論を書くとあまりスマートな方法で解決はできなかったです。
プログラマでも趣味分野だと画像編集をする機会は意外とあります。
スクリーンショットを加工したり、アプリのアイコンを作ったり。
私はそのほかにチラシ広告とか告知画像とか作ったりしているので、わりと高頻度で画像編集ソフトを使っています。
使っているフリーのペイントソフトやベクターソフトを紹介します。
My作業PCはWindows 10ですが大体はクロスプラットフォーム対応されてますね。
React Native (expo) + Open GL で遊んでいると描画したものを保存したくなる。
需要ありそうな気がするんだけど全然情報がないので手探りでやってみます。
gl-reactをReact Nativeで使う方法の覚書。
前回(設定やフィルタ処理)の続きのような感じ。
使ってみたいのはこちら。
https://gl-react-cookbook.surge.sh/paint
GLによるペイントプログラムです。
久々に画像処理したくなったのでgonumを使って行列計算などしつつ、並列化してそれっぽく処理してみます。