20191008のUnityに関する記事は9件です。

Unityを2019.2.3fにアップデートしたら、謎現象が発生する(原因不明のままだけど大したことない)

アップデートした

UnityHubを使ってインストール&起動

すでにご存知とは思いますが、
UnityHubを使って新しいバージョンを追加して、
そのバージョンで既存のプロジェクトを開いて動かした感じです。
バージョンは、
UnityHub 1.6.1
Unityバージョン 2018.2.17f1 → 2019.2.3f1
image.png

割と新しめにしてみました。

謎現象発生

とりあえず、何事もなくデバッグできたので、iOSで出力しようということに。
すると、必ずではないものの、ビルド中にこんなエラーが。
image_2019_10_8.png

エラー内容を見る限り、
フォルダへのアクセスが拒否されましたって内容。
でも、実はそのフォルダ、Unityで選択して、ビルド中にはそのあたりに触れないでいたもの。
結果的に、フォルダごと消えていて、「多分自分で消したくせに拒否された」ってエラーを吐く不思議。

空のフォルダに入れていたので、特に影響はなく、再度ビルドすると問題なく出力されましたとさ。
でも、同じことが再度発生したので、ビルドは必ず空フォルダにやっといたほうがいいよ…ということで。

おしまい。

2019にアップデートして、やりたかったこととか

もう簡潔に、
デバイスの明るさを取得して調整、ってのをアプリ側でやりたくて、
その簡単な機能が2019になってやっと搭載されたから。

Screen.brightness(set / get プロパティ。0.0f ~ 1.0fの値をとる)

これだけ。

2019にアップデートして、動作変わって困ったこととか

2019にアップデートすると、.netFramework4.6.1以降にしないとVS側はまともに動かないっぽい。(アップデートしてないので、VSCodeで組んでる)
それと、PlayerSettingsがEditから消えてしまって、パッケージマネージャー( 新規 )の中に動いたので、
Buildsettingsを表示して、PlayerSettingsボタンを押して表示するようになったよ、ぐらいかな。

アップデートしてもエラーが出ないっていうのはえらい。これはホントに。

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【Unity】【Shader】Blendを試してみる

Unityのシェーダーのコードを読んでいるとBlendは当たり前のように出てくるが、重要そうな割に全然理解していなかったので、いくつかサンプルを作りながら理解してみる。

Blend SrcFactor DstFactor

よく見るパターンはこれ。Blend SrcFactor DstFactor

公式ページには次のように説明されている。

Blend SrcFactor DstFactor: Configure and enable blending. The generated color is multiplied by the SrcFactor. The color already on screen is multiplied by DstFactor and the two are added together.

SrcFactor

The generated color is multiplied by the SrcFactor.

つまり、"Fragmentシェーダーでreturnされた色"にSrcFactorを乗算する。

DstFactor

The color already on screen is multiplied by DstFactor

該当Shaderが処理される前に、すでに画面に描画されている色にDstFactorを乗算する。

最終的に描画される色

上記二つの色を加算するので、次のようになる。

Shaderで計算した色 * SrcFactor + 既に画面に描画されている色 * DstFactor

検証

青(0,0,1)のPlaneの上方向に、赤(1,0,0)から緑(0,1,0)のグラデーションテクスチャをセットしたQuadを配置。このQuadのにセットしたシェーダーでBlendを変更してみる。

スクリーンショット 2019-10-08 9.58.38.png

Blend factors

公式ページによるとBlend factorは10個あって、SrcFactorとDstFactorに設定できるので、合計100通りの組み合わせがあることにある。
全部確認するのは大変なので、その内のいくつかを試してみる。

One, Zero

  • Shaderで計算した色 * One = Shaderで計算した色
  • 既に画面に描画されている色 * Zero = (0,0,0)

っといった風に各色をそのまま使用するか、あるいは黒にしてしまう。

Blend One One

赤(1,0,0) * 1 + 青(0,0,1) * 1 = (1,0,1)
から
緑(0,1,0) * 1 + 青(0,0,1) * 1 = (0,1,1)
へのグラデーションになっているっぽい

スクリーンショット 2019-10-07 9.37.33.png

Blend Zero One

シェーダーで計算された色に0を乗算するので、既にあるPlaneの色だけが描画される。

赤(1,0,0) * 0 + 青(0,0,1) * 1 = (0,0,1)
緑(0,1,0) * 0 + 青(0,0,1) * 1 = (0,0,1)

スクリーンショット 2019-10-07 9.42.14.png

Blend One Zero

既にあるPlaneの色に0をかけるので、グラーデーションの色が描画される

赤(1,0,0) * 1 + 青(0,0,1) * 0 = (1,0,0)
緑(0,1,0) * 1 + 青(0,0,1) * 0 = (0,1,0)

