Unity GUI学习

作者: HotRay | 来源:发表于2017-07-19 16:35 被阅读0次

学习 Unity GUI笔记，有各种学习资料网址！

1.http://www.wyzc.com/Course/Course/showAction/id/16352/center/0 视频学习资料。。

http://www.easyar.cn/view/docs/Getting-Started/Getting-Started-with-EasyAR.html 官方代码

http://weibo.com/Edstick?is_hot=1 AR 提取
http://edu.manew.com/course/183 蛮牛
C#
基本数据类型，
整数
Int uint
Long ulong
Float double
Boll ture false

复合数据类型
Struct person{
String m_name ;
Int m_age l
String m_sex;

}
Enuw weekday{
Sunday,Mondaym,Tuesday,Wednesdar ,Thursday ,Friday,Saturday

}
Class New 来初始化，interface 借口，delegate，array.
（１）
现在都用这个UGUI高级， gui低级。
第一个选项啥意思，downloadlayout！我选择了这个！

第一个创建butt的UGUI的程序
OnGuI 系统会自己去调用，GUI 是一个框架吧。。
void OnGUI(){
if (GUI.Button (new Rect (0f, 0f, 200f, 200f), "GUI_BUTTON")) {
框架，属性，结构体。名字，事件。
Debug.Log ("我被点击了");
}
}
}

//UI设计。。
Create· 下UI创建button , 导入图片，设置texture Type 2d And UI,设置set Navitin size 跟图片一样大。
//上面那个怎么弄啊。。

（２）
Canvas 画布，就相当于一个ｗｉｎｄｏｎ
属性。。
2D UI ，ovelay 始终在屏幕前方　　　没有显示２Ｄ　３Ｄ的效果。
Camera 2Ｄ　三Ｄ绑定　相机。。
ｗｏｒｌｄ　ｓｐａｃｅ　直接３ｄ
（３）
ｔｅｘｔＵＩ　控件。
ｕｉｎｇ　导入头文件
ｖｏｉｄ　ｓｔａｒｔ　（）｛
程序一开始调用的。
｝
ｖｏｉｄ　ｕｐｄａｔｅ（）｛

字面理解为更新时候调用
｝
标签格式。。ＸＭＬ　都是成对的。。！
＜ｓｉｚｅ　＝　５０＞＜／ｓｉｚｅ＞。设置字体大小。
＜ｂ＞＜／ｂ＞，＜ｉ＞＜ｉ＞
＜ｃｏｌｏｒ　＝　＃ｆｆｆｆｆｆ＞＜ｃｏｌｏｒ＞

引入对象，ｔｒａｎｓｆｏｒｍ．ｇｅｔＣｏ，ｐｏｎｅｎｔ＜对象＞．属性　　＝　＂赋值＂　＋　拼接　反正一切属性，都是写在＂＂这个里面。对象的话要用《》来引用。
富文本属性　ｒｅｃｈ　ｔｅｘｔ　，勾选的。。！
（４）
ｉｍａｇｅ组件，图片
Material 素材要创建一个material 然后选择UI 才能正常显示。。
勾选属性。。
Simple 等比缩放，
Sliced 九宫格缩放，这个设置图片，拉伸。。
Titled 平铺，不会被拉伸，而是铺满这个设计尺寸。。！
Filled 动画填充，用来做技能ID 冷却时间的。。！fill Method 填充的方法。。 fill OriGin 方向从哪里开始。。主要是360 method
1 4 可以选择设置图片大小相同。。。
(5)RawImage 控件。大型的Image 上面可以添加视图的。。！
该组件可以用来显示任意纹理。包括RenderTexTure .Movie Texture
基本属性
1. TexTure纹理要显示的纹理
2. Color颜色：如果TeX Ture 是空的，那么久=会使用当前设置颜色，来填充矩形区域
3. Material 材质球，可以选择UI类型的shader，来对其赋值
4. UV Rect UV 矩形：设置纹理显示区域。。
和Image 的区别多了一个texture 这个属性。。！
实际的开发中用的比较少。。！
1. Button 控件。
设置状态，transtion，有四个状态。
分为四种状态，正常，鼠标在按钮上，点击，失效。
动画，点击创建一个自动的按钮。。！生成一个动画文件。。
然后在点击，Windows 下的动画。。在点击当前的对象。。进行动画编辑。。
点击事件。
创建一个文件。对button进行关联，点击属性找对象，然后在类里面的方法。。
文件代码里面写.
Using UnityEngine.UI;导入系统UI控件矿建
Transform.GetComponent<Button>().onClick.AddListener(TowClock);onCick.addlistener是什么意思？
（6）Toggle *
多了一个backgroud 和一个label属性，label里面有字体富文本属性。
Background 是图片的背景，都是image属性，可以按照image来设置。Checkmack小图标的一个属性。。勾选的属性。
设置 toggle group 进行单选、
代码实现
using UnityEngine;
using System.Collections;
using UnityEngine.UI;

