[学习笔记]圆形图片的生成方式

系统自带的Mash非常耗费性能,这里学习一种通过脚本将图片修改成圆形的方式。效果就是下面这种。

注释比较清晰,直接贴代码

using UnityEngine;
using UnityEngine.Sprites;
using UnityEngine.UI;

//自定义圆形图片
public class CircleImage : Image
{
    //圆行由多少个三角形组成
    private int segements = 50;

    //这个方法,会将图片的顶点,三角信息,发送到GUP。这里重写自己构建一个圆
    protected override void OnPopulateMesh(VertexHelper vh)
    {
        vh.Clear();
        //得到图片的宽高
        float width = rectTransform.rect.width;
        float height = rectTransform.rect.height;
        //得到UV
        Vector4 uv = overrideSprite != null ? DataUtility.GetOuterUV(overrideSprite) : Vector4.zero;
        float uvWidth = uv.z - uv.x;
        float uvHeight = uv.w - uv.y;

        //UV中心点
        Vector2 uvCenter = new Vector2(uvWidth * 0.5f, uvHeight * 0.5f);
        //UV和长度之间的比值
        Vector2 convertRatio = new Vector2(uvWidth / width, uvHeight / height);
        //三角形的弧度
        float radian = (2 * Mathf.PI) / segements;
        //半径
        float radius = width * 0.5f;

        //这里用一个中间值保存,再赋值,是因为下面位置和UV的赋值是同时的,不能用position对UV进行赋值
        Vector2 tempVec = Vector2.zero;
        //圆的中心点
        UIVertex origin = new UIVertex();
        origin.color = color;
        origin.position = tempVec;
        origin.uv0 = new Vector2(tempVec.x * convertRatio.x + uvCenter.x, tempVec.y * convertRatio.y + uvCenter.y);
        vh.AddVert(origin);

        //计算其他的点
        float vertCount = segements + 1;  //点的个数是三角个数+1
        float angle = 0;
        for (int i = 0; i < vertCount; i++)
        {
            float xTemp = Mathf.Cos(angle) * radius;
            float yTemp = Mathf.Sin(angle) * radius;
            angle += radian;

            UIVertex originTemp = new UIVertex();
            originTemp.color = color;
            tempVec = new Vector2(xTemp, yTemp);
            originTemp.position = tempVec;
            originTemp.uv0 = new Vector2(tempVec.x * convertRatio.x + uvCenter.x, tempVec.y * convertRatio.y + uvCenter.y);
            vh.AddVert(originTemp);
        }

        //设置三角形,点由顺时针方向组成三角形,组成的图形才能看见
        int id = 1;
        for (int i = 0; i < segements; i++)
        {
            vh.AddTriangle(id, 0, id + 1);
            id++;
        }
    }
}

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值