スクリーンショット 2019-10-07 9.46.35.png

Blend Zero Zero

シェーダーで計算された色、既にあるPlaneの色のどちらにも0を乗算するので、黒(0,0,0)になる

赤(1,0,0) * 0 + 青(0,0,1) * 0 = (0,0,0)
緑(0,1,0) * 0 + 青(0,0,1) * 0 = (0,0,0)

スクリーンショット 2019-10-07 9.48.53.png

SrcColor, DstColor

SrcColor

The value of this stage is multiplied by the source color value.

Shaderで計算された色を乗算する

DstColor

The value of this stage is multiplied by frame buffer source color value

既に描画されている(実際にはバッファに保存されている?)色を乗算する。

Blend Zero SrcColor

シェーダーで計算した色とPlaneの色は被っている要素がないので、Quadを配置した部分は黒(0,0,0)になる。

赤(1,0,0) * 0 + 青(0,0,1) * 赤(1,0,0) = (0,0,0)
緑(0,1,0) * 0 + 青(0,0,1) * 緑(0,1,0) = (0,0,0)

スクリーンショット 2019-10-08 7.28.37.png

Blend DstColor Zero

この場合もQuadは黒になる。

赤(1,0,0) * 青(0,0,1) + 青(0,0,1) * 0 = (0,0,0)
緑(0,1,0) * 青(0,0,1) + 青(0,0,1) * 0 = (0,0,0)

Blend SrcColor Zero

シェーダーで計算した色を2乗することになるので、全体的に暗くなる。
例えば(0.5, 0.5, 0)の点を考えると

(0.5, 0.5, 0) * (0.5, 0.5, 0) + 青(0,0,1) * 0 = (0.25, 0.25 ,0)

スクリーンショット 2019-10-08 8.30.22.png

OneMinusSrcColor, OneMinusDstColor

OneMinusSrcColor

The value of this stage is multiplied by (1 - source color).

(1 - Shaderで計算された色)を乗算する。仮に計算された色が(0.3, 0.3, 0.3)だとしたら、(0.7, 0.7, 0.7)が乗算される。

OneMinusDstColor

The value of this stage is multiplied by (1 - destination color).

Blend Zero OneMinusSrcColor

Planeの青だけになる。

赤(1,0,0) * 0 + 青(0,0,1) * (1 - (1,0,0))
= 0 + (0,0,1) * (0,1,1)
= (0,0,1)

緑(0,1,0) * 0 + 青(0,0,1) * (1 - (0,1,0))
= 0 + (0,0,1) * (1,0,1)
= (0,0,1)

スクリーンショット 2019-10-08 8.54.21.png

Blend OneMinusSrcColor Zero

(0.5,0.5,0)点で考えると、
(0.5,0.5,0) * (1 - (0.5,0.5,0)) + 青(0,0,1) * 0
= (0.5,0.5,0) * (0.5,0.5,1) + 0
= (0.25,0.25,0)

画像はちょっと分かりにくいが、暗い黄色のグラデーションになる。

スクリーンショット 2019-10-08 9.39.03.png

アルファも試してみる

アルファによる変化がわかりやすいようにPlaneのテクスチャを以下のような画像に変更。

スクリーンショット 2019-10-09 13.44.14.png

SrcAlpha

The value of this stage is multiplied by the source alpha value.

Shaderで計算されたアルファを乗算する。

DstAlpha

The value of this stage is multiplied by frame buffer source alpha value.

フレームバッファに保存されたアルファを乗算する。

OneMinusSrcAlpha

The value of this stage is multiplied by (1 - source alpha).

OneMinusDstAlpha

The value of this stage is multiplied by (1 - destination alpha).

Blend SrcAlpha OneMinusSrcAlpha

公式によるとこれば一般的な透過設定とのこと。
アルファを以下の様にフラグメントシェーダーで変更した場合を考えてみる。

アルファを指定.glsl
fixed4 frag (v2f i) : SV_Target
{
    fixed4 col = tex2D(_MainTex, i.uv);
    col.a = ここを変更;
    return col;
}
前提

フラグメントシェーダーで計算された色は赤(1,0,0)、Planeの色は白(1,1,1)の点を例にとって考えてみる。

アルファを0.1とした場合

col.a = 0.1の場合は以下のように計算して、ブレンド後の色は白に近くなる。

赤(1,0,0) * 0.1 + 白(1,1,1) * (1 - 0.1)
= (0.1, 0, 0) + (0.9, 0.9, 0.9)
= (1, 0.9, 0.9)

スクリーンショット 2019-10-09 12.25.02.png

アルファを0.9とした場合

col.a = 0.9の場合は以下のように計算して、ブレンド後の色はほぼ赤となる。

