零基础入门 16: UGUI RawImage

今天的内容会很简单,也会很短,分享一下UGUI的RawImage,那什么是RawImage呢?

RawImage是比Image还要原生的不可交互的贴图显示组件,那它和Image有什么区别呢?

进入正题


RawImage是UGUI的显示贴图的组件之一,它比Image更加的简单。

还记得前几篇分享的Image吧,Image这个组件的目标贴图只能支持Sprite类型的图片。其他的图片类型是不支持的,而RawImage则可以支持任何类型的贴图。

如下是Unity的贴图类型。

我们在项目中默认导入的图片类型都是Texture的。但是直接将这样的图片拖动到Image上是不被允许的。但是却可以拖动到RawImage上。如下图。

下面是贴图导入默认格式Texture显示图。

再来看看RawImage组件的内容和Image组件的内容对比

从上图可以看到,RawImage除了比Image多了对贴图UV的设置以外,其他的内容和Image基本一致。

所以RawImage直接区别于Image的点,就是对目标贴图的类型,可使用范围更多,但对贴图的操作使用却比Image稍少。

而实际项目中,RawImage还有另外一个使用的用途,那就是把摄像机(Camera)渲染(投射)出来的贴图显示在UI上。

如下图,我们在项目中创建一个RenderTexture。命好名后拖动到摄像机上。

此时我们运行,Unity会提示如下。

我们再创建一个摄像机,然后将MainCamera上的位置等信息全都赋值给新创建的摄像机。然后重新运行。

为了不被干扰,我们把测试的Image删掉,只保留RawImage。然后创建一个Cube立方体,放到摄像机的前面,然后对摄像机进行一些修改。可以让我们的摄像机把照射到的内容渲染到贴图上。

此时我们运行项目,然后把摄像机渲染的这张renderTexture拖给RawImage进行UI上的显示。

以上就是今天对RawImage的分享。

有了Image的基础,加上对RawImage的了解,以及在实际项目中的使用案例,相信大家可以对RawImage有一个很好的理解。

今天的内容就到这里咯。Bye~~~

原文发布于微信公众号 - 韩东吉的Unity杂货铺(DeveloperJimin)

原文发表时间:2017-02-07

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Jacklin攻城狮

翻译_iOS视图编程指南(View Programming Guide for iOS)之介绍

在iOS中,你可以使用窗口和视图将你应用的内容呈现在屏幕上。窗口本身是不具备呈现可视化内容的功能的,但它可以用作装有应用视图的容器。视图可以规定在窗口的某一部分...

1243
来自专栏james大数据架构

jquery.mobile手机网页简要

先上最终效果: ? ? ? ? ? 最近做了一个用手机浏览器访问的web应用,采用较流行的HTML5,为了提高开发效率节省时间决定采用现有开源框架,免去了自己做...

2527
来自专栏DeveWork

移动端UC /QQ 浏览器的部分私有Meta 属性

如同桌面端一样,在国内做web 移动开发的话肯定得考虑下移动端占有率靠前的几个国产浏览器的一些适配工作。好在当前移动端浏览器都是wekit 内核一霸天下,单从这...

31810
来自专栏web前端教室

【课堂笔记】先行者 3.0版本的vueJs课程的第三次课

今次是vue课程的第3次课,内容大体上是: 一、事件; 在vue当中,事件是使用v-on指令,它可以定义一个方法来调用。 语法: <input v-on:...

2249
来自专栏葡萄城控件技术团队

HTML5 & CSS3初学者指南(1) – 编写第一行代码

介绍 网络时代已经到来。现在对人们来说,每天上网冲浪已经成为一种最为常见的行为。 在网页浏览器中输入一段文本地址,就像http://www.codeprojec...

2596
来自专栏前端笔记

【HTML5 理论知识】就H5调试技巧,浅谈:iPhone X 适配方案!

image.png 2017年9月苹果发布了iPhone X机型,对于它的“刘海儿”和底部Home Indicator。我们可以通过以下三种方案进行适配~下...

6918
来自专栏每日一篇技术文章

VR+全景播放器+头控讲解-05

1441
来自专栏企鹅号快讯

5个你可能不知道的CSS属性

每年都有新的CSS属性被标准化,并在主流浏览器中可用。 它们旨在使Web开发人员的工作变得轻松,创造出新颖美丽的网站。 在这篇文章中,我将介绍5个相对较新的CS...

1998
来自专栏腾讯社交用户体验设计

[ISUX译]iOS 9人机界面指南(四):UI元素(上) - 腾讯ISUX

2055
来自专栏腾讯社交用户体验设计

极速适配 iPhone X 秘笈

2034

扫码关注云+社区

领取腾讯云代金券