Unity

Unityのトゥーンレンダリング（セルティックレンダリング）を試す

やりたいことUnityにはUnity Toon Shader(UTS)というトゥーンレンダリング（セルティックレンダリング）のプレビューがあるので試してみます。トゥーンレンダリング、セルティックレンダリング、アニメ調レンダリング、ToonRendering、Celtic rendering 環境Unity Toon Shader：0.10.2-previewUnity Toon Shaderの使用インストールUnityのメニュー Window　→　Package ManagerからPackage Managerを起動します。Package Manager左上の”+”から”Add package...
2024.10.12
Unity
nodejs

NodeJS+GeminiにGUIを実装する

やりたいこと下の記事でNodeJSでGeminiを使用できるようにしました。しかしGUIがなく実用性は皆無なのでGUIを実装します。おさらい前回作成したHTMLは以下の通りです。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>Gemini</title> </head> <body> <script type="module" src="main.js"></script> </body></html>同様にJSは以下の通りです。let api_key = "Your API key"import { GoogleGener...
2024.10.10
nodejs
nodejs

NodeJSでGeminiの実装

やりたいことGoogleの生成AIであるGeminiをNodeJSで使用します。実装API key の作成以下のページにアクセスしてAPI keyを取得しますプロジェクトの作成ここでは以下の記事を用いてNodeJS+Viteのプロジェクトを作成しました。続いて以下のコマンドを実行し、generative-aiをインストールします。npm install @google/generative-aiHTMLの作成Srcフォルダにindex.htmlを作成します。内容は以下のようにしました。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <ti...
2024.10.09
nodejs
Android

Android上のWebViewをデバッグする

やりたいことAndroid上で表示しているWebView(Html、JavaScript)をデバッグします。細かく言うと以下のことをします。作成したモバイル向けのWebページのデバッグアプリ内で作成若しくは変更したWebページをデバッグデバッグ準備Android側の準備開発者向けオプションを有効にします。（開発者向けオプションを有効にする方法は以下をご参照ください）開発者向けオプションのUSBデバッグをオンにします。Windows側の設定adb(AndroidStudio)をインストールします。（手元にadbがインストールされていないPCがないため必須か不明ですが、公式のドキュメントにadb経...
2024.10.09
Android
Android（JAVA）

【有料】NodeJsで作成したWebアプリをAndroidアプリにする。

やりたいことNodeJsで作成したWebアプリをAndroidアプリにします。（サーバサイド（バックエンド）は含みません）ここでは以下のページで作成したNodeJS + Vite + Phaser 3のテンプレートで試します。すべてのJavaScriptアプリケーションの動作保証するものではありません。実装Webアプリの準備AndroidアプリにするWebアプリを用意します。上にあるようにここではNodeJS + Vite + Phaser 3の環境を作成し、以下のコマンドを実行しWebアプリを作成しました。npm run build上記の手順でdistフォルダに以下のようなファイルが作成され...
2024.10.09
Android（JAVA）
Phaser3

不連続なSpliteでアニメーション(Phaser3)

やりたいことPhaser3でキャラクタにアニメをつける場合以下のように連続したSplite（下の例だとdudeの0～3）からアニメーションを作成します。 this.anims.create({////左移動時のアニメーション key: 'left', frames: this.anims.generateFrameNumbers('dude', { start: 0, end: 3 }), frameRate: 10, repeat: -1 });しかし連続していないspliteを用いたい場合もあります。ここでは連続していないSpliteでアニメーションを作成します。上記のチュートリアルの詳細...
2024.10.03
Phaser3
ブラウザ

Chrome拡張機能のcontent_scriptsで実行されるScriptをデバッグする

やりたいこと以下のページで特定のページでJavascriptを実行する拡張機能を作成しました。"content_scripts"で実行するScriptのデバッグをします。デバッグ方法通常のページのデバッグと同様にF12もしくはCtrl+Shit+IでDevToolを開きます。画面上部のSourcesタブを選択後に”Contens Scripts”タブを選択します。”Contens Scripts”タブが表示されない場合は>>をクリックしてから”Contens Scripts”をクリックします。”Contens Scripts”タブに拡張機能で使用するJavaScriptがリストされます。リスト...
2024.10.03
ブラウザ
ブラウザ

Chromeの拡張機能にオプションページを追加する。

やりたいことChromeの拡張機能にはアイコンをクリックすると以下のように”オプション”がメニューに表示され、オプションページを表示することができるものがあります。この記事では上のように拡張機能にオプションを追加します。Chromeの拡張機能作成の基本は以下のページをご参照ください。実装manifestの修正manifestファイルに以下の設定を追加します。 "permissions": ["storage"], "options_page": "options.html",permissionsのStorageは、設定を保存/読み込みするための権限です。オプションページの作成メニューオプショ...
2024.10.03
ブラウザ
Phaser3

Vite + Phaser 3 のテンプレートで複数のHTMLを作成する

やりたいこと以下の記事で作成したVite + Phaser 3 のテンプレートで複数のHTMLをビルドの対象にします。具体的にはProjectディレクトリにあるindex.html以外のHTMLをビルド対象にして、npm run buildでビルドした際にhtmlをビルド、distフォルダにコピーされるようにします。ここではProjectディレクトリにあるindexA.htmlを追加することを例にします。設定の変更以下のファイルを開きます。vite¥config.prod.mjs以下の内容になっていると思います。import { defineConfig } from 'vite';const...
2024.10.01
Phaser3
ツール

文字列からハッシュ値(SHA)を作成するツール

やりたいこと文字列から"SHA-1"、"SHA-256"、"SHA-384"、"SHA-512"のハッシュ値をツールを作成しました。何に使うか？簡易的に固定のパスワードを作成する場合などは、入力されたパスワードと保存したハッシュ値と比較を行います。保存するハッシュ値を作成するためにこのページのツールを使うと簡単です。(このツールは１６進数の文字列にして出力を行っています。詳細の変換/実装方法は以下の記事を参照してください。) ツールSHA-256SHA-1SHA-384SHA-512document.getElementById("hash_btn").onclick = ()=>{ dige...
2024.09.29
ツール
次のページ