赤(1,0,0) * 0.9 + 白(1,1,1) * (1 - 0.9)
= (0.9, 0, 0) + (0.1, 0.1, 0.1)
= (1, 0.1, 0.1)

スクリーンショット 2019-10-09 12.24.52.png

Blend SrcAlpha SrcAlpha

こんな設定をすることは無いだろうけど、確認のためにこの設定もためしてみる。

アルファを0.1とした場合

赤(1,0,0) * 0.1 + 白(1,1,1) * 0.1
= (0.1, 0, 0) + (0.1, 0.1, 0.1)
= (0.2, 0.1, 0.1)

黒に近くなる。

スクリーンショット 2019-10-09 13.56.08.png

アルファを0.9とした場合

白に近くなる。

赤(1,0,0) * 0.9 + 白(1,1,1) * 0.9
= (0.9, 0, 0) + (0.9, 0.9, 0.9)
= (1.0, 0.9, 0.9)

スクリーンショット 2019-10-09 13.58.06.png

今回のコード

コード自体は新規作成したUnlitシェーダーに以下の変更をしただけ。

  • Fogの記述を削除
  • Tagを変更
  • Blendを追加
Shader "Unlit/SH_GradientColor"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
    }
    SubShader
    {
        Tags { "RenderType"="Transparent" "Queue" = "Transparent" }
        LOD 100

//        Blend One One

        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex, i.uv);
                return col;
            }
            ENDCG
        }
    }
}

参考

https://wgld.org/d/webgl/w029.html

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

【Unity】【Shader】Blendを試してみる(Alpha以外)

Unityのシェーダーのコードを読んでいるとBlendは当たり前のように出てくるが、重要そうな割に全然理解していなかったので、サンプルを作りながら理解してみる。

Blend SrcFactor DstFactor

よく見るパターンはこれ。Blend SrcFactor DstFactor

公式ページには次のように説明されている。

Blend SrcFactor DstFactor: Configure and enable blending. The generated color is multiplied by the SrcFactor. The color already on screen is multiplied by DstFactor and the two are added together.

SrcFactor

The generated color is multiplied by the SrcFactor.

つまり、"Fragmentシェーダーでreturnされた色"にSrcFactorを乗算する。

DstFactor

The color already on screen is multiplied by DstFactor

該当Shaderが処理される前に、すでに画面に描画されている色にDstFactorを乗算する。

最終的に描画される色

上記二つの色を加算するので、次のようになる。

Shaderで計算した色 * SrcFactor + 既に画面に描画されている色 * DstFactor

検証

青(0,0,1)のPlaneの上方向に、赤(1,0,0)から緑(0,1,0)のグラデーションテクスチャをセットしたQuadを配置。このQuadのにセットしたシェーダーでBlendを変更してみる。

スクリーンショット 2019-10-08 9.58.38.png

Blend factors

公式ページによるとBlend factorは10個あって、SrcFactorとDstFactorに設定できるので、合計100通りの組み合わせがあることにある。
全部確認するのは大変なので、その内のいくつかを試してみる。

One, Zero

  • Shaderで計算した色 * One = Shaderで計算した色
  • 既に画面に描画されている色 * Zero = (0,0,0)

っといった風に各色をそのまま使用するか、あるいは黒にしてしまう。

Blend One One

赤(1,0,0) * 1 + 青(0,0,1) * 1 = (1,0,1)
から
緑(0,1,0) * 1 + 青(0,0,1) * 1 = (0,1,1)
へのグラデーションになっているっぽい

スクリーンショット 2019-10-07 9.37.33.png

Blend Zero One

シェーダーで計算された色に0を乗算するので、既にあるPlaneの色だけが描画される。

赤(1,0,0) * 0 + 青(0,0,1) * 1 = (0,0,1)
緑(0,1,0) * 0 + 青(0,0,1) * 1 = (0,0,1)

スクリーンショット 2019-10-07 9.42.14.png

Blend One Zero

既にあるPlaneの色に0をかけるので、グラーデーションの色が描画される

赤(1,0,0) * 1 + 青(0,0,1) * 0 = (1,0,0)
緑(0,1,0) * 1 + 青(0,0,1) * 0 = (0,1,0)

スクリーンショット 2019-10-07 9.46.35.png

Blend Zero Zero

シェーダーで計算された色、既にあるPlaneの色のどちらにも0を乗算するので、黒(0,0,0)になる

赤(1,0,0) * 0 + 青(0,0,1) * 0 = (0,0,0)
緑(0,1,0) * 0 + 青(0,0,1) * 0 = (0,0,0)

スクリーンショット 2019-10-07 9.48.53.png

SrcColor, DstColor

SrcColor

The value of this stage is multiplied by the source color value.

