Kilimanjaro Warehouse

WEBとかゲーム開発のことについて書きます。

Blender: テクスチャがぼやけるときの対処法

Blenderでドット絵のようなテクスチャを使用する場合、
デフォルトの設定だと補完が効いてしまい、
画像がぼやけて表示されてしまいます。
f:id:kilimanjaro-a2:20190622081527p:plain


これを解決するには、User Preferencesを開き、
System -> OpenGL -> MipMapsのチェックを外します。
f:id:kilimanjaro-a2:20190622081530p:plain
f:id:kilimanjaro-a2:20190622081535p:plain
f:id:kilimanjaro-a2:20190622081538p:plain

これにより補完が効かなくなり、
テクスチャがくっきりと表示されるようになります。
f:id:kilimanjaro-a2:20190622081542p:plain

テクスチャはユニティちゃん 2Dデータのものを使用しております。
© Unity Technologies Japan/UCL

VS Code: 個人的に使用頻度の高いショートカット

Visual Studio Codeのショートカットについては、既にたくさんの記事がありますが、
よく使うものだけに絞ってまとめてみました。

必須レベル

Windows macOS 操作
Ctrl+C ⌘C コピー
Ctrl+X ⌘X 切り取り
Ctrl+P ⌘P 貼り付け
Ctrl+F ⌘F ファイル内検索
Ctrl+Shift+F ⇧⌘F 全ファイルから検索
Ctrl+S ⌘S 保存
Ctrl+P ⌘P ファイル名検索
Ctrl+/ ⌘/ コメントアウトとアンコメントのトグル

よく使う

Windows macOS 操作
Ctrl+H ⌥⌘F ファイル内置換
Ctrl+N ⌘N 新しいタブを開く
Ctrl+W ⌘W 開いているタブを閉じる
Ctrl+Shift+T ⇧⌘T 直前に閉じたタブを開く
Alt+↑/↓ ⌥↑/↓ 行を入れ替え
Ctrl+Shift+K ⇧⌘K 行を削除
Ctrl+Enter ⌘Enter 下へ改行を挿入
Ctrl+Shift+Enter ⇧⌘Enter 上へ改行を挿入

たまに使う

Windows macOS 操作
Ctrl+←/→ ⌘←/→ 行の最初/最後へ移動
Ctrl+↑/↓ ⌘↑/↓ ファイルの最初/最後へ移動
Ctrl+Alt+↑/↓ ⌥⌘↑/↓ カーソルを追加(escで解除)
Ctrl+Shift+L ⇧⌘L 同じ単語を全て選択(escで解除)
Ctrl+K Enter ⌘K Enter プレビューモードのタブを開き続けるようにする
Ctrl+Shift+P ⇧⌘P コマンドパレットを開く

補足

macOSの記号の意味は以下の通りです。
Command(⌘)
Shift(⇧)
Option(⌥)
Control(⌃)

全ショートカット一覧:
windows
https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf
macOS
https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf

Git: push declined due to email privacy restrictions の解消法

GitHubにpushしたときに以下のエラーが表示されるときがあります。

To github.com:Kilimanjaro-a2/hogehoge.git
 ! [remote rejected] master -> master (push declined due to email privacy restrictions)
error: failed to push some refs to 'git@github.com:Kilimanjaro-a2/hogehoge.git'

これはGitHubの機能によるもので、登録しているメールアドレスが非公開の状態で、
コミットにそのアドレスが含まれているときに、
pushをブロックしてくれるというものでした。

これを解決するためには、

のいずれかの対応が必要となります。

GitHubに登録しているメールアドレスを公開状態にする

単純に非公開にしているメールアドレスを公開状態にすることで解決します。
アドレスは全世界に公開されるため、そうしたくない場合は使えない方法です。
github.com
GitHubの設定からEmailの設定を開き、

Keep my email address private

のチェックを外すことで、メールアドレスが公開状態になります。

Block command line pushes that expose my emailのチェックを外す

GitHubの設定からEmailの設定を開き、

Block command line pushes that expose my email

のチェックを外すことで、ブロック機能が無効になります。
これを行うと非公開のアドレスがコミットに含まれたままGitHub上にpushされます。
Publicなレポジトリを使用する場合などは、アドレスが公開されてしまうので注意してください。

コミットに含まれるメールアドレスを別のものに書き換える

コミットに含まれるメールアドレスの情報を、非公開に設定しているアドレスではないものに変更することで解決します。
公開できるアドレスがない場合、適当な文字列を入れると良いと思います。

過去のコミットに含まれるメールアドレスを書き換えるには以下のコマンド

git filter-branch -f --env-filter "GIT_AUTHOR_EMAIL='hoge@hoge.hoge'; GIT_COMMITTER_EMAIL='hoge@hoge.hoge';" HEAD

これから行うコミットのメールアドレス情報を書き換えるには以下のコマンド

// プロジェクト単位
git config user.email "hoge@hoge.hoge"
// グローバル
git config --global user.email "hoge@hoge.hoge"

"hoge@hoge.hoge"の部分は自分のメールアドレスなどの任意の文字列に置き換えてください

参考:
qiita.com

Laravel: 'cross-env' is not recognized as an internal or external command ... の解消法

LaravelのHomesteadでアセットをコンパイルしたい際、

npm run dev

コマンドを叩きます。
ところが、環境によっては
以下のエラーが出てコンパイルがうまくいかないことがあります。

'cross-env' is not recognized as an internal or external command, operable program or batch file.

このエラーは、cross-envをプロジェクトにではなく、
グローバルでインストールすることで解決するようです。

解決策1: cross-envをグローバルでインストールする

以下のコマンドで、プロジェクトのnode_modulesを削除して、
グローバルでcross-envをインストールします。

