UGUI 分页渐变居中效果
代码相当冗长,仅作自己记录
在此分页上修改的https://blog.csdn.net/qinyuanpei/article/details/49781133
using UnityEngine;
using System.Collections;
using System.Collections.Generic;
using UnityEngine.UI;
public class GridItem {
public string cnName;
public string usName;
public GridItem(string cnN,string usN) {
cnName = cnN;
usName = usN;
}
}
public class PaginationPanel : MonoBehaviour
{
/// <summary>
/// 当前页面索引
/// </summary>
public int m_PageIndex = 1;
/// <summary>
/// 总页数
/// </summary>
public int m_PageCount = 0;
/// <summary>
/// 每页元素数
/// </summary>
public int m_PerPageCount = 0;
/// <summary>
/// 元素总个数
/// </summary>
public int m_ItemsCount = 0;
/// <summary>
/// 元素列表
/// </summary>
public List<GridItem> m_ItemsList;
/// <summary>
/// 上一页
/// </summary>
public Button m_BtnPrevious;
/// <summary>
/// 下一页
/// </summary>
public Button m_BtnNext;
/// <summary>
/// 显示当前页数的标签
/// </summary>
public Text m_PanelText;
public Transform m_FrontPanel;
public Transform m_BackPanel;
public bool m_IsTouching;
[Range(-1,1)]
public float m_TouchDelta;
public float m_MoveSpeed = 5f;
public float m_FadeDistance;
public Vector3 m_PrePos;
public Vector3 m_CenterPos;
public Vector3 m_NextPos;
public bool m_DoPrevious;
public bool m_DoNext;
public float m_CurrAlpha;
private bool m_HasPrevious;
private bool m_HasNext;
private bool m_IsSaveBeforeTouch;
public int m_FrontPanelPageIndex;
private bool m_CanChangePage;
private bool m_IsBackPageIndex;
void Start()
{
InitGUI();
InitItems();
}
/// <summary>
/// 初始化GUI
/// </summary>
private void InitGUI()
{
//m_BtnNext = GameObject.Find("Canvas/Panel/BtnNext").GetComponent<Button>();
//m_BtnPrevious = GameObject.Find("Canvas/Panel/BtnPrevious").GetComponent<Button>();
//m_PanelText = GameObject.Find("Canvas/Panel/Text").GetComponent<Text>();
//为上一页和下一页添加事件
m_BtnNext.onClick.AddListener(() => { OnNextBtnClick(); });
m_BtnPrevious.onClick.AddListener(() => { OnPreviousBtnClick(); });
m_PerPageCount = m_FrontPanel.childCount;
m_FadeDistance = Mathf.Abs(m_FrontPanel.localPosition.y - m_BackPanel.localPosition.y);
m_PrePos = m_FrontPanel.localPosition;
m_PrePos.y += m_FadeDistance;
m_NextPos = m_FrontPanel.localPosition;
m_NextPos.y -= m_FadeDistance;
m_CenterPos = m_FrontPanel.localPosition;
m_CanChangePage = true;
m_FrontPanelPageIndex = 1;
}
/// <summary>
/// 初始化元素
/// </summary>
private void InitItems()
{
//准备一个存储着12生肖信息的数组
GridItem[] items = new GridItem[]
{
new GridItem("鼠","Mouse"),
new GridItem("牛","Ox"),
new GridItem("虎","Tiger"),
new GridItem("兔","Rabbit"),
new GridItem("龙","Dragon"),
new GridItem("蛇","Snake"),
new GridItem("马","Horse"),
new GridItem("羊","Goat"),
new GridItem("猴","Monkey"),
new GridItem("鸡","Rooster"),
new GridItem("狗","Dog"),
new GridItem("猪","Pig")
};
//利用12生肖数组来随机生成列表
m_ItemsList = new List<GridItem>();
for (int i = 0; i < items.Length; i++)
{
m_ItemsList.Add(items[i]);
}
//计算元素总个数
m_ItemsCount = m_ItemsList.Count;
//计算总页数
m_PageCount = (m_ItemsCount % m_PerPageCount) == 0 ? m_ItemsCount / m_PerPageCount : (m_ItemsCount / m_PerPageCount) + 1;
BindPage(m_FrontPanel, m_PageIndex);
//更新界面页数
m_PanelText.text = string.Format("{0}/{1}", m_PageIndex.ToString(), m_PageCount.ToString());
}
private void Update()
{
if (m_IsTouching)
{
if (!m_IsSaveBeforeTouch) {
m_IsSaveBeforeTouch = true;
m_FrontPanelPageIndex = m_PageIndex;
}
if (m_TouchDelta > 0)
{
if (!m_HasPrevious && m_FrontPanelPageIndex > 1)
{
m_HasNext = false;
m_HasPrevious = true;
TouchPrevious();
}
if (m_DoPrevious)
{
m_IsBackPageIndex = false;
m_BackPanel.localPosition = Vector3.Lerp(m_PrePos, m_CenterPos, Mathf.Abs(m_TouchDelta));
m_BackPanel.GetComponent<CanvasGroup>().alpha = Mathf.Abs(m_TouchDelta);
}
m_FrontPanel.localPosition = Vector3.Lerp(m_CenterPos, m_NextPos, Mathf.Abs(m_TouchDelta));
m_FrontPanel.GetComponent<CanvasGroup>().alpha = 1 - Mathf.Abs(m_TouchDelta);
}
else if (m_TouchDelta < 0)
{
if (!m_HasNext && m_FrontPanelPageIndex < m_PageCount)
{
m_HasNext = true;
m_HasPrevious = false;
TouchNext();
}
if (m_DoNext)
{
m_IsBackPageIndex = false;
m_BackPanel.localPosition = Vector3.Lerp(m_NextPos, m_CenterPos, Mathf.Abs(m_TouchDelta));
m_BackPanel.GetComponent<CanvasGroup>().alpha = Mathf.Abs(m_TouchDelta);
}
m_FrontPanel.localPosition = Vector3.Lerp(m_CenterPos, m_PrePos, Mathf.Abs(m_TouchDelta));
m_FrontPanel.GetComponent<CanvasGroup>().alpha = 1 - Mathf.Abs(m_TouchDelta);
}
}
else {
m_HasNext = false;
m_HasPrevious = false;
m_IsSaveBeforeTouch = false;
float a = Mathf.Abs(m_FrontPanel.localPosition.y - m_CenterPos.y) / m_FadeDistance;
m_CurrAlpha = a;
if (m_TouchDelta >= 0.5f)
{
//float a = Mathf.Abs(m_FrontPanel.localPosition.y - m_CenterPos.y) / m_FadeDistance;
if (m_DoPrevious)
{
m_BackPanel.localPosition = Vector3.Lerp(m_BackPanel.localPosition, m_CenterPos, m_MoveSpeed * Time.deltaTime);
m_BackPanel.GetComponent<CanvasGroup>().alpha = a;
m_FrontPanel.localPosition = Vector3.Lerp(m_FrontPanel.localPosition, m_NextPos, m_MoveSpeed * Time.deltaTime);
m_FrontPanel.GetComponent<CanvasGroup>().alpha = 1 - a;
if (1 - a < 0.01f)
{
m_TouchDelta = 0;
SwitchPanel();
}
}
else {
m_TouchDelta = 0;
}
}
else if (m_TouchDelta <= -0.5f)
{
//float a = Mathf.Abs(m_FrontPanel.localPosition.y - m_CenterPos.y) / m_FadeDistance;
if (m_DoNext)
{
m_BackPanel.localPosition = Vector3.Lerp(m_BackPanel.localPosition, m_CenterPos, m_MoveSpeed * Time.deltaTime);
m_BackPanel.GetComponent<CanvasGroup>().alpha = a;
m_FrontPanel.localPosition = Vector3.Lerp(m_FrontPanel.localPosition, m_PrePos, m_MoveSpeed * Time.deltaTime);
m_FrontPanel.GetComponent<CanvasGroup>().alpha = 1 - a;
if (1 - a < 0.01f)
{
m_TouchDelta = 0;
SwitchPanel();
}
}
else {
m_TouchDelta = 0;
}
}
else {
//float a = Mathf.Abs(m_FrontPanel.localPosition.y - m_CenterPos.y) / m_FadeDistance;
if (m_DoPrevious)
{
if (!m_IsBackPageIndex) {
m_IsBackPageIndex = true;
m_PageIndex = m_FrontPanelPageIndex;
}
if (m_PageIndex < m_PageCount && m_PageIndex > 1) {
m_BackPanel.localPosition = Vector3.Lerp(m_BackPanel.localPosition, m_PrePos, m_MoveSpeed * Time.deltaTime);
m_BackPanel.GetComponent<CanvasGroup>().alpha = a;
}
}
else if (m_DoNext) {
if (!m_IsBackPageIndex)
{
m_IsBackPageIndex = true;
m_PageIndex = m_FrontPanelPageIndex;
}
if (m_PageIndex < m_PageCount && m_PageIndex > 1) {
m_BackPanel.localPosition = Vector3.Lerp(m_BackPanel.localPosition, m_NextPos, m_MoveSpeed * Time.deltaTime);
m_BackPanel.GetComponent<CanvasGroup>().alpha = a;
}
}
m_FrontPanel.localPosition = Vector3.Lerp(m_FrontPanel.localPosition,m_CenterPos, m_MoveSpeed * Time.deltaTime);
m_FrontPanel.GetComponent<CanvasGroup>().alpha = 1 - a;
if (m_TouchDelta != 0 && a < 0.01f)
{
m_TouchDelta = 0;
m_DoNext = false;
m_DoPrevious = false;
m_CanChangePage = true;
}
}
}
}
private void SwitchPanel() {
m_DoPrevious = false;
m_DoNext = false;
Transform temp = m_FrontPanel;
m_FrontPanel = m_BackPanel;
m_BackPanel = temp;
m_CanChangePage = true;
}
public void OnNextBtnClick() {
if (!m_CanChangePage) return;
m_TouchDelta = -0.6f;
Next();
}
/// <summary>
/// 下一页
/// </summary>
public void Next()
{
if (m_PageCount <= 0)
return;
//最后一页禁止向后翻页
if (m_PageIndex >= m_PageCount)
return;
m_CanChangePage = false;
m_PageIndex += 1;
if (m_PageIndex >= m_PageCount)
m_PageIndex = m_PageCount;
m_BackPanel.localPosition = m_NextPos;
BindPage(m_BackPanel, m_PageIndex);
m_DoNext = true;
m_DoPrevious = false;
//更新界面页数
m_PanelText.text = string.Format("{0}/{1}", m_PageIndex.ToString(), m_PageCount.ToString());
}
/// <summary>
/// 下一页
/// </summary>
public void TouchNext()
{
if (m_PageCount <= 0)
return;
//最后一页禁止向后翻页
if (m_FrontPanelPageIndex >= m_PageCount)
return;
m_CanChangePage = false;
m_PageIndex = m_FrontPanelPageIndex + 1;
if (m_PageIndex >= m_PageCount)
m_PageIndex = m_PageCount;
m_BackPanel.localPosition = m_NextPos;
BindPage(m_BackPanel, m_PageIndex);
m_DoNext = true;
m_DoPrevious = false;
//更新界面页数
m_PanelText.text = string.Format("{0}/{1}", m_PageIndex.ToString(), m_PageCount.ToString());
}
public void OnPreviousBtnClick() {
if (!m_CanChangePage) return;
m_TouchDelta = 0.6f;
Previous();
}
/// <summary>
/// 上一页
/// </summary>
public void Previous()
{
if (m_PageCount <= 0)
return;
//第一页时禁止向前翻页
if (m_PageIndex <= 1)
return;
m_CanChangePage = false;
m_PageIndex -= 1;
if (m_PageIndex < 1)
m_PageIndex = 1;
m_BackPanel.localPosition = m_PrePos;
BindPage(m_BackPanel, m_PageIndex);
m_DoPrevious = true;
m_DoNext = false;
//更新界面页数
m_PanelText.text = string.Format("{0}/{1}", m_PageIndex.ToString(), m_PageCount.ToString());
}
/// <summary>
/// 上一页
/// </summary>
public void TouchPrevious()
{
if (m_PageCount <= 0)
return;
//第一页时禁止向前翻页
if (m_FrontPanelPageIndex <= 1)
return;
m_CanChangePage = false;
m_PageIndex = m_FrontPanelPageIndex -1;
if (m_PageIndex < 1)
m_PageIndex = 1;
m_BackPanel.localPosition = m_PrePos;
BindPage(m_BackPanel, m_PageIndex);
m_DoPrevious = true;
m_DoNext = false;
//更新界面页数
m_PanelText.text = string.Format("{0}/{1}", m_PageIndex.ToString(), m_PageCount.ToString());
}
/// <summary>
/// 绑定指定索引处的页面元素
/// </summary>
/// <param name="index">页面索引</param>
private void BindPage(Transform tran,int index)
{
//列表处理
if (m_ItemsList == null || m_ItemsCount <= 0)
return;
//索引处理
if (index < 0 || index > m_ItemsCount)
return;
//按照元素个数可以分为1页和1页以上两种情况
if (m_PageCount == 1)
{
int canDisplay = 0;
for (int i = m_PerPageCount; i > 0; i--)
{
if (canDisplay < m_PerPageCount && canDisplay< m_ItemsList.Count)
{
BindGridItem(tran.GetChild(canDisplay), m_ItemsList[m_PerPageCount - i]);
tran.GetChild(canDisplay).gameObject.SetActive(true);
}
else
{
//对超过canDispaly的物体实施隐藏
tran.GetChild(canDisplay).gameObject.SetActive(false);
}
canDisplay += 1;
}
}
else if (m_PageCount > 1)
{
//1页以上需要特别处理的是最后1页
//和1页时的情况类似判断最后一页剩下的元素数目
//第1页时显然剩下的为12所以不用处理
if (index == m_PageCount)
{
int canDisplay = 0;
for (int i = m_PerPageCount; i > 0; i--)
{
//最后一页剩下的元素数目为 m_ItemsCount - 12 * (index-1)
if (canDisplay < m_ItemsCount - m_PerPageCount * (index - 1))
{
BindGridItem(tran.GetChild(canDisplay), m_ItemsList[m_PerPageCount * index - i]);
tran.GetChild(canDisplay).gameObject.SetActive(true);
}
else
{
//对超过canDispaly的物体实施隐藏
tran.GetChild(canDisplay).gameObject.SetActive(false);
}
canDisplay += 1;
}
}
else
{
for (int i = m_PerPageCount; i > 0; i--)
{
BindGridItem(tran.GetChild(m_PerPageCount - i), m_ItemsList[m_PerPageCount * index - i]);
tran.GetChild(m_PerPageCount - i).gameObject.SetActive(true);
}
}
}
}
/// <summary>
/// 加载一个Sprite
/// </summary>
/// <param name="assetName">资源名称</param>
private Sprite LoadSprite(string assetName)
{
Texture texture = (Texture)Resources.Load(assetName);
Sprite sprite = Sprite.Create((Texture2D)texture, new Rect(0, 0, texture.width, texture.height), new Vector2(0.5f, 0.5f));
return sprite;
}
/// <summary>
/// 将一个GridItem实例绑定到指定的Transform上
/// </summary>
/// <param name="trans"></param>
/// <param name="gridItem"></param>
private void BindGridItem(Transform trans, GridItem gridItem)
{
//trans.GetComponent<Image>().sprite = LoadSprite(gridItem.ItemSprite);
trans.GetComponent<Text>().text = gridItem.cnName;
}
}
UGUI 分页渐变居中效果的更多相关文章
- 移动页面div居中效果代码
在线查看效果:http://hovertree.com/texiao/mobile/4.htm 可用手机浏览器查看 以下为HTML文件: <!DOCTYPE html> <html& ...
- CSS 居中效果完整指南
本文翻译自:<Centering in CSS: A Complete Guide> 使用 CSS 实现效果困难吗?显然不是.实际上有许多方法可以实现居中效果,但在具体情况中,我们往往无法 ...
- jQuery中的渐变动画效果
jQuery中的渐变动画效果jQuery中的渐变动画效果
- CSS3下的渐变文字效果实现
如下,第一种方法已实践 一.方法一:借助mask-image属性 可以狠狠地点击这里:CSS3下的渐变文字效果方法一demo 如果您手头上的浏览器是Chrome或是Safari,则您可以在demo页面 ...
- 用JS制作博客页面背景随滚动渐变的效果
今天颓了一会,用JavaScript给我的博客园博客写了一个页面背景随滚动而渐变的效果,做完之后自我感觉良好-- 下面就以我的博客园博客为例,介绍一下如何制作这个效果! 准备 [x] 申请博客园的JS ...
- 小tip:CSS3下的渐变文字效果实现——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1601 一.方法一:借 ...
- CAGradientLayer实现图片渐变透明效果
CAGradientLayer实现图片渐变透明效果 要实现的效果如下: 源码: // // RootViewController.m // CAGradientLayer // // Copyrigh ...
- Android 使用RecyclerView实现多行水平分页的GridView效果和ViewPager效果
前些天看到有人在论坛上问这种效果怎么实现,没写过也没用过这个功能,网上查了一下,大多是使用ViewPager+GridView或者HorizontalScrollView+GridView实现,不过貌 ...
- CSS 利用transform达到居中效果
<body> <div class="center"> .... </div> </body> 让left和top都是50%,这在水 ...
随机推荐
- 20145201 《Java程序设计》第六周学习总结
20145201 <Java程序设计>第六周学习总结 教材学习内容总结 本周学习了课本第十.十一章内容,即输入/输出.线程与并行API. 第十章 输入输出 10.1 InputStream ...
- React Native常用组件之ListView组件
学习iOS开发的同学应该都知道UITableView,几乎每个APP中都有它的存在,而且衍生出各种形态:那么同样,ListView就是在React Native中的tableView,而且更加简单和灵 ...
- APIGateway网关安全设计
Spring Cloud里面有个组件 Zuul网关 网关和 过滤器 拦截器很相似 网关可以实现过滤器 拦截器的功能 而且可以实现Nginx的基本功能 反向代理 负载均衡ribbon Nginx是软负载 ...
- Vue初步认识
什么是Vue Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架(根据需求使用特定的功 能).与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的 ...
- vim 中的常用编辑
1.将1到3列行首添加‘#’ :1,3s/^/#/g 2.将1到3列行首去除‘#’ :1,3s/^#//g 3.将1到3列中前两列字符去掉 :1,3s/^..//g 4.将1到3列中行末前两个字符去掉 ...
- 交换机上的trunk,hybrid,access配置和应用(转)
交换机上的trunk,hybrid,access配置和应用 以太网端口的链路类型: Access类型:端口只能属于一个vlan,一般用于连接计算机. Trunk类型:端口可以属于端个vlan,可以接收 ...
- javascript简单介绍总结(一)
DOM (Document Object Model)(文档对象模型)是用于访问 HTML 元素的正式 W3C 标准.在 HTML 中,JavaScript 语句向浏览器发出的命令.语句是用分号分隔: ...
- Educational Codeforces Round 23E
题意:刚开始有一个空集合,现在有三种操作1,加x到集合中,2,删去集合中的一个x,3,查询集合中的x^p<l的个数 套路题,(看到异或和集合操作条件反射01字典树),加和删操作不说了,主要是查询 ...
- OpenStack Mitaka HA部署方案(随笔)
[Toc] https://github.com/wanstack/AutoMitaka # 亲情奉献安装openstack HA脚本 使用python + shell,完成了基本的核心功能(纯二层的 ...
- Struts07---访问servlet的API
01.创建登录界面 <%@ page language="java" import="java.util.*" pageEncoding="UT ...