public class Toggle_01 : MonoBehaviour {

// Use this for initialization
void Start () {
    transform.GetComponent<Toggle> ().onValueChanged.AddListener (changevalue);

}

public void changevalue(bool aselct){
    if (aselct) {
        Debug.Log ("一开始点击了");


    } else {
        Debug.Log ("又被点击了一下");
    }
    Debug.Log ("toggle被点击了");
}
// Update is called once per frame
void Update () {

}

}
按钮的事件监听。。
（7）Dropdown *
下拉列表！不可以滑动的。直接是固定的。。！
右边按钮点击＋号，添加options
然后就是代码的添加操作itme,主要学怎么应用。。！
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
public class DropDown : MonoBehaviour {
public Dropdown MyDropdown;
// Use this for initialization
void Start () {
Dropdown.OptionData _data1 = new Dropdown.OptionData ();
_data1.text = "选择1";
Dropdown.OptionData _data2 = new Dropdown.OptionData ();
_data2.text = "选择2";
Dropdown.OptionData _data3 = new Dropdown.OptionData ();
_data3.text = "选择3";
Dropdown.OptionData _data4 = new Dropdown.OptionData ();
_data4.text = "选择4";
//MyDropdown.options.Add()
//引用的是unity的dropdown ，直接操作，他添加的是Dropdown.OptionData _data2；
MyDropdown.options.Add (_data1);
MyDropdown.options.Add (_data2);
MyDropdown.options.Add (_data3);
MyDropdown.options.Add (_data4);
//onvaluechangged
MyDropdown.onValueChanged.AddListener (Onselectindex);
}

// Update is called once per frame
void Update () {

}
//他需要一个int 32的
public void Onselectindex (int index){

    Debug.Log ("当前的下标=" + index.ToString () + "选项名字" + MyDropdown.captionText);
}

（8）slider 滑块
绑定监听事件。。
public class Myslider : MonoBehaviour {

// Use this for initialization
void Start () {
    
//    transform.GetComponent<Slider> ().onValueChanged.AddListener (myvalueChange);

}

// Update is called once per frame
void Update () {

}
public void myvalueChange (float value){
    Debug.Log ("当前的值" + value.ToString());
}

}
（9）ScrollBar滑动条
和slider 逻辑一样。组件的介绍
和事件的响应。
每一个控件都有一个接口方法，而且都可以进行关联，或者是直接进行赋值的一个接口。。！
接口的方法都是可以写的！可以再代码里面重写。。UI 会自己调用的。。！

(10)inputfilter 就是文本输入框
他有两个输入方法，接口。。！一个结束和一个在输入的时候进行调用的。。！
（11）scrollerct ** 牵扯到自己定对象。。！
这个明天弄。搞不定。。。
这个总体来说还是比较难得，首先你要搞清楚图层的渲染顺序
还有就是弄明白，每个属性的作用，和进行关联。
共有三个对象。！
Scrollrect 滚动comtent，关联滚动条，下面有mack ->mack对象关联->image对象，遮罩完成。->BG 设置图片、->创建scrollbar ;
(12)GridLayoutGroup 用来布局很多类型的集合的。。。
他是父视图直接设置尺寸，而且都是等比的。。！
（13）Hoirztall
水平组件，运行我们定制水平Item的大小。。layout elment 来控制。。！
（14）VerticalLayoutgroup
垂直组件，允许我们定位item的大小，kayout ekment 来控制。
缩放和边距的距离的属性。

（15）
Pivot 中心点的两个作用
1. 控制着recttransform 的psX psY 与Anchor的相对距离
2. 解决屏幕自适应的。。！
3. 只往一个方向进行拉伸，比如只往左/右/下/上作单向拉伸；
（16）实战 SD冷却图。。
using UnityEngine;

using System.Collections;
导入UI框架
using UnityEngine.UI;

public class SDskills : MonoBehaviour {
引入Unity 图形，声明对象
public Button Mybutton;

public Image  Myimage;

public Text McdText;

为什么这个用const呢？
public const float MAX_CODE_TIME = 3;
设置一个浮点为0 来记时
private float curTime = 0;
// Use this for initialization
void Start () {
首先调用遮蔽层，设置为nil；
Endskill ();
点击事件，onClick.Addlistener (方法名字)；
Mybutton.onClick.AddListener (stactButtoncilk);

}

// Update is called once per frame

这个方法什么时候调用啊！
void Update () {

如果遮蔽层隐藏。
if (false == Mybutton.interactable) {
如果myimage.fillAmount value 大于等于1 或者大于0
if(Myimage.fillAmount <= 1f &&Myimage.fillAmount> 0f){
这句话的意思就是取当前的值；
curTime += Time.deltaTime;
最大值-当前值 % 最大值 = 图片的一个比例值。
Myimage.fillAmount = (MAX_CODE_TIME - curTime) / MAX_CODE_TIME;
这句话是什么意思？
McdText.text = Mathf.CeilToInt (MAX_CODE_TIME - curTime).ToString ();
if(Myimage.fillAmount == 0){
Endskill ();
}

        }

    } 

}
void stactButtoncilk (){
    
    StartSkill ();
}

开始调的方法
void StartSkill(){
Mybutton.interactable = false;
Myimage.fillAmount = 1f;
McdText.text = MAX_CODE_TIME.ToString ();
curTime = 0f;
}
结束的时候调。
void Endskill(){
Mybutton.interactable = true;
Myimage.fillAmount = 0f;
McdText.text = string.Empty;
curTime = 0f;
}
}
（17）进度条实现跳转方法。。
using UnityEngine;
using System.Collections;
using UnityEngine.UI;
系统提供的异步加载页面方法列表
using UnityEngine.SceneManagement;
public class porgess : MonoBehaviour {
进度条
public Image myimageview;
返回的是一个可选的异步。
private AsyncOperation masync;
// Use this for initialization
记录进度条的值
private int cyrprogessVal;
public Text text;
void Start () {

     StartCoroutine (LoadScene());
}
//IEnumerable  调错方法了。。！

异步加载方法
IEnumerator LoadScene(){
masync = SceneManager.LoadSceneAsync ("navgtionVC");
masync.allowSceneActivation = false;
yield return masync;

}
// Update is called once per frame
void Update () {

Null 没nil
if(masync == null){

        return;
    }
    int propressvalue = 0;
    //zhege shuxing nali lai de !
    if (masync.progress < 0.9f) {
        propressvalue = (int)masync.progress * 100;


    } else {
    
        propressvalue = 100;
    }
    if(cyrprogessVal<propressvalue){
        cyrprogessVal++;

    }
    text.text = cyrprogessVal+"%";
    myimageview.fillAmount = cyrprogessVal / 100f;
    if(cyrprogessVal == 100){

        masync.allowSceneActivation = true;

    }

}

}
跳转的页面要设置File ,buldseting;
IEnumerator 这个不要写错了。。！
SseneManager.loadSceneAsync 是系统提供的方法进行跳转界面的，，！
你现在要弄清楚图层的渲染顺序。。！这个是重点。。！
背包实战，图像渲染的顺序。。！
1. GameBG 都是在这个imageview下操作的。。！
2. 他里面有一个滑动的view;scollerrect ，Viewpoint 视图位置，遮罩视图，滑动的内容。。
3. 遮罩里面包括布局类，布局类还牵扯到一个contens of size 得给他挂一个。。！这个就可以滑动到最下面。。！记得操作Perferred size 自动帮你换算里面的内容。。！

总结。。！
基本UI的操作都是差不多的，！比较难得就是滚动视图了。。！其实这都是操作图片。。调用借口。。！学了跳转界面加载界面，界面之间的通信呢？还有视图的消失，还有生命周期，都还不知道。。！
基本操作，创建UI，然后编写脚本进行绑定，操作对象，进行赋值！就是C#的语法，数据类型，不明白。。！要深入学习的话还是要学习C#的！

Unity GUI学习

学习 Unity GUI笔记，有各种学习资料网址！

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读