Shaderで計算された色を乗算する

DstColor

The value of this stage is multiplied by frame buffer source color value

既に描画されている(実際にはバッファに保存されている?)色を乗算する。

Blend Zero SrcColor

シェーダーで計算した色とPlaneの色は被っている要素がないので、Quadを配置した部分は黒(0,0,0)になる。

赤(1,0,0) * 0 + 青(0,0,1) * 赤(1,0,0) = (0,0,0)
緑(0,1,0) * 0 + 青(0,0,1) * 緑(0,1,0) = (0,0,0)

スクリーンショット 2019-10-08 7.28.37.png

Blend DstColor Zero

この場合もQuadは黒になる。

赤(1,0,0) * 青(0,0,1) + 青(0,0,1) * 0 = (0,0,0)
緑(0,1,0) * 青(0,0,1) + 青(0,0,1) * 0 = (0,0,0)

Blend SrcColor Zero

シェーダーで計算した色を2乗することになるので、全体的に暗くなる。
例えば(0.5, 0.5, 0)の点を考えると

(0.5, 0.5, 0) * (0.5, 0.5, 0) + 青(0,0,1) * 0 = (0.25, 0.25 ,0)

スクリーンショット 2019-10-08 8.30.22.png

OneMinusSrcColor, OneMinusDstColor

OneMinusSrcColor

The value of this stage is multiplied by (1 - source color).

(1 - Shaderで計算された色)を乗算する。仮に計算された色が(0.3, 0.3, 0.3)だとしたら、(0.7, 0.7, 0.7)が乗算される。

OneMinusDstColor

The value of this stage is multiplied by (1 - destination color).

Blend Zero OneMinusSrcColor

Planeの青だけになる。

赤(1,0,0) * 0 + 青(0,0,1) * (1 - (1,0,0))
= 0 + (0,0,1) * (0,1,1)
= (0,0,1)

緑(0,1,0) * 0 + 青(0,0,1) * (1 - (0,1,0))
= 0 + (0,0,1) * (1,0,1)
= (0,0,1)

スクリーンショット 2019-10-08 8.54.21.png

Blend OneMinusSrcColor Zero

(0.5,0.5,0)点で考えると、
(0.5,0.5,0) * (1 - (0.5,0.5,0)) + 青(0,0,1) * 0
= (0.5,0.5,0) * (0.5,0.5,1) + 0
= (0.25,0.25,0)

画像はちょっと分かりにくいが、暗い黄色のグラデーションになる。

スクリーンショット 2019-10-08 9.39.03.png

今回のコード

コード自体は新規作成したUnlitシェーダーに以下の変更をしただけ。

  • Fogの記述を削除
  • Tagを変更 *Alphaを試してないので不要だったかも。
  • Blendを追加
Shader "Unlit/SH_GradientColor"
{
    Properties
    {
        _MainTex ("Texture", 2D) = "white" {}
    }
    SubShader
    {
        Tags { "RenderType"="Transparent" "Queue" = "Transparent" }
        LOD 100

//        Blend One One

        Pass
        {
            CGPROGRAM
            #pragma vertex vert
            #pragma fragment frag
            #include "UnityCG.cginc"

            struct appdata
            {
                float4 vertex : POSITION;
                float2 uv : TEXCOORD0;
            };

            struct v2f
            {
                float2 uv : TEXCOORD0;
                float4 vertex : SV_POSITION;
            };

            sampler2D _MainTex;
            float4 _MainTex_ST;

            v2f vert (appdata v)
            {
                v2f o;
                o.vertex = UnityObjectToClipPos(v.vertex);
                o.uv = TRANSFORM_TEX(v.uv, _MainTex);
                return o;
            }

            fixed4 frag (v2f i) : SV_Target
            {
                // sample the texture
                fixed4 col = tex2D(_MainTex, i.uv);
                return col;
            }
            ENDCG
        }
    }
}

参考

https://wgld.org/d/webgl/w029.html

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

Unity玉転がしチュートリアル 1-1.ゲーム画面の構成

この記事の対象者

  • Unity入門したい人
  • 最初の一歩が踏み出せない人

OSとか環境とか

  • Windows 10 Pro
  • macOS Mojave
  • Unity 2019.2.8f1
  • Rider 2019.2.2

補足

  • 公式動画にて利用しているのはMacなので、Windowsユーザーはある程度脳内変換して見る事
  • 筆者はWindows、Macの両方の環境で確認。Ubuntuとかでは検証してない。
  • 基本Unityは英語メニューで利用
  • 間違いがあったらツッコミ大歓迎

公式のリンク

https://unity3d.com/jp/learn/tutorials/projects/roll-ball-tutorial/setting-game

プレイフィールドの追加

