当前位置:   article > 正文

Unity_3 创建自己的UI界面_unity 3d 选歌界面如何制作

unity 3d 选歌界面如何制作

前言

这篇开始学习有关UI和C#的内容了。

UI界面的搭建

这里我们完成可以从UI界面进行运算的功能:A+B=?。
  • 1

首先新建一个Canvas(布),之后的输入框和输出框都在这个Canvas上建立
在这里插入图片描述
然后在Canvas中新建两个input Field,用来进行输入。
在这里插入图片描述
然后新建两个Text,用来表示+和结果Result,使界面更完整。根据自己的喜好调节颜色,位置和大小。
在这里插入图片描述
再建立一个点击按钮Button,只要一点击这个按钮,后面的TextResult就出结果,相当于=。
Note:这里可以调节字在框中的位置。
在这里插入图片描述
界面整体如图:

用代码将各部件连接,完成功能
首先创建一个空物体,我理解的是这些操作都要附着于一个物体上才可以。我给这个物体起名叫MainFuctions。
![在这里插入图片描述](https://img-blog.csdnimg.cn/20210401114310786.png
根据逻辑写好代码:

using UnityEngine;
using System.Collections;
using UnityEngine.UI;   //

public class UI1 : MonoBehaviour {
	public InputField InputFieldA;
	public InputField InputFieldB; // 这是两个输入模块,需要code控制。
	public Text TextResult;		//这是输出答案的模块,需要code控制。
	void Start () {
	}

	//写一个计算的函数
	public void calculation(){
		//注意InputField模块下有个Text,是控制输入的文字的,默认为string类型。
		string A=InputFieldA.text;
		string B=InputFieldB.text;
		int C=int.Parse(A)+int.Parse(B);// 将string强制转换为int,再计算。
		TextResult.text = C.ToString();//将int强制转换为string。
		Debug.Log (TextResult.text);
	}
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21

然后写好代码后将代码拖入物体:MainFuctions。
将代码和此物体关联起来,如果代码没有错误,那么右边会显示代码中所用到的组件。
在这里插入图片描述
将事实物体拖入代码中,使其对应。
在这里插入图片描述
设置鼠标控制的物体:物体名MainFuctions。以及方法。
![在这里插入图片描述](https://img-blog.csdnimg.cn/20210401130033909.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0FzaGVzT2ZUaW1lZWVl,size_16,color_FFFFFF,t_7
此时便可以运行了,界面最后如图所示:
在这里插入图片描述

添加背景图片:
Note1:UI界面里,所有图片或者音乐使用的时候都需要转化为2D。
在这里插入图片描述
Note2:Canvas中有层次之分,如果在最下层,就让它在最上面。
在这里插入图片描述
将2D图片拖入并且设置为全屏即可。(按住ALT键选择图片模式)
在这里插入图片描述
效果图:
在这里插入图片描述

添加背景音乐并且设置按钮
首先把你要添加的背景音乐和声音图标都换成2D的(之前讲过了)。
首先设置一个控制音乐的按钮Button_Audio,点击它可以开关音乐(随便设置图片就可以):
在这里插入图片描述
然后设置音源。
东西准备好了之后写代码:

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

public class UI1_1 : MonoBehaviour {
	public AudioSource JAY;  //你的音源名称
	public Image AudioImg;//用来设置音标图片。
	public bool isadudio = true;//每点击一次就会变换
	public Sprite[] audiosprite;//用来换图片。

	public void clickbun(){
		isadudio = !isadudio;
		if (isadudio ) {
			//打开音乐,换图片
			JAY.Play();
			AudioImg.sprite=audiosprite[0];
		} else {
			//关闭音乐,换图片
			JAY.Stop();
			AudioImg.sprite=audiosprite[1];
		}
	}
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23

note:如果不想音乐每次都重头播放,改成暂停函数:.Pause();
将代码拖入物体,并且与事实对应:
Note:为什么audio img中拖入的是按钮button呢,因为这里要和button里面的图片对应。
在这里插入图片描述
将物体拖入Button_Audio,就可以完成了。
在这里插入图片描述

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/从前慢现在也慢/article/detail/140761?site
推荐阅读
相关标签
  

闽ICP备14008679号