1效果展示

功能實(shí)現(xiàn)：點(diǎn)擊按鈕，圖片出現(xiàn)，在點(diǎn)擊一次，圖片消失，可以選擇圖片出現(xiàn)的方式和出現(xiàn)的位置

2圖片設(shè)置

新建一個(gè)image，拖入一張圖片，在Fill Method中選擇第四個(gè)：Filled（填充）

?設(shè)置填充方式，開始填充方向，和填充百分比設(shè)置不同的圖片展示效果

3代碼設(shè)置

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

//填充類型的枚舉
public enum FillType{
    Horizontal,      //水平出現(xiàn)
    Vertical,        //豎直
    Radial_90,       //旋轉(zhuǎn)90度
    Radial_180,     //旋轉(zhuǎn)180度
    Radial_360      //旋轉(zhuǎn)360度
}

public class test : MonoBehaviour
{
    public FillType fillType;           //填充類型
    [SerializeField]Image image;        //圖片
    [SerializeField] int fillOrigin = 0;//填充的開始位置的索引，默認(rèn)為第一個(gè)

    Button btn;
    bool isClick;                      //是否點(diǎn)擊按鈕
    // Start is called before the first frame update
    void Start()
    {
        //組件獲取
        image =image.GetComponent<Image>();
        btn = GetComponent<Button>();

        //按鈕點(diǎn)擊事件
        btn.onClick.AddListener(delegate
        {
            //點(diǎn)擊按鈕，圖片出現(xiàn)，再點(diǎn)擊一次，圖片消失
            if (isClick)
                image.gameObject.SetActive(true);
            else
                image.gameObject.SetActive(false);

            isClick = !isClick;
        });

    }

    float value = 0;
    // Update is called once per frame
    void Update()
    {
        //圖片顯示時(shí)，圖片緩慢出現(xiàn)
        if (image.gameObject.activeSelf)
        {
            if (value >= 0 && value < 1)
                value += Time.deltaTime;
        }
        else
            value = 0;

        //設(shè)置圖片的類型
        image.type = Image.Type.Filled;

       //圖片出現(xiàn)的枚舉
        switch (fillType)
        {
            case FillType.Horizontal:
                image.fillMethod = Image.FillMethod.Horizontal;
                image.fillOrigin = fillOrigin;
                image.fillAmount = value;
                break;
            case FillType.Vertical:
                image.fillMethod = Image.FillMethod.Vertical;
                image.fillOrigin = fillOrigin;
                image.fillAmount = value;
                break;
            case FillType.Radial_90:
                image.fillMethod = Image.FillMethod.Radial90;
                image.fillOrigin = fillOrigin;
                image.fillAmount = value;
                break;
            case FillType.Radial_180:
                image.fillMethod = Image.FillMethod.Radial180;
                image.fillOrigin = fillOrigin;
                image.fillAmount = value;
                break;
            case FillType.Radial_360:
                image.fillMethod = Image.FillMethod.Radial360;
                image.fillOrigin = fillOrigin;
                image.fillAmount = value;
                break;
            default:
                break;
        }
    }
}

將代碼拖到一個(gè)Button上，將需要變換的圖片拖進(jìn)去，通過(guò)改變填充類型和填充開始方向?qū)崿F(xiàn)圖片出現(xiàn)的不同效果

4鏈接

鏈接：https://pan.baidu.com/s/1TgmMjcD3jFWrk4ezkwh95g?
提取碼：jl98文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-513355.html

到了這里，關(guān)于unity設(shè)置圖片的填充方式的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！