・プレイフィールドを作る為にUnity標準のPlaneを利用
GameObject>3D Object>Planeで追加
(HierarchyのCreateメニューからも同様の追加が可能)
・GameObjectの名前を変更(Plane→Groundに変更)

初期状態だと「新しいフォルダ」みたいな感じの名前になってると思って下さい
e46b09a9-6247-4ba1-abad-356d4525d3f1.png

Transformの歯車アイコンからResetをクリックして座標や回転などをリセット
249dcc49-cd37-45f4-ac39-7581e4b732a8.png

グリッドの表示/非表示はSceneビューのGizmosメニューのShow Gridをクリックして切り替え

ce75897c-8941-44a3-a29b-04f5ffdd92fb.png

スケールの変更について

  • スケールツールでドラッグして大きさを変える方法
  • 直接数値を入力する方法

Planeでは体積がないのでY軸のスケールは正の値を増やしても別に何も変化なし

なお、Sceneでオブジェクトを選択してFキー(Edit>Frame Selectedでも同様の動きだが、面倒くさいのでショートカットを覚える)でそのオブジェクトに対してカメラのフォーカスを当てることが出来る

プレイヤーオブジェクトの追加

Sphereオブジェクトを利用
Hierarchy>Create>Sphereを選択

Unityで扱う際に大きさの単位があり

  • cube
  • sphere
  • capsule

には標準単位が割り当てられている
直径が1単位なので、原点に配置しているSphereをPlaneの上に配置するには
Yを0.5単位上にずらすだけで良い(半径は0.5なので)

差別化

SphereとPlaneの両方があるけど、どっちも白い色なんでコントラストをつけましょう

色をつけるにはmaterial(マテリアル)が必要
※詳しい説明やテクスチャについては割愛
materialを保存するフォルダ(materials)をProjectビューで作成

フォルダを選択してProjectビューからCreate>materialを選択してmaterialファイル(*.matファイル)を作成する

色を変更して、濃い青色のmaterialを作る

a3b11651-47cb-47ee-abda-5598c27fda7a.png

動画では0,32,64(RGB)のカラーを指定
作ったmaterialの色を適用させるには、ドラッグでオブジェクトに対して指定するだけ
動画ではGroundの色を変えているが、テンションが乗らない人は適当に変更して下さい

8cb242eb-da51-421b-90fd-6017a192d177.png

床が青くなったので大勝利

ライティング

Directional Lightを選択してRotationを変更して光の当たり方を変更して完了

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

今更Unity入門 玉転がしチュートリアル動画を追っかける

「今更Unityっすか?情弱?」という声が聞こえてきそうだが、始めるのに遅すぎる事はないって偉い人が言ってたので学習始めます。

この記事の対象者

  • ゲーム制作してみたいけど意味分かんない人
  • 何から手を付ければいいかわからない人
  • 入門書を買ったけど、結局やらなかった人

Unityって何

https://unity.com/ja
すべての人に必要らしいです。
ざっくり言うと「ゲーム作成といえばこれ」ぐらい浸透している開発環境。
モストマスキュラー。
公式が全てなのでブックマークマークバーからはみ出るぐらいお気に入りに入れて下さい。

今回の食材

玉転がし
https://unity3d.com/jp/learn/tutorials/s/roll-ball-tutorial

公式が提供しているチュートリアル。
バージョンの関係で所々違う箇所があるが愛でカバー。
英語全く駄目な人はYoutubeの字幕機能で日本語にすれば意味がわかる。
いい時代ですね。

構成は以下の通り。

※イントロダクションは本当にイントロダクション(意味不明)なので、割愛します。
動画見て下さい。

各記事にリンクを貼る方法をやった事がないので、練習がてら作ってみます。
最後まで執筆するまで更新予定です。

  1. ゲーム画面の構成とプレイヤー
    01.ゲーム画面の構成
    02.プレイヤーの移動

  2. カメラとプレイ領域
    01.カメラの移動
    02.プレイエリアの構成(執筆中)

  3. オブジェクトの収集、スコアの記録、ゲームのビルド
    01.収集するオブジェクトの作成(執筆中)
    02.Pick Up オブジェクトの収集(執筆中)
    03.カメラの移動(執筆中)
    04.プレイエリアの構成(執筆中)

与太話

昔々、DirectXで格闘ゲームを作ろうと思って開発していたがあまりの作業量の多さに挫折した経験あり
(キャラ2人作った所で死んだ)

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

[Unity] やる気のない Just Do It 動画を作成する

2019-10-08_051645.jpg

テンションの高いJust Do It! おじさんにも、やる気のないときはあります。
gif_animation_013.gif

今回は↑コレを作ってみます。

