UGUI_關卡選項介面

MR_L先生發表於2018-04-27
UGUI

1.Image元件—“Source Image”，Set Native Size.

2.Image元件—“Image Type”——Sliced

  編輯要放大縮小的圖片，Sprite Editor，採用九宮格切圖。

3.建立空物體（作為父物體），新增Componment—Layout—Grid Layout Group（是下面的子物體自動排列）

    建立空物體和建立Panel作為父物體是由區別的！

4.錨點問題，是GUI中容易忽視但卻十分重要的點。

5.Prefabs的有效使用，後期通過更改Prefabs來進行完整的對映修改。

6.滾動圖片列表的製作

   （1）選項卡圖示排列整齊

   （2）建立一個Image元件—“背景圖”，命名為ScrollPanel（作為父物體，作為Mask），此時將選項卡託至此背景圖下作為子物體。

   （3）在“背景圖”上新增“Scroll Rect”滑動組建，Content物件為選項卡圖示集合，來控制子物體。

   （4）在“背景圖”上新增”Mask”組建。

   （5）按頁數進行滑動（分頁）指令碼

   （6）單選按鈕，進入制定頁面，並與滑鼠滑動指令碼相關聯。

     

 1 using System.Collections;
 2 using System.Collections.Generic;
 3 using UnityEngine;
 4 using UnityEngine.EventSystems;
 5 using UnityEngine.UI;
 6 
 7 public class LevelButtonScrollRect : MonoBehaviour ,IBeginDragHandler,IEndDragHandler{
 8 
 9     // Use this for initialization
10     private ScrollRect scrollRect;
11     private float[] pageArrayFloats = new[] {0, 0.33333f, 0.66666f, 1}; 
12     void Start ()
13     {
14         scrollRect = GetComponent<ScrollRect>();
15     }
16     
17     // Update is called once per frame
18     void Update () { 
19         
20     }
22     public void OnBeginDrag(PointerEventData eventData)
23     {
24         
25     }
27     public void OnEndDrag(PointerEventData eventData)
28     {
29         //Vector2 offsetTemp = scrollRect.normalizedPosition;
30         float offsetTemp = scrollRect.horizontalNormalizedPosition;
31         print(offsetTemp);    
33     }
34 }

 

父物體新增過”ToggleGroup”元件

 1 using System.Collections;
 2 using System.Collections.Generic;
 3 using UnityEditor;
 4 using UnityEngine;
 5 using UnityEngine.EventSystems;
 6 using UnityEngine.UI;
 7 
 8 public class LevelButtonScrollRect : MonoBehaviour ,IBeginDragHandler,IEndDragHandler{
 9 
10     // Use this for initialization
11     private ScrollRect scrollRect;
12     private float[] pageArrayFloats = new[] {0, 0.33333f, 0.66666f, 1};
13     private float targetHorizontalPosition = 0;                              //預設為第一頁
14     private bool isDrag = false;
15     public float speed = 5f;
16     void Start ()
17     {
18         scrollRect = GetComponent<ScrollRect>();                             //尋找元件，物體間的通訊
19     }
20     
21     // Update is called once per frame
22     void Update () {
23         if (isDrag==false)
24         {
25             scrollRect.horizontalNormalizedPosition = Mathf.Lerp(scrollRect.horizontalNormalizedPosition,
26                 targetHorizontalPosition, speed * Time.deltaTime);
27         }
28     }
29 
30     public void OnBeginDrag(PointerEventData eventData)
31     {
32         isDrag = true;
33     }
34 
35     public void OnEndDrag(PointerEventData eventData)
36     {
37         isDrag = false;
38         float posX = scrollRect.horizontalNormalizedPosition;
39         int index = 0;
40         float offset = Mathf.Abs(pageArrayFloats[index] - posX);
41         for (int i = 0; i < pageArrayFloats.Length; i++)
42         {
43             float offsetTemp = Mathf.Abs(pageArrayFloats[i] - posX);
44             if (offsetTemp < offset)
45             {
46                 index = i;
47                 offset = offsetTemp;
48             }
49         }                                                                   //哪一頁的位置與當前頁的位置差最小，就定在哪一頁上
50         //scrollRect.horizontalNormalizedPosition = pageArrayFloats[index];
51         targetHorizontalPosition = pageArrayFloats[index];
52     }
53 }
54 //注：最後一次滑鼠滑動的位置是確定的，讓這個位置與每一頁的位置（4頁的位置）比較，差值最小的，則固定在（4頁位置）中的哪一頁上 
55 //多次判斷語句，用到for迴圈（特別是for{if（）{}}）

 

相關文章