版权申明:

  • 本文原创首发于以下网站:
  1. 博客园『优梦创客』的空间:https://www.cnblogs.com/raymondking123
  2. 优梦创客的官方博客:https://91make.top
  3. 优梦创客的游戏讲堂:https://91make.ke.qq.com
  4. 『优梦创客』的微信公众号:umaketop
  • 您可以自由转载,但必须加入完整的版权声明

目标

  • Logo UI界面的制作
  • UI界面的淡入

Logo UI界面的制作

  • 首先右键创建一个Canvas重命名为UI Root其次在其子节点创建一个Panel重命名为Logo UI并把我们的颜色更改为自己喜欢的颜色即可,例如下图



    上面步骤完成后我们在Panel底下继续创建一个空的对象(Gameobject)重命名为Alpha,并添加Canvas Group组件,这个组件到时候用来控制我们的Logo淡入的效果。

    最后我们只需在Alpha的子节点添加一个Image组件和一个Text组件即可,添加完成后,把Image组件选择一张自己喜欢的图片,Text组件写上自己想说的话,然后调整至合适的大小



    最后回到我们的Alpha组件找到Canvas Group组件把组件底下的Alpha值设置为0即可。

  • 这样我们的UI界面就搭建完成了!

UI界面的淡入

  • 在我们的Script脚本底下新建一个名为UI Root的脚本并打开,打开后编写如下代码
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI; public class UIRoot : MonoBehaviour
{
public RectTransform Logo;//引用LogoUI
// Start is called before the first frame update
void Start()
{
StartCoroutine(ShowLogo());
}
/// <summary>
/// 一个动画,让透明度慢慢的变不透明
/// 这是一个协成
/// </summary>
/// <returns></returns>
IEnumerator ShowLogo()
{
//找到Alpha动画节点
var cg = Logo.Find("Alpha").GetComponent<CanvasGroup>();
//判断Alpha是否小于0.95,是的话,就一直往不透明(1,0)的差值
while (cg.alpha < 0.95)
{
//一直往不透明(1,0)差值
cg.alpha = Mathf.Lerp(cg.alpha, 1, Time.deltaTime);
yield return null;
}
cg.alpha = 1;
yield return new WaitForSeconds(0.5f);
//到这里,Logo的不透明动画就播放完了 //下一步,隐藏Logo画面
Logo.gameObject.SetActive(false);
}
}
  • 然后把我们的脚本拖给UI Root组件即可

    最后别忘了把LogoUI拖给我们的脚本

Fire Balls 10——UI界面的制作的更多相关文章

  1. NGUI 学习笔记实战——制作商城UI界面

    http://www.cnblogs.com/chongxin/p/3876575.html Unity3D的uGUI听说最近4.6即将推出,但是目前NGUI等UI插件大行其道并且已经非常成熟,所以我 ...

  2. [UI] 精美UI界面欣赏[10]

    精美UI界面欣赏[10]

  3. Solr4.10.2集成Nutch1.9与自带UI界面使用

    Solr4.10.2集成Nutch1.9与自带UI界面使用 一.Solr4.10.2与Nutch1.9集成 环境:Solr4.10.2已经配置在Tomcat上 Solr的Tomcat配置详见Solr4 ...

  4. 单据UI界面设计开发

    1.新建单据界面数据 2.创建数据模型,包括单据.单据行.设置应用缺省特性,每个模型树下只有一个红色项 3.新增动作,系统默认没有弃审支作按钮事件 4. 新增UI Form,选择对应的模型树及表单类别 ...

  5. 转载:21个免费的UI界面设计工具、资源及网站

    我们刚刚介绍了移动设计初探:触屏网页设计.本文将介绍一些UI界面与设计使用的元素.软件和网站.内容很丰富,适合用户体验设计师.界面设计师.产品设计师.JS前段开发.手机产品设计以及iPad和平板电脑产 ...

  6. 【转】21个免费的UI界面设计工具、资源及网站

    本文将介绍21个免费的UI界面设计工具.资源及网站,如果你在做用户体验设计.界面设计.产品设计.JS前段开发.手机产品设计以及iPad和平板电脑产品设计,不妨来看看. AD: 2013云计算架构师峰会 ...

  7. Android开发1:基本UI界面设计——布局和组件

    前言 啦啦啦~本学期要开始学习Android开发啦~ 博主在开始学习前是完完全全的小白,只有在平时完成老师要求的实验的过程中一步一步学习~从此篇博文起,博主将开始发布Android开发有关的博文,希望 ...

  8. windows下运行的linux服务器批量管理工具(带UI界面)

    产生背景: 由于做服务器运维方面的工作,需要一人对近千台LINUX服务器进行统一集中的管理,如同时批量对LINUX服务器执行相关的指令.同时批量对LINUX服务器upload程序包.同时批量对LINU ...

  9. 使用AsyncTask异步更新UI界面及原理分析

    概述: AsyncTask是在Android SDK 1.5之后推出的一个方便编写后台线程与UI线程交互的辅助类.AsyncTask的内部实现是一个线程池,所有提交的异步任务都会在这个线程池中的工作线 ...