本家サイトから適当な静止画をキャプチャし、背景を透過したものをUnityにドラッグ&ドロップします。
JustDoIt.png

次に、UnityのPackage Manager から2D Animation, 2D IKをインポートします。
2019-10-08_031836.png

インポートした画像をスプライトに設定し、Sprite Editorを開きます。
2019-10-08_032245.png

2D Animation, 2D IKをインポートしているとSkinning Editorのメニューが出るのでこれを選択します。
2019-10-08_032517.png

Auto Geometry でメッシュを作成します
2019-10-08_032744.png

体と腕の間にもメッシュができてしまうような場合は、Outline DetailとSubdivideの値を調整してメッシュを作り直してください。
2019-10-08_033035.png

メッシュができたら Create Bone でボーンを作っていきます。
ボーンは親子関係があるので、腰から頭、肩から指先、腿からひざ下、のようにつないでいきます。
2019-10-08_033938.png

次に Auto Weights でボーンとメッシュを紐付けます。
2019-10-08_034344.png

が、真っ赤になってうまくいかなかったので、一旦Weights>Clearでクリアしてから Weight Brushで重みを付けていきます。

まずは頭のボーン(ここでは水色)を選択し、
2019-10-08_034832.png

そのままグリグリと塗っていきます。
2019-10-08_035048.png

ボーンを選択して回転させると、影響範囲に応じてメッシュが変形します。
2019-10-08_035200.png

引き続きどんどん塗っていきます。途中ボーンを回転させて確認しながら、重みがおかしいところを修正していきます。
2019-10-08_035614.png

また、腕・頭など、手前に来てほしいボーンは、
2019-10-08_040241.png

Edit Bone でボーンの優先を高くします。
2019-10-08_040502.png

一通り作業が済んだらApplyを押して終了。
2019-10-08_040843.png

作ったスプライトをHierarchyにドラッグ&ドロップして画面に表示します。
2019-10-08_041127.png

Inspector上でAdd Component > 2D Animation > Sprite Skin を選択し、
2019-10-08_041217.png

Create Bonesボタンを押すと
2019-10-08_041423.png

先ほどつけたBoneが追加されます。
2019-10-08_041707.png

以下のスクリプトをブラブラさせたい関節にアタッチして

PendulumTransform.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PendulumTransform : MonoBehaviour
{
    [SerializeField] Transform m_targetTr=null;
    [SerializeField, Range(-180f, 180f)] float m_range=5f;
    [SerializeField, Range(0.5f, 100f)] float m_period = 4f;
    Quaternion m_defRot;
    float m_freqTimer;

    // Start is called before the first frame update
    void Start()
    {
        if (m_targetTr == null)
        {
            m_targetTr = transform;
        }
        m_defRot = m_targetTr.localRotation;
        m_freqTimer = 0f;
    }

    // Update is called once per frame
    void Update()
    {
        m_freqTimer += Time.deltaTime / m_period;
        if(m_freqTimer > 1f)
        {
            m_freqTimer -= 1f;
        }
        float amgle = Mathf.Sin(m_freqTimer * Mathf.PI*2f);
        m_targetTr.localRotation = m_defRot * Quaternion.AngleAxis(amgle * m_range, Vector3.forward);
    }
}

パラメーターを調整して・・・
2019-10-08_042537.png

Unity RecorderでMovie化すれば完成!

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

[Unity] やる気のない Just Do It 動画を作る

2019-10-08_051645.jpg

テンションの高いJust Do It! おじさんにも、やる気のないときはあります。
gif_animation_013.gif

今回は↑コレを作ってみます。

本家サイトから適当な静止画をキャプチャし、背景を透過したものをUnityにドラッグ&ドロップします。
JustDoIt.png

次に、UnityのPackage Manager から2D Animation, 2D IKをインポートします。
2019-10-08_031836.png

インポートした画像をスプライトに設定し、Sprite Editorを開きます。
2019-10-08_032245.png

2D Animation, 2D IKをインポートしているとSkinning Editorのメニューが出るのでこれを選択します。
2019-10-08_032517.png

Auto Geometry でメッシュを作成します
2019-10-08_032744.png

体と腕の間にもメッシュができてしまうような場合は、Outline DetailとSubdivideの値を調整してメッシュを作り直してください。
2019-10-08_033035.png

メッシュができたら Create Bone でボーンを作っていきます。
ボーンは親子関係があるので、腰から頭、肩から指先、腿からひざ下、のようにつないでいきます。
2019-10-08_033938.png

次に Auto Weights でボーンとメッシュを紐付けます。
2019-10-08_034344.png

が、真っ赤になってうまくいかなかったので、一旦Weights>Clearでクリアしてから Weight Brushで重みを付けていきます。

まずは頭のボーン(ここでは水色)を選択し、
2019-10-08_034832.png

