Help us understand the problem. What is going on with this article?

【Unityアドカレ2019・冬】Soft Mask でいい感じにマスキングする

はじめに

この記事は、Unityアセット冬のアドベントカレンダー 2019 Winter! の、9日目の記事です。

Unityアセット冬のアドベントカレンダー 2019 Winter! – Unity公式 Asset Portal

Soft Mask のご紹介

Soft Mask - Asset Store

Soft Mask はUI要素をなめらかにマスキングするためのコンポーネントです。Unity標準の Mask や Mask Rect 2D と似ていますが、それらにはない利点を持っています。

  • Mask Rect 2D と違ってマスクの回転をサポートしている。
  • Mask と違って透明度をサポートしているので、なめらかなマスキングができる。

スクリーンショット 2019-12-06 14.01.38.png

エビフライは、かわいいフリー素材集 いらすとや 様からお借りしました。

使い方

Soft Mask をアセットストアからインポートします。
スクリーンショット 2019-12-06 14.04.04.png

Soft Mask コンポーネントをゲームオブジェクトに追加します。
スクリーンショット 2019-12-06 14.03.20.png

これだけです!非常に簡単。
スクリーンショット 2019-12-06 15.33.16.png

ヒエラルキーはこのようになります。
スクリーンショット 2019-12-06 15.30.31.png

Unityの標準Maskコンポーネントを使ったことがある人ならお気づきでしょうが、追加するコンポーネントが変わっただけで、基本的な使い方は同じです。とても簡単!

コンポーネント

コンポーネントのプロパティについて見ていきます。
スクリーンショット 2019-12-06 15.32.23.png

Source

Graphic, Sprite, Textureから選択します。Graphicを選択した場合、アタッチされているImageコンポーネントかRawImageコンポーネントを参照してマスキングされます。SpriteまたはTextureは、画像を直接指定したいときに使用します。

Separate Mask

通常はSoftMaskコンポーネントのアタッチされているゲームオブジェクトがマスクとして使われますが、このプロパティをセットした場合は、セットされたゲームオブジェクトをマスクとして使用します。

Raycast Threshold

レイキャストを通す閾値を指定します。デフォルトは0で、領域のすべての入力を通します。これを0より大きくすることで、指定した値以上の不透明部分でしか入力を受け付けないようにすることができます。

Invert Mask

マスクが反転できます。
スクリーンショット 2019-12-06 14.16.05.png

Invert Outsides

マスクの外側を反転します。これをチェックすると、上の画像の外側の透明な部分が不透明になります。

Mask Channel

画像のどの色成分をマスクとして使うか指定できます。普通はデフォルトのAlphaでいいと思いますが柔軟に設定できるようです。
スクリーンショット 2019-12-06 15.55.31.png

スクリプティング

スクリプトはSoftMaskingネームスペースに全部入ってます。コメントも書いてありますし、小さいスクリプトなので、簡単に使えるでしょう。

using SoftMasking;

public class Something : MonoBehaviour {
    void Start() {
        var mask = gameObject.GetComponent<SoftMask>();
        // なんかやる
    }
}

おわりに

以上、ソフトなマスクを使いたい人におすすめのアセット紹介でした!

紹介し切れていない部分も多いので、興味のある方はアセットストアでチェックしてみてください!
Soft Mask - Asset Store

読んでいただき、ありがとうございました。

Chiwawa
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした