UVをフラグメントシェーダーで計算する2個目のアプローチですがいきなり本命です。ラスタライザがUVをいい感じに補間してくれないなら自分でフラグメントシェーダーで計算してやればいいというわけです。計算するかさてシェーダーでやるにしても計算方法が必要ですがそこまで難しくはありません。求めるものは台形内の任意の点pに対する「線分ep」と「線分ef」の長さが分かればいいのです。ef」でUの値になります。・eの求め方eの求め方は「Ae」と「Ce」の長さの比が分かれば求められます。これはとても簡単です。「直角三角形ACg」と「直角三角形Aeh」は相似です。この2つの三角形の各辺の比は同一です。AgとAhの比は計算するまでもなくわかります。1:(1-V)となるからです。(|AC|は線分ACの長さです。eで点eの位置が求められます。UとしてUが分かります。シェーダーで実装するさて前述の計算をシェーダーで実装します。0から作るのは面倒なので、Unityのビルトインシェーダーの(UI/Default)をベースに実装してます。計算するためには頂点ABCDと頂点pの座標が必要です。ABCDは常に固定なので、シェーダー定数としてマテリアルに設定します。頂点pはラスタライザで補間してもらいたいので、頂点情報に付与します。}}シェーダー定数_LT、_RT、_LB、_RBに座標を4隅の座標を設定。各頂点のuv1にも座標を指定して、ラスタライザで補間してもらいます。※positionの値は親の座標変換等を受けてこの値を取得できなくなりますので使用できません。シェーダー側は以下の通り。}}ほぼUI/Defaultのままです。fragのここから~ここまでというコメントまでが前述の計算です。シェーダー定数を足しているのと、頂点情報にUV1の追加も行っています。台形になってますね!応用編1:奥行きを出す台形にすると奥行き(奥が小さく、手前が大きく)を出したくなります。アプローチ1:Vを累乗するVを累乗するとVの変化が直線から曲線になってそれっぽくなるかもということでシェーダーでVを2乗してみることに。そこはかとない違和感が...1.3乗にしてみる。奥行き感があんまり...アプローチ2:射影変換する奥行きが出したいなら通常の3Dと同じように射影変換行列を適用すれば良いのでは...という事で試しました。良い感じかもしれません。計算は射影変換行列との積の内必要な分だけ抜き出しました。}}easeという関数で射影変換を計算しています。射影変換行列はD3DXMatrixPerspectiveFovLHを使っています。応用編2:Spriteを台形にする今まで書いてきた内容はUVが0~1のテクスチャを1枚そのまま出すのを想定しています。これを任意の矩形で切り抜いたSprite向けに変更します。言ってもこれも難しくはありません。上記の0~1のときの計算結果を本来のUV値に乗算するだけです。本来のUV値が必要になるので、UV座標をシェーダー定数で送ります。}}_STUVにUV座標が入ってます。シェーダー側でこれに0~1のときの結果をかけます。}}奥行きの補正はないやつです。UVの計算というコメントを入れています。Positionという仕組みになっています。これは3DやUnity2D(旧UI)時のTransformの座標指定とは毛色が違います。前の記事でuGUIの自分で作ったクリック判定の調整作業をざっくり書きました。これには課題点がありました。クリ...ASP.NetEntityFrameworkのMigrationを試してみる以前ASP.Netで超簡単な掲示板を作りました。これのDBの処理はEntityFrameworkと呼ばれるO/Rマッパーを利用しています。作っていて不便な点が出てきます。それが、テーブル情報の変更時です...ASP.NetASP.Netで0から超簡易掲示板を作るASP.Netで完全に0から超簡易の掲示板を作りました。ASP.Netがどんなもんか見る為のものだったのでいろいろと雑です。(細かいエラー処理やらセキュリティ回りはノータッチです。githubに上げています...ASP.NetASP.NetのApiControllerを自分で選択するASP.NetのApiControllerはシステムがURL等によって自動で選択してくれます。GETで通信するとApiControllerを継承したHogeHogeControllerのGetから始まるintを引数に持ったメ...ASP.NetASP.Net触ってみたずっと気になってたASP.Netをさわってみました。Frameworkで動くウェブアプリケーションの環境です。ツイートタイトルとURLをコピーしました。