一、 点击滑动页面

新建了一个带mask的prefab,加上代码只需要将图片prefab、按钮prefab和所想添加的图片

拖进去会自动生成按钮,滑动速度可以随意调time,滑动效果用itween实现的,所以需要加上itween插件

效果如下:(图片是我最爱的马路小天使(¯﹃¯))

附上代码

 using UnityEngine;
using System.Collections.Generic;
using UnityEngine.UI; public class Mask : MonoBehaviour { public List<Sprite> sprite = new List<Sprite>();
List<GameObject> image=new List<GameObject >();
public GameObject pic;
public Button but;
public float time;
float width, height;
int num;
void Start ()
{
num = sprite.Count;
width = this.gameObject.GetComponent<RectTransform>().rect.width;
height = this.gameObject.GetComponent<RectTransform>().rect.height;
pic.transform.GetComponent<RectTransform>().sizeDelta=new Vector2(width,height);
for (int i = ; i < num; i++)
{ GameObject p = Instantiate(pic,new Vector3(transform.position.x+i*width,transform.position.y,),transform.rotation)as GameObject;
p.transform.parent = this.gameObject.transform;
image.Add (p) ;
p.GetComponent<Image>().sprite = sprite[i];
Button b = Instantiate(but, new Vector3(transform.position.x- ( * num - ) / +*i, transform.position.y - height/ + , ), transform.rotation) as Button;
b.transform.parent = GameObject.FindWithTag("Button").transform;
System.Object obj = (System.Object)i;
b.onClick.AddListener(delegate(){this.MoveToPic((int)obj);});
} }
void OnGUI()
{
if (GUI.Button(new Rect(transform.position.x + + width / , Screen.height - transform.position.y - , , ), ">"))
{
if (image[].transform.position.x < transform.position.x-)
{
Move();
}
}
if (GUI.Button(new Rect(transform.position.x -width/-,Screen.height- transform.position.y- , , ), "<"))
{
if (image[num - ].transform.position.x > transform.position.x+)
{
Move(-);
}
}
}
public void Move(int dir)
{
for (int i = ; i <num; i++)
{
iTween.MoveAdd(image[i], iTween.Hash("x", width * dir, "time", time));
}
}
public void MoveToPic(int i)
{ float offset = transform.position.x - image[i].transform.position.x;
for (int j = ; j < num; j++)
{
iTween.MoveAdd(image[j], iTween.Hash("x", offset, "time", time));
}
} }

二、间隔时间自动滑动,也可点击滑动

 using UnityEngine;
using System.Collections.Generic;
using UnityEngine.EventSystems;
using UnityEngine.UI;
using System; public class ScrollPage : MonoBehaviour, IBeginDragHandler, IEndDragHandler
{
ScrollRect rect;
//页面:0,1,2,3 索引从0开始
//每页占的比列:0/3=0 1/3=0.333 2/3=0.6666 3/3=1
//float[] pages = { 0f, 0.333f, 0.6666f, 1f };
List<float> pages = new List<float>();
int currentPageIndex = -; //滑动速度
public float smooting = ; //滑动的起始坐标
float targethorizontal = ; //是否拖拽结束 0 -结束 1-拖拽中 2-结束超过5s
int isDrag = ;
int curindex = ;
int dir = ;
float timecount = ;
/// <summary>
/// 用于返回一个页码,-1说明page的数据为0
/// </summary>
public System.Action<int,int> OnPageChanged; float startime = 0f;
float delay = 0.1f; // Use this for initialization
void Start()
{
rect = transform.GetComponent<ScrollRect>();
//rect.horizontalNormalizedPosition = 0;
//UpdatePages();
startime = Time.time;
} void Update()
{
if (Time.time < startime + delay) return;
UpdatePages();
//如果不判断。当在拖拽的时候要也会执行插值,所以会出现闪烁的效果
//这里只要在拖动结束的时候。在进行插值
if (isDrag == && pages.Count > )
{
rect.horizontalNormalizedPosition = Mathf.Lerp(rect.horizontalNormalizedPosition, targethorizontal, Time.deltaTime * smooting);
if (Mathf.Abs(rect.horizontalNormalizedPosition - targethorizontal) <= 0.001)
{ isDrag = ; timecount = ; }
}
if (isDrag == )
{
timecount += Time.deltaTime;
if (timecount > )
{
AutoMove();
rect.horizontalNormalizedPosition = Mathf.Lerp(rect.horizontalNormalizedPosition, pages[curindex + dir * ], Time.deltaTime * smooting);
if (pages == null || OnPageChanged == null)
print("Error" + "," + (pages==null) + "," + (OnPageChanged == null));
OnPageChanged(pages.Count, curindex + dir * );
if (Mathf.Abs(rect.horizontalNormalizedPosition - pages[curindex + dir * ]) < 0.001)
{
timecount = ;
}
}
}
} public void AutoMove()
{
for (int i = ; i < pages.Count; i++)
{
if (Mathf.Abs(pages[i] - rect.horizontalNormalizedPosition) < 0.001)
{
curindex = i;
}
}
if (curindex == pages.Count - ) { dir = -; }
if (curindex == ) { dir = ; }
}
public void OnBeginDrag(PointerEventData eventData)
{
isDrag = ; }
public void MoveToPage(int target)
{
isDrag = ;
targethorizontal = pages [target];
if(target!=currentPageIndex)
{
currentPageIndex = target;
OnPageChanged(pages.Count, currentPageIndex);
}
}
public void OnEndDrag(PointerEventData eventData)
{
isDrag = ; float posX = rect.horizontalNormalizedPosition;
int index = ;
//假设离第一位最近
float offset = Mathf.Abs(pages[index] - posX);
for (int i = ; i < pages.Count; i++)
{
float temp = Mathf.Abs(pages[i] - posX);
if (temp < offset)
{
index = i; //保存当前的偏移量
//如果到最后一页。反翻页。所以要保存该值,
offset = temp;
}
} if(index!=currentPageIndex)
{
currentPageIndex = index;
OnPageChanged(pages.Count, currentPageIndex);
} targethorizontal = pages[index];
} void UpdatePages()
{
// 获取子对象的数量
int count = this.rect.content.childCount;
int temp = ;
for(int i=; i<count; i++)
{
if(this.rect.content.GetChild(i).gameObject.activeSelf)
{
temp++;
}
}
count = temp; if (pages.Count!=count)
{
if (count != )
{
pages.Clear();
for (int i = ; i < count; i++)
{
float page = ;
if(count!=)
page = i / ((float)(count - ));
pages.Add(page);
}
}
OnEndDrag(null);
}
}
}

