devbox
小丑西瓜9
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

unity目录滑动展示效果_unity左右滑动切换图片

作者：小丑西瓜9 | 2024-05-22 06:22:24

赞

踩

unity左右滑动切换图片

一：只能滑动一个按钮的记录

一、效果展示

 图片可以外部修改，但是目前这个包图片数量是固定的6个，可以再inspector面板中修改图片的个数，对应文字的个数和StreamingAssets中的图片个数也应该修改，

按左右两边的按钮也可以左右滑动，一次只能滑动一个图片，

适用于做一个项目的目录

二：代码

  1. using System.Collections;
  2. using System.Collections.Generic;
  3. using UnityEngine;
  4. using UnityEngine.UI;
  5. using UnityEngine.EventSystems;
  6. using DG.Tweening;
  7.  
  8. public class SliderCanMoveScrollView : MonoBehaviour, IBeginDragHandler, IEndDragHandler
  9. {
  10.     //content的长度计算方法：（cellLength + spacing）*(num-1)
  11.     private RectTransform contentTrans;
  12.     private float beginMousePositionX;
  13.     private float endMousePositionX;
  14.     private ScrollRect scrollRect;
  15.  
  16.     public int cellLength;
  17.     public int spacing;
  18.     public int leftOffset;
  19.     private float moveOneItemLength;
  20.  
  21.     private Vector3 currentContentLocalPos;//上一次的位置
  22.     private Vector3 contentInitPos;//Content初始位置
  23.     private Vector2 contentTransSize;//Content初始大小
  24.  
  25.     public int totalItemNum;
  26.     private int currentIndex;
  27.  
  28.     public Text pageText;
  29.  
  30.     public bool needSendMessage;
  31.  
  32.     private void Awake()
  33.     {
  34.         scrollRect = GetComponent<ScrollRect>();
  35.         contentTrans = scrollRect.content;
  36.         moveOneItemLength = cellLength + spacing;
  37.         currentContentLocalPos = contentTrans.localPosition;
  38.         contentTransSize = contentTrans.sizeDelta;
  39.         contentInitPos = contentTrans.localPosition;
  40.         currentIndex = 1;
  41.         if (pageText != null)
  42.         {
  43.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  44.         }
  45.     }
  46.  
  47.     public void Init()
  48.     {
  49.         currentIndex = 1;
  50.  
  51.         if (contentTrans != null)
  52.         {
  53.             contentTrans.localPosition = contentInitPos;
  54.             currentContentLocalPos = contentInitPos;
  55.             if (pageText != null)
  56.             {
  57.                 pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  58.             }
  59.         }
  60.     }
  61.  
  62.     /// <summary>
  63.     /// 通过拖拽与松开来达成翻页效果
  64.     /// </summary>
  65.     /// <param name="eventData"></param>
  66.  
  67.     public void OnEndDrag(PointerEventData eventData)
  68.     {
  69.         endMousePositionX = Input.mousePosition.x;
  70.         float offSetX = 0;
  71.         float moveDistance = 0;//当次需要滑动的距离
  72.         offSetX = beginMousePositionX - endMousePositionX;
  73.  
  74.         if (offSetX > 0)//右滑
  75.         {
  76.             if (currentIndex >= totalItemNum)
  77.             {
  78.                 return;
  79.             }
  80.             if (needSendMessage)
  81.             {
  82.                 UpdatePanel(true);
  83.             }
  84.  
  85.             moveDistance = -moveOneItemLength;
  86.             currentIndex++;
  87.         }
  88.         else//左滑
  89.         {
  90.             if (currentIndex <= 1)
  91.             {
  92.                 return;
  93.             }
  94.             if (needSendMessage)
  95.             {
  96.                 UpdatePanel(false);
  97.             }
  98.             moveDistance = moveOneItemLength;
  99.             currentIndex--;
  100.         }
  101.         if (pageText != null)
  102.         {
  103.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  104.         }
  105.         DOTween.To(() => contentTrans.localPosition, lerpValue => contentTrans.localPosition = lerpValue, currentContentLocalPos + new Vector3(moveDistance, 0, 0), 0.5f).SetEase(Ease.OutQuint);
  106.         currentContentLocalPos += new Vector3(moveDistance, 0, 0);
  107.     }
  108.  
  109.     /// <summary>
  110.     /// 按钮来控制翻书效果
  111.     /// </summary>
  112.  
  113.     public void ToNextPage()
  114.     {
  115.         float moveDistance = 0;
  116.         if (currentIndex >= totalItemNum)
  117.         {
  118.             return;
  119.         }
  120.  
  121.         moveDistance = -moveOneItemLength;
  122.         currentIndex++;
  123.         if (pageText != null)
  124.         {
  125.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  126.         }
  127.         if (needSendMessage)
  128.         {
  129.             UpdatePanel(true);
  130.         }
  131.         DOTween.To(() => contentTrans.localPosition, lerpValue => contentTrans.localPosition = lerpValue, currentContentLocalPos + new Vector3(moveDistance, 0, 0), 0.5f).SetEase(Ease.OutQuint);
  132.         currentContentLocalPos += new Vector3(moveDistance, 0, 0);
  133.     }
  134.  
  135.     public void ToLastPage()
  136.     {
  137.         float moveDistance = 0;
  138.         if (currentIndex <= 1)
  139.         {
  140.             return;
  141.         }
  142.  
  143.         moveDistance = moveOneItemLength;
  144.         currentIndex--;
  145.         if (pageText != null)
  146.         {
  147.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  148.         }
  149.         if (needSendMessage)
  150.         {
  151.             UpdatePanel(false);
  152.         }
  153.         DOTween.To(() => contentTrans.localPosition, lerpValue => contentTrans.localPosition = lerpValue, currentContentLocalPos + new Vector3(moveDistance, 0, 0), 0.5f).SetEase(Ease.OutQuint);
  154.         currentContentLocalPos += new Vector3(moveDistance, 0, 0);
  155.     }
  156.  
  157.     public void OnBeginDrag(PointerEventData eventData)
  158.     {
  159.         beginMousePositionX = Input.mousePosition.x;
  160.     }
  161.  
  162.     //设置Content的大小
  163.     public void SetContentLength(int itemNum)
  164.     {
  165.         contentTrans.sizeDelta = new Vector2(contentTrans.sizeDelta.x + (cellLength + spacing) * (itemNum - 1), contentTrans.sizeDelta.y);
  166.         totalItemNum = itemNum;
  167.     }
  168.  
  169.     //初始化Content的大小
  170.     public void InitScrollLength()
  171.     {
  172.         contentTrans.sizeDelta = contentTransSize;
  173.     }
  174.  
  175.     //发送翻页信息的方法
  176.     public void UpdatePanel(bool toNext)
  177.     {
  178.         if (toNext)
  179.         {
  180.             gameObject.SendMessageUpwards("ToNextLevel");
  181.         }
  182.         else
  183.         {
  184.             gameObject.SendMessageUpwards("ToLastLevel");
  185.         }
  186.     }
  187. }

