Unity3d中UGUI组件精简复盘RawImage组件

Posted ProMer_Wang

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Unity3d中UGUI组件精简复盘RawImage组件相关的知识,希望对你有一定的参考价值。

上一节,我们简单概括了Unity3D编辑器中渲染层级简要介绍。具体详情链接为:Unity3d中UGUI组件精简复盘(四)Image组件,话不多说,我们直接进入正题~ 今天我们简要概括复盘的组件便是RawImage组件啦~


在Unity3D中的组件布局是这样的:

RawImage组件

Texture: 图片资源为Default模式下就可直接拖入,Image组件则不同,需要将图片资源设置为sprite模式才可进行拖入给图片资源

UV Rect: UV坐标(x,y)(范围0~1),贴图纹理都是有UV坐标的,对应的是贴图映射到贴图表面的效果,应用: 可以做成帧动画

三维模型除了顶点XYZ坐标就是UV坐标了,先上图:

img

它的坐标是这样的,定义纹理坐标的顺序为:(0,0)-》(1.0,0.0)-》(0.0,1.0)-》(1.0,1.0)【不要搞错哦】
至于绘制顺序为什么是这样?原因的话,这就需要了解一些图形学方面的内容。了解过DX的朋友应该知道这么一个流程,构建顶点=》构建点、线、带=》构建面=》模型。顶点的绘制顺序是怎样的,取决于它所依赖的渲染管线。


以下是之前测试帧动画的一段代码,代码的怎么去定义,取决于你的帧动画图片的顺序是怎么样。

TestRawImageAni.cs

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

public class TestRawImageAni: MonoBehaviour {
    private RawImage _rawImage;
    private float _offsetX;
    private float _offsetY;


	void Start () {
         _rawImage = GetComponent<RawImage>();
         _offsetX = 1 / 2.0f;//每一行有多少张序列帧图片
         _offsetY = 1 / 4.0f;//每一列有多少张序列帧图片
         StartCoroutine(Ani());
    }

	//协程控制帧动画
    private IEnumerator Ani()
    {
        float x = 0;
        float y = 0;
        while(true)//控制当前帧动画一直播放
        {
            y += _offsetY;
            while(x<1)
            {
                x += _offsetX;
                _rawImage.uvRect = new Rect(x, y, _rawImage.uvRect.width, _rawImage.uvRect.height);
                yield return new WaitForSeconds(0.3f);//设置延时
            }
            x = 0;
        }
    }
}

RawImage应用:在UI上显示3D模型

在文件夹下,创建Render Texture

将RenderTexture 作为摄像机的Target Texture

然后再讲文件夹线下的RenderTexture 作为RawImage的Texture ,此时就可以了

如果想要不显示3D模型的背景图,则将Camera的Clear Flags设置为Solid Color 即可。

在这里插入图片描述

RT:Render Texture 的简称

以上呢,便是我对Image组件作出的简要的描述,这几节的内容都比较简单,没有太多的内容,但是也希望能够对你有所帮助~ 也希望能获得你们的关注、点赞、评论吖~
你们的点赞、评论就是我前进的动力!

熬夜将这几天所欠缺的内容一起总结了一下,还是那句话,更新也许会迟到,但一定会到哈。在这里插入图片描述

如果博客博友对这个章节有更多的内容想要了解的,可以评论哈,等这一个章节结束后,我会根据评论反馈,将评论中反馈的内容在下一个计划中去制作出对应的内容的哈~

作者:ProMer_Wang

链接:https://blog.csdn.net/qq_43801020/article/details/117611868

本文为ProMer_Wang的原创文章,著作权归作者所有,转载请注明原文出处,欢迎转载!

以上是关于Unity3d中UGUI组件精简复盘RawImage组件的主要内容,如果未能解决你的问题,请参考以下文章

Unity3d中UGUI组件精简复盘RawImage组件

Unity3d中UGUI组件精简复盘(十四)Dropdown组件

Unity3d中UGUI组件精简复盘(十七)LayoutElement组件

Unity3d中UGUI组件精简复盘(十七)LayoutElement组件

Unity3d中UGUI组件精简复盘Toggle组件

Unity3d中UGUI组件精简复盘Toggle组件