rm -r node_modules/
npm install --global cross-env

その後、package.jsonをエディタで開き、"cross-env": "^5.0.1",の記述を削除します。
(^5.0.1の部分は環境によって異なります)
そして、以下のコマンドで依存パッケージを再インストールします。

npm install --no-bin-links

以上の手順を行うことで、

npm run dev

を叩いてコンパイルを行うことができます

解決策2: Laravelのバージョンを上げる

このエラーはWindows10でLaravel5.4を使用している際に起きるようです。
単純にLaravelのバージョンを上げることで解決するという報告もあるようでした。


from:
node.js - Laravel 5.4 ‘cross-env’ Is Not Recognized as an Internal or External Command - Stack Overflow

勉強メモ: オブジェクト指向とコンポーネント指向の違いについて

オブジェクト指向コンポーネント指向の違いがイマイチわからなかったので、
少し調べてみました。


個人的に一番しっくり来たのは、
こちらの質問記事のMike Dinescuさんの回答でした。
stackoverflow.com

I'm sure that others here will be able to give a better explanation of what component oriented languages are (and if they won't, a thorough search on the internet should) but the way I see it the component oriented paradigm can be viewed as an embodiment of object oriented programming.


That is to say that component oriented programming specializes Object Oriented Programming by strictly enforcing and implementing some OO concepts. Basically the whole idea is to create reusable code - in the form of components - that can be interchanged. So, component oriented programming heavily relies on: polymorphism, encapsulation, late binding, inheritance (through interfaces) and most importantly binary re-usability.


A component is a software package that encapsulates data and functionality - much like an object in OOP - but at a higher level.

以下、簡単に訳してみました。

コンポーネント指向言語が何かということについては、ここの人たちが良い感じの説明をしてくれるでしょう。
(そして、もししてくれなかったとしても、ネットで検索すれば出てくるでしょう)
私は、コンポーネント指向はオブジェクト指向プログラミングの強調版として見ることができると思っています。


つまり、コンポーネント指向プログラミングは
いくつかのオブジェクト指向のコンセプトを厳密に強制し、実践することによって、
オブジェクト指向を専門化させたものだということです。


コンポーネント指向の基本的なアイディアは、再利用可能なコードを交換可能なコンポーネントの形として作ること、それが全てです。
なので、コンポーネント指向プログラミングは、以下のものに強く依存しています。
それは、ポリモーフィズムカプセル化、遅延バインディング、 (インターフェースを通した)継承、そして最も重要なのはバイナリの形での再利用性です。


コンポーネントはデータや機能をカプセル化したソフトウェアのパッケージです。
それはオブジェクト指向プログラミングでいうところのオブジェクトに近いですが、より高いレベルにあるものです。

バイナリの形での再利用性については、以下の記事がわかりやすいかと思います。
1.2. Component-Oriented Versus Object-Oriented Programming - Programming .NET Components, 2nd Edition [Book]


結局どういうことかというと、
コンポーネント指向はオブジェクト指向の亜種みたいなもので、
焦点を当てている場所がより具体的で高いレベルにある...
という点に、オブジェクト指向との違いがあるのではないかという結論に至りました。

After Effects: GIF動画の書き出し方法

Adobe After Effects(以下AE)で作成した動画を、
GIFアニメーションとして出力する方法です。

AE単体ではGif動画を書きだすことはできないのですが、
AEに付属するAdobe Media Encoder(以下ME)というソフトを使用することで、書き出しが可能となります。

手順

AEからMEを起動

ファイル -> 書き出し -> Adobe Media Encoderキューに追加 を選択します
f:id:kilimanjaro-a2:20190216154716p:plain

書き出し設定の変更

ME画面右上にあるキューに追加されている動画の形式を選択します
f:id:kilimanjaro-a2:20190216154712p:plain

書き出し設定ウィンドウが表示されるので、
画面右側の書き出し設定内の「形式」と書かれたプルダウンメニュー内を開きます
f:id:kilimanjaro-a2:20190216154708p:plain

一番下にあるアニメーションGIFを選択します
f:id:kilimanjaro-a2:20190216154705p:plain

アニメーションGIFの書き出し

再生ボタンを押すことで動画のエンコードが開始されます
f:id:kilimanjaro-a2:20190216154702p:plain

エンコードが終了したら、出力ファイル名をクリックすると、出力先のフォルダが開かれます
f:id:kilimanjaro-a2:20190216154734p:plain

以上の手順を踏むことで、アニメーションGIFを作成することができます!

Laravel: Homesteadで502 Bad Gatewayが頻出する件について

Homesteadで開発中のWebサイトでページ遷移を行ったときに、
何故かランダムな間隔で502 Bad Gatewayが頻出しました。
Homesteadのバージョンが8以上の場合に起きるようです(記事執筆時点)。

環境 バージョン
macOS Mojave 10.14.2
Homestead 8.0.2

解決策1

どうやらPHP7.3で使われているxdebugというツールとnginxの相性が悪いことで起きる現象のようです。
xdebugを無効化することで回避できるようですが、その代償としてxdebugは使用不能になります。

参照:
stackoverflow.com

解決策2

xdebugを無効化する以外の方法として、PHPのバージョンを落とす方法があるようです。
PHP7.3から発生するようになった不具合のようなので、
このバージョンにこだわりがなければ、素直にPHPのバージョンを落とすのが良さそうです。

Homestead.yamlのsites:に

php: "7.2"

を書き加えることで、使用するPHPのバージョンを変更できます。

このようになります。

sites:
    - map: example.test
      to: /home/vagrant/code/public
      php: "7.2"

参照:
github.com
Thank you godjen99, svpernova09 and mdgrech!!