React管理下にない値の変更時に描画を更新したい。
あまり使いたいものでもないですが、React.Componentでは適切なタイミングでthis.forceUpdate()を使うことになります。
今回は関数コンポーネントで作成中にforceUpdateに当たる処理が必要になったのでどうにかしようという内容です。
カテゴリー: 技術
【ポータル追加】うずらウォレットの蛇口一覧
うずらウォレットの蛇口一覧ページを作りました。
React Native, Expoのメモリ問題について
特定の端末で特定の写真を開くとエラーも出ずすっとアプリが再起動する。
OpenGLの問題で同じようなこともありましたが今回はより条件がわからない。
結果的におそらくメモリ不足であろうという推測に至ったので、ImagePickerで取得する画像の調整や使えるメモリ量などの備忘録。
最終的にImagePickerが原因で対処療法しかないという内容ですが、これを機に色々調べることが出来たので時系列順に書いていきます。
Let’s Encryptの証明書を使ったExpressのSSL化
next.jsで作ったアプリをSSL化しようとしたところ以下のエラーに悩まされた。
Error: error:0909006C:PEM routines:get_name:no start line調べて出てくる情報が色々とおかしかったので大分苦労しました。
今回の内容は基本的にexpressでLet's Encryptの証明を行うための方法です。
React native, Expoのビルドサイズを削減
expoでビルドした「カレイドツクール」は49MBでした。
こんなもんかなと思いましたがassetに大きなファイルも入れていないのにこれまでのUnityアプリよりもサイズが大きい。
Google Play App Signingを有効化してAndroid App Bundleを使用することで容量の削減を試みました。
少し減ればいいなと思っていたらなんと半分になります。
新アプリ「カレイドツクール」をリリース
新アプリ「カレイドツクール」をリリースしました。
およそ2年ぶりで通算40作目。そんなに経ってたのか…。
カレイドスコープ（万華鏡）画像を作るアプリです。
最近ハマってたOpenGLを使って作成しました。
OpenGL on Android with Expo
バグフィックスしつつOpenGL仕様のおさらいをする内容です。
発端はReact Native（expo）で作ったAndroidアプリをテストしているときです。
ビルド後、複数端末でテストしたところタブレット端末で急にアプリが落ちました。
クラッシュレポートなど出ず、すっと消えるように。
expoをインストールしてデバッグするもログにも全く残りません。困った。
どの端末で使える/使えないと知りたかったのでOpenGLのバージョンなどから調べていきます。
React Nativeでスナックバーを表示させる
React nativeで何かアクションを起こしたときに「成功」のような表示を行いたい。
Toast / トースト（画面に浮き上がって消える）やModal / モーダル（ポップアップ表示）、SnackBar / スナックバー（アプリ領域にバー形式で表示する）を考えます。
react-native: ^0.61.5expo: ~36.0.0【GLSL】画像をY軸周りに回転する
gl-reactを使って画像（テクスチャ）をY軸周りに回転させることを考えます。
直接関係はないけどGLSLの練習【Crop, Tiling】の続きです。
一般的に画像を回転するというとZ軸周りの回転です。
この回転自体は単純な三角関数で可能ですし、拡大縮小、平行移動、せん断を含めてもアフィン変換で簡単に描画できます。
ただY軸周りの回転となると射影変換 （透視変換 / 透視投影）が必要です。
GLSLを書きつつも基本的な三角関数と線形代数をベースに書いていきます。
GLSLの練習【Crop, Tiling】
GLSL(OpenGL Shading Language)を使って画像処理する練習。
今回は色々な切り抜き(Cropping)と敷き詰め(Tiling)。
最終的にreact nativeで使いたいのでgl-reactを前提として書きます。