そのままグリグリと塗っていきます。
2019-10-08_035048.png

ボーンを選択して回転させると、影響範囲に応じてメッシュが変形します。
2019-10-08_035200.png

引き続きどんどん塗っていきます。途中ボーンを回転させて確認しながら、重みがおかしいところを修正していきます。
2019-10-08_035614.png

また、腕・頭など、手前に来てほしいボーンは、
2019-10-08_040241.png

Edit Bone でボーンの優先を高くします。
2019-10-08_040502.png

一通り作業が済んだらApplyを押して終了。
2019-10-08_040843.png

作ったスプライトをHierarchyにドラッグ&ドロップして画面に表示します。
2019-10-08_041127.png

Inspector上でAdd Component > 2D Animation > Sprite Skin を選択し、
2019-10-08_041217.png

Create Bonesボタンを押すと
2019-10-08_041423.png

先ほどつけたBoneが追加されます。
2019-10-08_041707.png

以下のスクリプトをブラブラさせたい関節にアタッチして

PendulumTransform.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PendulumTransform : MonoBehaviour
{
    [SerializeField] Transform m_targetTr=null;
    [SerializeField, Range(-180f, 180f)] float m_range=5f;
    [SerializeField, Range(0.5f, 100f)] float m_period = 4f;
    Quaternion m_defRot;
    float m_freqTimer;

    // Start is called before the first frame update
    void Start()
    {
        if (m_targetTr == null)
        {
            m_targetTr = transform;
        }
        m_defRot = m_targetTr.localRotation;
        m_freqTimer = 0f;
    }

    // Update is called once per frame
    void Update()
    {
        m_freqTimer += Time.deltaTime / m_period;
        if(m_freqTimer > 1f)
        {
            m_freqTimer -= 1f;
        }
        float amgle = Mathf.Sin(m_freqTimer * Mathf.PI*2f);
        m_targetTr.localRotation = m_defRot * Quaternion.AngleAxis(amgle * m_range, Vector3.forward);
    }
}

パラメーターを調整して・・・
2019-10-08_073206.png

Unity RecorderでMovie化すれば完成!

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

[Unity] 2D Animation でやる気のない Just Do It 動画を作る

2019-10-08_051645.jpg

テンションの高いJust Do It! おじさんにも、やる気のないときはあります。
gif_animation_013.gif

今回は↑コレを作ってみます。

本家サイトから適当な静止画をキャプチャし、背景を透過したものをUnityにドラッグ&ドロップします。
JustDoItFull.png

次に、UnityのPackage Manager から2D Animation, 2D IKをインポートします。
2019-10-08_031836.png

インポートした画像をスプライトに設定し、Sprite Editorを開きます。
2019-10-08_032245.png

2D Animation, 2D IKをインポートしているとSkinning Editorのメニューが出るのでこれを選択します。
2019-10-08_032517.png

Auto Geometry でメッシュを作成します
2019-10-08_032744.png

体と腕の間にもメッシュができてしまうような場合は、Outline DetailとSubdivideの値を調整してメッシュを作り直してください。
2019-10-08_033035.png

メッシュができたら Create Bone でボーンを作っていきます。
ボーンは親子関係があるので、腰から頭、肩から指先、腿からひざ下、のようにつないでいきます。
2019-10-08_033938.png

次に Auto Weights でボーンとメッシュを紐付けます。
2019-10-08_034344.png

が、真っ赤になってうまくいかなかったので、一旦Weights>Clearでクリアしてから Weight Brushで重みを付けていきます。

まずは頭のボーン(ここでは水色)を選択し、
2019-10-08_034832.png

そのままグリグリと塗っていきます。
2019-10-08_035048.png

ボーンを選択して回転させると、影響範囲に応じてメッシュが変形します。
2019-10-08_035200.png

引き続きどんどん塗っていきます。途中ボーンを回転させて確認しながら、重みがおかしいところを修正していきます。
2019-10-08_035614.png

また、腕・頭など、手前に来てほしいボーンは、
2019-10-08_040241.png

Edit Bone でボーンの優先を高くします。
2019-10-08_040502.png

一通り作業が済んだらApplyを押して終了。
2019-10-08_040843.png

作ったスプライトをHierarchyにドラッグ&ドロップして画面に表示します。
2019-10-08_041127.png

Inspector上でAdd Component > 2D Animation > Sprite Skin を選択し、
2019-10-08_041217.png

Create Bonesボタンを押すと
2019-10-08_041423.png

先ほどつけたBoneが追加されます。
2019-10-08_041707.png

以下のスクリプトをブラブラさせたい関節にアタッチして

