UGUI

1.通过Slider设置图片的滑动时加载的效果

2.Image Type

Image分为四个类型

Simple:有个Preserve Aspect,勾选后UI会保持相对大小而不是填充整个Canves

Sliced:可以保证被切割的部分不会随着放大缩小而失真,需要在图片自身的Sprite Editor里设置九宫格所切的部分,切割后只有中心部分会拉伸

Tiled:根据图片自身的大小铺满Image

Filled:可以设置加载/切割的大小(如左到右或360)

 

3.控制技能冷却,通过改变图片的Fill Amount值来显示图片

UI中放在最下面的图片是最靠近表层的(如同一个物体中有许多图片时,位在最下面的会覆盖前面的)

 1 using System.Collections;
 2 using System.Collections.Generic;
 3 using UnityEngine;
 4 using UnityEngine.UI;
 5 
 6 public class Skill : MonoBehaviour {
 7 
 8     public float coldTime = 2f;     //冷却时间
 9     private Image fillIcon;
10     private float timer = 0f;       //计时器
11     private bool isClick = false;
12     public KeyCode keyCode;
13 
14 
15     
16     
17     // Use this for initialization
18     void Start () {
19         fillIcon = transform.Find("FillIcon").GetComponent<Image>();
20         fillIcon.fillAmount = 0;
21     }
22     
23     // Update is called once per frame
24     void Update () {
25 
26         //通过快捷键触发技能
27         if (Input.GetKey(keyCode))
28         {
29             isClick = true;
30         }
31 
32         //改变Fill Amount的值
33         if (isClick)
34         {
35             timer += Time.deltaTime;
36             fillIcon.fillAmount = (coldTime - timer) / coldTime;
37             if(timer>=coldTime)
38             {
39                 fillIcon.fillAmount = 0;
40                 timer = 0;
41                 isClick = false;
42             }
43         }
44     }
45 
46     public void OnClick()
47     {
48         isClick = true;
49     }
50 }
Skill Cold

 

4.可以在Component -> layout里给物体添加各种平铺的组件

直接把图片放到带有layout组件的物体下面会出现某些问题(如偏移等)

可以先创建一个空物体设置好相应位置,然后把UI放入空物体中并让Pivot定在中心位置

父物体会影响子物体但是不太会影响到孙物体

(如设置grid后图片就不能随意拖拽摆放,而是自动排列,但是创建一个空的object并把图片放入其中就可以随意拖放)

 

 5.Scroll Rect组件

设置Scroll Rect组件后把内容放到此物体下面就可以实现在范围内滑动

添加Mask组件可以隐藏显示范围外的物体,不选Show Mask Graphic能把组件所在的图片隐藏掉

 1 using System.Collections;
 2 using System.Collections.Generic;
 3 using UnityEngine;
 4 using UnityEngine.EventSystems;     //IBeginDragHandler,IEndDragHandler这两个接口的命名空间
 5 using UnityEngine.UI;
 6 
 7 public class LevelScroll : MonoBehaviour, IBeginDragHandler, IEndDragHandler {
 8 
 9     private ScrollRect scrollRect;
10     private float[] scrollArray = new float[] { 0f, 0.48f, 0.96f };
11     private float targetPos = 0;
12     private bool isDrag = false;
13 
14     public Toggle[] toggleArray;     //在脚本面板里把相应的Toggle按钮拖拽进去 
15 
16     // Use this for initialization
17     void Start()
18     {
19         scrollRect = GetComponent<ScrollRect>();
20     }
21 
22     void Update()
23     {
24         //实现滑动结束后缓慢滑动到目标位置的效果
25         //此处如果不设置条件在点击来回滑动时会出现闪烁bug
26         if (isDrag == false)
27         {
28             scrollRect.horizontalNormalizedPosition = Mathf.Lerp(scrollRect.horizontalNormalizedPosition, targetPos, Time.deltaTime * 4);
29         }
30 
31     }
32 
33     public void OnBeginDrag(PointerEventData eventData)
34     {
35         isDrag = true;
36     }
37 
38     public void OnEndDrag(PointerEventData eventData)
39     {
40         //Siki老师写的
41         //float posX = scrollRect.horizontalNormalizedPosition;
42         //int index = 0;
43         //float offset = Mathf.Abs(scrollArray[index] - posX);
44         //for(int i=1;i<scrollArray.Length;i++)
45         //{
46         //    float offsetTemp = Mathf.Abs(scrollArray[i] - posX);
47         //    if(offsetTemp<offset)
48         //    {
49         //        index = i;
50         //        offset = offsetTemp;
51         //    }
52         //}
53         //scrollRect.horizontalNormalizedPosition = scrollArray[index];
54 
55 
56         isDrag = false;
57 
58         //有点小问题,有时候滑动处于中间位置时会滞留在那一区域
59         //当前水平位置(0 ~ 1)
60         float posX = scrollRect.horizontalNormalizedPosition;
61 
62         //位置赋值
63         for (int i = 0; i < scrollArray.Length; i++)
64         {
65             float offset = Mathf.Abs(posX - scrollArray[i]);
66             if (offset <= 0.2)
67             {
68                 targetPos = scrollArray[i];
69                 toggleArray[i].isOn = true;     //相应的toggle按钮也开启
70             }
71         }
72 
73     }
74 
75     //通过Toggle移动到指定位置
76     public void Page1(bool isON)
77     {
78         if(isON)
79         {
80             targetPos = scrollArray[0];
81         }
82     }
83 
84     public void Page2(bool isON)
85     {
86         if (isON)
87         {
88             targetPos = scrollArray[1];
89         }
90     }
91 
92     public void Page3(bool isON)
93     {
94         if (isON)
95         {
96             targetPos = scrollArray[2];
97         }
98     }
99 }
Level Scroll

 

6.开关的切换

由于Toggle组件只能设置图片的显示与隐藏,而不能设置图片+文字的切换,所以此处要用脚本来实现

通过Switch 上Toggle组件的isOn开关来控制ON/OFF两个GameObject的激活

 1 using System.Collections;
 2 using System.Collections.Generic;
 3 using UnityEngine;
 4 using UnityEngine.UI;
 5 
 6 public class AudioSwitch : MonoBehaviour {
 7 
 8     public GameObject audioON;
 9     public GameObject audioOFF;
10     private Toggle switchToggle;
11 
12     // Use this for initialization
13     void Start () {
14         switchToggle = GetComponent<Toggle>();
15         SwitchAudio(switchToggle.isOn);
16 
17     }
18     
19     public void SwitchAudio(bool isON)
20     {
21        audioON.SetActive(isON);
22        audioOFF.SetActive(!isON);
23     }
24     
25 }
AudioSwitch

 

 

7.input Field

PlaceHolder: 显示的是未输入时的默认文字,当有输入后就会disable其中的Text组件

可以在Content Type那设置输入内容,设置为PassWord后输入的文字会自动变成****

转载于:https://www.cnblogs.com/QQW123/p/9164275.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值