1. 程式人生 > >UGUI強制新手引導製作方案

UGUI強制新手引導製作方案

強制新手引導一般來說就是限制點選區域,只能點選遊戲引導固定的區域.我們的思路就是試用一張遮罩圖片來遮罩全屏,然後把想要點選的物體的渲染層級放在最頂層,然後點選遮罩圖片的時候使用事件穿透讓我們想要點選的物體來接受事件.大概效果如下圖

這裡寫圖片描述

可以看到我們想要點選的按鈕圖片的渲染層級已經被放在最上層了.只需要自己寫shader來改變渲染佇列就可以了.和官方內建的shader都一樣只是改變了渲染佇列

圖片shader

Shader "UI/Image Top"
{
    Properties
    {
        _MainTex("Base (RGB), Alpha (A)"
, 2D) = "white" {} } SubShader { LOD 200 Tags { //在這裡改變渲染佇列 "Queue" = "Overlay" "IgnoreProjector" = "True" "RenderType" = "Transparent" } Pass { Cull Off Lighting Off ZWrite Off Fog{ Mode Off } ColorMask RGB AlphaTest Greater .01
Blend SrcAlpha OneMinusSrcAlpha ColorMaterial AmbientAndDiffuse CGPROGRAM #pragma vertex vert #pragma fragment frag #include "UnityCG.cginc" sampler2D _MainTex; float4 _MainTex_ST; struct appdata_t { float4 vertex : POSITION; half4 color : COLOR;
float2 texcoord : TEXCOORD0; }; struct v2f { float4 vertex : POSITION; half4 color : COLOR; float2 texcoord : TEXCOORD0; }; v2f vert(appdata_t v) { v2f o; o.vertex = mul(UNITY_MATRIX_MVP, v.vertex); o.color = v.color; o.texcoord = v.texcoord; return o; } half4 frag(v2f IN) : COLOR { // Sample the texture half4 col = tex2D(_MainTex, IN.texcoord) * IN.color; return col; } ENDCG } } }

字型shader

Shader "UI/Font Top"
{
    Properties
    {
        _MainTex("Base (RGB), Alpha (A)", 2D) = "white" {}
    }

    SubShader
    {
        LOD 200

        Tags
        {
        "Queue" = "Overlay"
        "IgnoreProjector" = "True"
        "RenderType" = "Transparent"
        }

        Pass
        {
            Cull Off
            Lighting Off
            ZWrite Off
            Fog{ Mode Off }
            ColorMask RGB
            AlphaTest Greater .01
            Blend SrcAlpha OneMinusSrcAlpha
            ColorMaterial AmbientAndDiffuse

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

    sampler2D _MainTex;
    float4 _MainTex_ST;

    struct appdata_t
    {
        float4 vertex : POSITION;
        half4 color : COLOR;
        float2 texcoord : TEXCOORD0;
    };

    struct v2f
    {
        float4 vertex : POSITION;
        half4 color : COLOR;
        float2 texcoord : TEXCOORD0;
    };

    v2f vert(appdata_t v)
    {
        v2f o;
        o.vertex = mul(UNITY_MATRIX_MVP, v.vertex);
        o.color = v.color;
        o.texcoord = TRANSFORM_TEX(v.texcoord, _MainTex);
        return o;
    }

    half4 frag(v2f IN) : COLOR
    {
    fixed4 col = IN.color;
    col.a *= tex2D(_MainTex, IN.texcoord).a;
    return col;
    }
        ENDCG
    }
    }
}

還有最後一步,就是需要讓事件透過我們的遮罩層,讓我們的按鈕來響應點選,下面上程式碼

public class GuidePostEvent : MonoBehaviour , IPointerClickHandler
{
    //監聽點選
    public void OnPointerClick(PointerEventData eventData)
    {
        //事件穿透
        PassEvent(eventData, ExecuteEvents.pointerClickHandler);
    }

    public void PassEvent<T>(PointerEventData data, ExecuteEvents.EventFunction<T> function)
      where T : IEventSystemHandler
    {
        List<RaycastResult> results = new List<RaycastResult>();
        EventSystem.current.RaycastAll(data, results);
        GameObject current = data.pointerCurrentRaycast.gameObject;
        for (int i = 0; i < results.Count; i++)
        {
            if (current != results[i].gameObject)
            {
                //在這裡判斷事件穿透檢測到的物件是不是我們新手引導需要點選的物件
                GuideStep step = results[i].gameObject.GetComponent<GuideStep>();
                if (step != null)
                {
                    //再判斷引導id是否是屬於當前的引導id,畢竟我們一個面板上也許會出現很多
                    //引導物件
                    int currentStepId = GuideManager.Singleton.GetStepID();
                    bool exists =   Array.Exists<int>(step.StepID, element => element == currentStepId);
                    if (exists)
                        ExecuteEvents.Execute(results[i].gameObject, data, function);
                }
            }
        }
    }
}

把上面的指令碼掛在我們的引導遮罩層就可以了,只需要自己寫個指令碼掛在點選物件上來接受事件就可以了.

非常的簡單.