PendulumTransform.cs
using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class PendulumTransform : MonoBehaviour
{
    [SerializeField] Transform m_targetTr=null;
    [SerializeField, Range(-180f, 180f)] float m_range=5f;
    [SerializeField, Range(0.5f, 100f)] float m_period = 4f;
    Quaternion m_defRot;
    float m_freqTimer;

    // Start is called before the first frame update
    void Start()
    {
        if (m_targetTr == null)
        {
            m_targetTr = transform;
        }
        m_defRot = m_targetTr.localRotation;
        m_freqTimer = 0f;
    }

    // Update is called once per frame
    void Update()
    {
        m_freqTimer += Time.deltaTime / m_period;
        if(m_freqTimer > 1f)
        {
            m_freqTimer -= 1f;
        }
        float amgle = Mathf.Sin(m_freqTimer * Mathf.PI*2f);
        m_targetTr.localRotation = m_defRot * Quaternion.AngleAxis(amgle * m_range, Vector3.forward);
    }
}

パラメーターを調整して・・・
2019-10-08_073206.png

Unity RecorderでMovie化すれば完成!

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

UnityからPlayFabのCloudFunctionを呼び出してみる

PlayFabにはCloudFunctionというサーバーサイドで処理するスクリプトを定義できます。
便利そうなので試しにUnityから呼び出してみます。

環境

  • Unity 2019.2.2f1
  • PlayFab SDK 2.75.191001

呼び出すスクリプトを確認

まずは管理画面でCloudScriptを確認します。(最初から用意されているものを使います)

自動化 -> Cloud Script -> リビジョン
でソースコードを確認できます。

スクリーンショット 2019-10-07 23.54.37.png

最初からhelloWorldという関数が入っているのでそれを使います。

hello_world.js
handlers.helloWorld = function (args, context) {
    var message = "Hello " + currentPlayerId + "!";
    log.info(message);

    var inputValue = null;
    if (args && args.inputValue)
        inputValue = args.inputValue;
    log.debug("helloWorld:", { input: args.inputValue });

    return { messageValue: message };
};

Unityから呼び出す

Unity側で以下のようなスクリプトを用意して実行してみます。

PlayFabDemo.cs
using PlayFab;
using PlayFab.ClientModels;
using UnityEngine;

public class PlayFabDemo : MonoBehaviour
{
    public void Start()
    {
        var loginRequest = new LoginWithCustomIDRequest {CustomId = "MyCustomId", CreateAccount = true};
        PlayFabClientAPI.LoginWithCustomID(loginRequest, OnLoginSuccess, OnError);
    }

    private void OnLoginSuccess(LoginResult loginResult)
    {
        Debug.Log("ログイン成功");

        var helloWorldRequest = new ExecuteCloudScriptRequest()
        {
            FunctionName = "helloWorld",
            FunctionParameter = new {inputValue = "naichilab"},
            GeneratePlayStreamEvent = true
        };
        PlayFabClientAPI.ExecuteCloudScript(helloWorldRequest, OnHelloWorldSuccess, OnError);
    }

    private void OnHelloWorldSuccess(ExecuteCloudScriptResult helloWorldResult)
    {
        Debug.Log(helloWorldResult.FunctionResult);
    }

    private void OnError(PlayFabError error)
    {
        Debug.Log(error.GenerateErrorReport());
    }
}

コールバック多くて見辛いですがやってることは以下の2つです。

  1. ログインする
  2. ログイン成功したらCloudFunction helloWorld を呼び出す

実行するとそれっぽいログが出てます。

スクリーンショット 2019-10-07 23.59.16.png

よい〜。

何が起きた?

image.png

こんな感じですね。

PlayFabClientAPI.ExecuteCloudScript でPlayFab上の helloWorld を呼び出しています。

便利〜〜〜

ログを確認する

CloudFunction側にある以下のログがどこに書かれるか確認してみます。

  • log.info(message);
  • log.debug("helloWorld:", { input: args.inputValue });

タイトルの概要 -> PlayStreamモニター
を開いておきます。

スクリーンショット 2019-10-08 0.08.19.png

この状態でUnity側を実行すると、イベントストリームが流れます

スクリーンショット 2019-10-08 0.09.17.png

Unity側で GeneratePlayStreamEvent = true としておくと、ここにCloudScriptの実行履歴が流れます。

スクリーンショット 2019-10-08 0.09.54.png

そこにある Information マークを押すと、実行ログの詳細を確認できます。

スクリーンショット 2019-10-08 0.10.20.png

ちゃんと2件のログが入っていました。

まとめ

  • PlayFab上で関数を定義(jsで書く)
  • Unityから ExecuteCloudScript を使って関数を実行する

こんな感じで簡単に使えました。引数も戻り値も扱えるのでかなり自由度は高いですね。

便利〜〜〜。

リンク

  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む