随机推荐

  1. asp.net core系列 70 即时通迅-WebSocket+Redis发布订阅

    一.概述 在asp.net core 中可以用WebSocket 或asp.net core SignalR来开发即时通迅.在项目中由于开发前后端分离,对于SignalR前端技术人员不想依赖juqer ...

  2. 2019中山纪念中学夏令营-Day9[JZOJ](第六次模拟赛)

    Begin (题目的排序方式:Unkown其实是按心情排的) 异或:(摘自百度百科) 异或(xor)是一个数学运算符.它应用于逻辑运算.异或的数学符号为“⊕”,计算机符号为“xor”.其运算法则为: ...

  3. 11个rsync使用实例

    rsync表示 remote sync,其用于在本地或与远程主机间进行文件或目录备份.相比较scp等工具,rsync有以下优点: 速度:除首次全拷贝外,其他时候实现增量拷贝,加快传输速度 安全:传输数 ...

  4. 01、VM安装教程

    1.运行下载完成的Vmware Workstation虚拟机软件包,将会看到如图所示,然后点击“下一步”按钮, 2.在最终用户许可协议界面选中“我接受许可协议中的条款”复选框,然后点击“下一步”按钮 ...

  5. 本地(任意)时间戳转化(转换)标准时间格式 js(eg:2019-05-07 17:49:12)

    <script> function getLocalTime(timestamp) { // 如果以秒为单位 // var dateObj = new Date(timestamp * 1 ...

  6. SBT安装及命令行打包spark程序

    1.从https://www.scala-sbt.org/download.html官网上寻找所需要的安装包 可以直接本地下载完扔进去也可以wget路径,在这里我用的是sbt1.2.8版本的,下载到/ ...

  7. c语言实现基本的数据结构(三) 栈

    #include <stdio.h> #include <tchar.h> #include <stdlib.h> #define StackSize 5 #def ...

  8. Amazon S3 分布式存储的 python 接口实现

    Amazon s3 是一种分布式的对象存储.用键值对的方式,来存储数据.其中,存入的所有数据都是一个对象(object),每一个对象都有一个键(key)存在. 具有非常方便的 web 访问接口,以及权 ...

  9. 域名、主机名、网站名以及 URL 基础概念

    这个东西,在百度经验上已经有人讲得非常清楚了, 作为 web 方向的小白, 我写下我的理解,以便日后查看. 以 https:// www.3vjia.com 为例, 见下图: DNS (Domain ...

  10. 【Spring Boot】利用 Spring Boot Admin 进行项目监控管理

    利用 Spring Boot Admin 进行项目监控管理 一.Spring Boot Admin 是什么 Spring Boot Admin (SBA) 是一个社区开源项目,用于管理和监视 Spri ...