（其中content长度的计算方法也再代码中有）

图片外部导入

  1. using System;
  2. using System.Collections;
  3. using System.Collections.Generic;
  4. using System.IO;
  5. using System.Text.RegularExpressions;
  6. using UnityEngine;
  7. using UnityEngine.UI;
  8. /// <summary>
  9. /// 图片外部加载
  10. /// </summary>
  11. public class ImageManage : MonoBehaviour
  12. {
  13.     List<Sprite> imageList = new List<Sprite>();   //加载的图片的列表
  14.     [SerializeField] List<GameObject> images = new List<GameObject>();  //图片列表
  15.     [SerializeField] List<Text> texts = new List<Text>();           //图片名称列表
  16.  
  17.  
  18.     void Start()
  19.     {
  20.         LoadAllPic();
  21.         for (int i = 0; i < imageList.Count; i++)
  22.         {
  23.             //将图片赋值到预制体上
  24.             images[i].GetComponent<Image>().sprite = imageList[i];
  25.         }
  26.  
  27.     }
  28.     string[] dirs;
  29.     //外部加载图片
  30.     void LoadAllPic()
  31.     {
  32.         string imgtype = "*.JPG|*.PNG";
  33.         string[] ImageType = imgtype.Split('|');
  34.         List<string> filePathList = new List<string>();
  35.         string[] dirs1 = Directory.GetFiles(Application.streamingAssetsPath + "/image/", ImageType[0]);
  36.         List<string> dirs1List = new List<string>(dirs1);
  37.         string[] dirs2 = Directory.GetFiles(Application.streamingAssetsPath + "/image/", ImageType[1]);
  38.         //当两种格式都存在时，将第二个数组中的内容加入到第一个数组中去
  39.         if (ImageType[0] != null && ImageType[1] != null)
  40.         {
  41.             for (int m = 0; m < dirs2.Length; m++)
  42.             {
  43.                 string dir2 = dirs2[m];
  44.                 dirs1List.Add(dir2);
  45.             }
  46.             dirs = dirs1List.ToArray();
  47.         }
  48.         //当只有jpg格式时，将数组内容赋值
  49.         else if (ImageType[0] != null && ImageType[1] == null)
  50.             dirs = dirs1;
  51.         //当只有png格式时，将数组内容赋值
  52.         else if (ImageType[0] == null && ImageType[1] != null)
  53.             dirs = dirs2;
  54.  
  55.         for (int j = 0; j < dirs.Length; j++)
  56.         {
  57.             Texture2D tx = new Texture2D(100, 100);
  58.             tx.LoadImage(getImageByte(dirs[j]));
  59.             Sprite sprite = Sprite.Create(tx, new Rect(0, 0, tx.width, tx.height), new Vector2(-500, -500));
  60.  
  61.             //获取sprite的名称
  62.             sprite.name = Path.GetFileNameWithoutExtension(dirs[j]);
  63.             //将名称用“-”分割
  64.             string[] names = sprite.name.Split('-');
  65.             //获取数字后面的名字并赋值
  66.             texts[j].text = names[1];
  67.             //将获取的图片加到图片列表中
  68.             imageList.Add(sprite);
  69.         }
  70.  
  71.     }
  72.  
  73.     private static byte[] getImageByte(string imagePath)
  74. {
  75.     FileStream files = new FileStream(imagePath, FileMode.Open);
  76.     byte[] imgByte = new byte[files.Length];
  77.     files.Read(imgByte, 0, imgByte.Length);
  78.     files.Close();
  79.     return imgByte;
  80. }
  81. }