unity3d之实现各种滑动效果的更多相关文章

  1. a 锚点跳转滑动效果

    点击a链接时,跳转到相应id的位置处,有一个滑动效果. <a href="#my">我是跳转到div</a><div id="my" ...

  2. Android Scroll分析——滑动效果产生

    相对于在Android2.x版本上出现的长按.点击事件的效果,不得不说,滑动操作具有更好的用户体验.因此,从Android 4.X版本开始,出现了更多滑动操作的效果.越来越多第三方应用模仿这样的效果, ...

  3. jquery左右滑动效果的实现

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. bootstrap实现 手机端滑动效果,滑动到下一页,jgestures.js插件

    bootstrap能否实现 手机端滑动效果,滑动到下一页 jgestures.js插件可以解决,只需要引入一个JS文件<script src="js/jgestures.min.js& ...

  5. Android实现多页左右滑动效果,支持子view动态创建和cache

    要实现多页滑动效果,主要是需要处理onTouchEvent和onInterceptTouchEvent,要处理好touch事件的子控件和父控件的传递问题. 滚动控制可以利用android的Scroll ...

  6. 【Android 界面效果27】利用ViewPager、Fragment、PagerTabStrip实现多页面滑动效果

    本文主要介绍如何利用ViewPager.Fragment.PagerTabStrip实现多页面滑动效果.即google play首页.新浪微博消息(at.评论.私信.广播)页面的效果.ViewPage ...

  7. 十六、Android 滑动效果汇总

    Android 滑动效果入门篇(一)—— ViewFlipper Android 滑动效果入门篇(二)—— Gallery Android 滑动效果基础篇(三)—— Gallery仿图像集浏览 And ...

  8. Android 滑动效果进阶篇(六)—— 倒影效果

    上篇介绍了使用Animation实现3D动画旋转翻页效果,现在介绍图片倒影实现,先看效果图 本示例主要通过自定义Gallery和ImageAdapter(继承自BaseAdapter)实现 1.倒影绘 ...

  9. Android 滑动效果入门篇(二)—— Gallery

    Gallery 是Android官方提供的一个View容器类,继承于AbsSpinner类,用于实现页面滑动效果. 从上面的继承关系可以看出,AbsSpinner类继承自AdapterView,因此我 ...

随机推荐

  1. php运行环境学习

    web服务器,负责响应客户端请求.对于静态页面请求,会立即返回相应页面给客户端:如果是动态页面,web服务器会根据 httpd.conf中的AddType配置,提交给合适的动态脚本解析程序预处理,然后 ...

  2. Squid代理服务器(二)——配置Squid服务器

    一.传统代理 (一)需求分析 局域网内,客户机访问自家的Web服务器,通过Squid代理服务器访问Web服务器,再由Squid反馈给客户机;在Squid主机上,构建Squid为客户机访问网站提供代理服 ...

  3. leetcode-551-Student Attendance Record I(判断是否出现连续几个相同字符)

    题目描述: You are given a string representing an attendance record for a student. The record only contai ...

  4. 自己写的第一个Schema文件

    <Schema name="FinSchema" description="财务模式" measuresCaption="财务模式"& ...

  5. FPGA基础学习(9) -- 复位设计

    目录 1. 常见问题 2. 常见的复位方式 3. 合理的复位设计 3.1 复位电平 3.2 异步复位同步化 3.3 恰到好处的复位 4. 补充 4.1 所谓的上电初始化 参考文献 一开始接触到FPGA ...

  6. Maximum call stack size exceeded

    写vue时报了如下错误 Maximum call stack size exceeded 栈溢出,因为在调用函数时使用了递归调用,而且没有写跳出条件,导致了该错误

  7. EndNote登陆Web账号时解决不断询问用户名密码

    EndNote登陆Web账号时不断询问用户名密码怎么破?EndNote有个同步功能,在登陆Web账号时,EndNote不断的询问账号和密码,可是用户名和密码明明已经填写正确和完毕,就是登陆不上EndN ...

  8. Effective C++ 改善55个方法

    美·Scott Meyers 候捷 电子工业 2011 刚才看到个会议时间有点晚,3.25论文都提交了 谷歌去广告的插件, 最后投了这个会议,刚刚好正合适.我说金钱与时间 ACCUSTOMING YO ...

  9. Vue.js 的精髓——组件

    开篇:Vue.js 的精髓——组件 写在前面 Vue.js,无疑是当下最火热的前端框架 Almost,而 Vue.js 最精髓的,正是它的组件与组件化.写一个 Vue 工程,也就是在写一个个的组件. ...

  10. javascript 将 table 导出 Excel ,可跨行跨列

    <script language="JavaScript" type="text/javascript"> //jQuery HTML导出Excel ...