三：unity布局

先新建一个ScrollRect，将代码挂载再上面，然后再content中添加Grid Layout Group组件，设置左偏移量，图片大小和间隔，将这些数值设置好之后，填入SliderCanMoveScrollView 脚本中，content中Right的计算方法（每个图片的长度+间隔长度）*（图片数量-1）；

例如：图片长度是900，间隔是700，数量是5个，那么content的Right值为：（900+700）*4

 两个button手动添加按钮监听就可以了。

二：一次滑动多个的记录

1、UI布局

 

二：代码 

  1. using System.Collections;
  2. using System.Collections.Generic;
  3. using UnityEngine;
  4. using UnityEngine.UI;
  5. using UnityEngine.EventSystems;
  6. using DG.Tweening;
  7.  
  8. public class SlideCanCoverScrollView : MonoBehaviour, IBeginDragHandler, IEndDragHandler
  9. {
  10.  
  11.     private float contentLength;//容器长度
  12.     private float beginMousePostionX;
  13.     private float endMousePositionX;
  14.     private ScrollRect scrollRect;
  15.     private float lastProportion;//上一个位置比例
  16.  
  17.     public int cellLength;//每个单元格长度
  18.     public int spacing;//间隙
  19.     public int leftOffset;//左偏移量
  20.     private float upperLimit;//上限值
  21.     private float lowerLimit;//下限值
  22.     private float firstItemLength;//移动第一个单元格的距离
  23.     private float oneItemLength;//滑动一个单元格需要的距离
  24.     private float oneItemProportion;//滑动一个单元格所占比例
  25.  
  26.     public int totalItemNum;//共有几个单元格
  27.     private int currentIndex;//当前单元格索引
  28.  
  29.     public Text pageText;
  30.  
  31.     private void Awake()
  32.     {
  33.         scrollRect = GetComponent<ScrollRect>();
  34.         contentLength = scrollRect.content.rect.xMax - 2 * leftOffset - cellLength;
  35.         firstItemLength = cellLength / 2 + leftOffset;
  36.         oneItemLength = cellLength + spacing;
  37.         oneItemProportion = oneItemLength / (contentLength+ oneItemLength);
  38.         upperLimit = 1 - firstItemLength / contentLength;
  39.         lowerLimit = firstItemLength / contentLength;
  40.         currentIndex = 0;
  41.         scrollRect.horizontalNormalizedPosition = 0;
  42.         if (pageText != null)
  43.         {
  44.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  45.         }
  46.     }
  47.  
  48.     public void Init()
  49.     {
  50.         lastProportion = 0;
  51.         currentIndex = 0;
  52.         if (scrollRect != null)
  53.         {
  54.             scrollRect.horizontalNormalizedPosition = 0;
  55.             pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  56.         }
  57.     }
  58.  
  59.     public void OnEndDrag(PointerEventData eventData)
  60.     {
  61.         float offSetX = 0;
  62.         endMousePositionX = Input.mousePosition.x;
  63.         offSetX = (beginMousePostionX - endMousePositionX) * 2;
  64.         //Debug.Log("offSetX:" + offSetX);
  65.         //Debug.Log("firstItemLength:" + firstItemLength);
  66.         if (Mathf.Abs(offSetX) > firstItemLength)//执行滑动动作的前提是要大于第一个需要滑动的距离
  67.         {
  68.             if (offSetX > 0)//右滑
  69.             {
  70.                 if (currentIndex >= totalItemNum)
  71.                 {
  72.                     return;
  73.                 }
  74.                 int moveCount =
  75.                     (int)((offSetX - firstItemLength) / oneItemLength) + 1;//当次可以移动的格子数目
  76.                 currentIndex += moveCount;
  77.                 if (currentIndex >= totalItemNum)
  78.                 {
  79.                     currentIndex = totalItemNum;
  80.                 }
  81.                 //当次需要移动的比例:上一次已经存在的单元格位置
  82.                 //的比例加上这一次需要去移动的比例
  83.                 lastProportion += oneItemProportion;
  84.                 Debug.Log(lastProportion);
  85.                 if (lastProportion >= upperLimit)
  86.                 {
  87.                     lastProportion = 1;
  88.                 }
  89.             }
  90.             else //左滑
  91.             {
  92.                 if (currentIndex <= 1)
  93.                 {
  94.                     return;
  95.                 }
  96.                 int moveCount =
  97.                     (int)((offSetX + firstItemLength) / oneItemLength) - 1;//当次可以移动的格子数目
  98.                 currentIndex += moveCount;
  99.                 if (currentIndex <= 1)
  100.                 {
  101.                     currentIndex = 1;
  102.                 }
  103.                 //当次需要移动的比例:上一次已经存在的单元格位置
  104.                 //的比例加上这一次需要去移动的比例
  105.                 lastProportion += oneItemProportion * moveCount;
  106.                 if (lastProportion <= lowerLimit)
  107.                 {
  108.                     lastProportion = 0;
  109.                 }
  110.             }
  111.             if (pageText != null)
  112.             {
  113.                 pageText.text = currentIndex.ToString() + "/" + totalItemNum;
  114.             }
  115.  
  116.         }
  117.  
  118.         DOTween.To(() => scrollRect.horizontalNormalizedPosition, lerpValue => scrollRect.horizontalNormalizedPosition = lerpValue, lastProportion, 0.5f).SetEase(Ease.OutQuint);
  119.         //GameManager.Instance.audioSourceManager.PlayPagingAudioClip();
  120.     }
  121.  
  122.     public void OnBeginDrag(PointerEventData eventData)
  123.     {
  124.         beginMousePostionX = Input.mousePosition.x;
  125.     }
  126. }

三：一次滑动一个的资源链接

图片轮播，可以用于目录，展示一个个目录中的内容，应用场景有：保卫萝卜的选项卡，时间线的展示，人物的展示等等_unity3d - Unity3D模型_U3D_免费下载-爱给网

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

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号