unity实现翻页效果

本文实例为大家分享了unity实现翻页效果的具体代码,供大家参考,具体内容如下

一、示意图

二、步骤

创建物体ToPanel;添加组件ScrollRect,
在下面创建一个空物体用来装需要移动的子物体,

创建一个Scrollbar;

三、代码

下面展示一些 内联代码片。

using UnityEngine;
using System.Collections;
using UnityEngine.UI;
using System.Collections.Generic;

public class SliderControl : MonoBehaviour
{
  public Scrollbar m_Scrollbar;
  public ScrollRect m_ScrollRect;
  [Header("子物体的父物体")]
  public GameObject panel;
  [Header("移动到多少百分比图片切换")]  //注释
  [Range(0.1f, 0.9f)] //范围
  public float banfenbi = 0.5f;
  [Header("是否限制一次只能切换一张图片")]
  public bool limit = false;

  private float mTargetValue;
  private bool mNeedMove = false;
  private const float SMOOTH_TIME = 0.2F;
  private float mMoveSpeed = 0f;

  private float child_Count;
  private float num1;
  private float var_Down;
  private List<float> num_list1 =new List<float>();
  private List<float> num_list2 = new List<float>();
  private List<float> num_list3 = new List<float>();
  private int weizhi; //页数
  void Start()
  {
    weizhi = 0;
    child_Count = panel.transform.childCount;
    num1 = 1 / (child_Count - 1);
    print("-----子物体数量------  " + child_Count + "   " + num1);
    for (int i = 0; i < child_Count; i++)
    {
      float a = 0;
      num_list1.Add(a + num1 * i);
      float b = (a + num1 * i) + (num1 * banfenbi);
      num_list2.Add(b);
      float c = (a + num1 * i) + (num1 * (1-banfenbi));
      num_list3.Add(c);
      print("---child_Count----- " + num_list1[i] + "  " + num_list2[i]);
    }
  }
  public void OnPointer()
  { }

  public void OnPointerDown()
  {
    //print("---OnPointerDown----");
    var_Down = m_Scrollbar.value;
    mNeedMove = false;
  }
  public void OnPointerUp()
  {
    //print("---OnPointerUp----");
    //print("-----m_Scrollbar.value---- " + m_Scrollbar.value);
    for (int i = 0; i < child_Count; i++)
    {
      float num;
      if (var_Down- m_Scrollbar.value<0)
      {
        num = num_list2[i];
      }
      else
      {
        num = num_list3[i];
      }
      if (m_Scrollbar.value <= num)
      {
        if (limit)
        {
          if (i> weizhi)
          {
            weizhi = weizhi + 1;
          }
          else if (i == weizhi)
          {
            weizhi = i;
          }
          else
          {
            weizhi = weizhi - 1;
          }
          mTargetValue = num_list1[weizhi];
        }
        else
        {
          mTargetValue = num_list1[i];
          weizhi = i;  //页数
        }
        break;
      }
    }

    mNeedMove = true;
    mMoveSpeed = 0;
  }
  /// <summary>
  /// 直接跳转到指定页数
  /// </summary>
  /// <param name="页数"></param>
  public void OnButtonClick(int value)
  {
    mTargetValue = num_list1[value];
    if (mTargetValue<0)
    {
      mTargetValue = 0;
    }
    if (mTargetValue>1)
    {
      mTargetValue = 1;
    }
    weizhi = value;
    mNeedMove = true;
  }
  void Update()
  {
    if (mNeedMove)
    {
      if (Mathf.Abs(m_Scrollbar.value - mTargetValue) < 0.01f)
      {
        m_Scrollbar.value = mTargetValue;
        mNeedMove = false;
        MoveEnd();
        return;
      }
      m_Scrollbar.value = Mathf.SmoothDamp(m_Scrollbar.value, mTargetValue, ref mMoveSpeed, SMOOTH_TIME);
    }
  }
  /// <summary>
  /// 移动完毕的回调
  /// </summary>
  public void MoveEnd()
  {
    print("----- 移动完毕-----第几页--- "+ (weizhi+1));
  }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Unity UGUI实现滑动翻页效果

    本文实例为大家分享了Unity UGUI实现滑动翻页效果的具体代码,供大家参考,具体内容如下 这个问题真的是老生常谈的事情了,不过在这里还是要说一下,以便以后之需 首先看一下效果图 最后在Content下面是一些Image using UnityEngine; using System.Collections; using UnityEngine.UI; using System.Collections.Generic; using UnityEngine.EventSystems; using

  • Unity UGUI实现滑动翻页直接跳转页数

    本文实例为大家分享了Unity UGUI实现滑动翻页,直接跳转页数的具体代码,供大家参考,具体内容如下 首先看一下最终效果 其实这个功能基本上是老生常谈了,所以代码还是很简单 using UnityEngine; using System.Collections; using UnityEngine.UI; using System.Collections.Generic; using UnityEngine.EventSystems; using System; public class Pa

  • Unity工具类ScrollView实现拖拽滑动翻页

    简介: 在进行UI设计的时候,经常会使用Unity中UI提供的ScrollView,类似Android中的ScrollView,在进行图片预览,多个翻页的时候,能实现很好的效果. 该类中根据Unity的EventSystems中拖拽事件,实现对页码的滑动监听,在使用的时候,新建UI--->ScrollView,把该类组件添加到ScrollView上,把对应的content加入该脚本中的content,调整ScrollView和Content,设置单个滑动页的宽度,拖拽的阈值,即可监听到拖拽,如果

  • Unity使用ScrollRect制作翻页

    本文实例为大家分享了使用ScrollRect制作翻页的具体代码,供大家参考,具体内容如下 1.标准的层级结构 ScrollRect->ViewPort->Content,Viewport负责显示区域的大小一般和Mask一起配合使用,Content使用Layout来布局,如果想使用代码来自动定位显示位置需要在Content加上Content size filter. 2.ScrollRectHelper using UnityEngine; using UnityEngine.UI; using

  • unity scrollRect实现按页码翻页效果

    本文实例为大家分享了unity实现按页码翻页效果的具体代码,供大家参考,具体内容如下 用来做背包 商店的按页翻页功能,先上效果图 其中,dragNum 表示的是 如果为3,便是滑动距离超过当前页面宽度的百分之三十位成功 connect表示 scrollRect下connet的大小 然后是函数的初始化方法 这里提供了两个方法  一个是直接提供页数 参数分别代表 总页数,要显示的页数 以及切换到要显示的页数是否播放滑动动画 以及当时用来做背包.商店的方法2 和上面不用的是传入的是物品的数量以及每页显

  • unity实现翻页按钮功能

    本文实例为大家分享了unity实现翻页按钮功能的具体代码,供大家参考,具体内容如下 效果图: UI子父级关系: 代码中也都有加入注释,有不懂可私信我.脚本中用到了对象池,我没有上传,可根据自己需求做相应变动. 脚本:PageBtnPanelC using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.Events; using UnityEngine.UI; /

  • unity实现翻页效果

    本文实例为大家分享了unity实现翻页效果的具体代码,供大家参考,具体内容如下 一.示意图 二.步骤 创建物体ToPanel:添加组件ScrollRect, 在下面创建一个空物体用来装需要移动的子物体, 创建一个Scrollbar: 三.代码 下面展示一些 内联代码片. using UnityEngine; using System.Collections; using UnityEngine.UI; using System.Collections.Generic; public class

  • Unity Shader实现3D翻页效果

    本文实例为大家分享了Unity Shader实现3D翻页效果的具体代码,供大家参考,具体内容如下 参考文章:UnityShader使用Plane实现翻书效果 效果图: 原理:Shader顶点动画 在顶点着色器进行对顶点Y值的偏移(使用了Sin函数模拟翻页时产生的弯曲),对顶点X值的偏移实现纸张在翻页时的收缩(一般是不用收缩),最后对顶点进行围绕Z轴旋转实现Plane翻页(Z轴是本例的旋转轴,请根据你具体情况修改,上面的两个偏移同理). Shader "Unlit/PaperTurnMilkSha

  • Android通过手势实现答题器翻页效果

    本文实例为大家分享了Android答题器翻页功能,主要使用ViewFilpper和GestureDetector来实现,供大家参考,具体内容如下 1.效果图 2.实现思路 把Activity的TouchEvent事件交个GestureDetector来处理,然后使用ViewFilpper使用动画控制多个组件的之间的切换效果.手势的一个Api就不详细说了,大家如果不了解可以查一下. 3.实现的步骤 1).构建手势检测器 2).准备数据 3).为ViewFilpper添加子控件. 4).初始化Ani

  • JS实现的3D拖拽翻页效果代码

    本文实例讲述了JS实现的3D拖拽翻页效果.分享给大家供大家参考,具体如下: 以前看到一个很火的帖子,拖拽实现的翻页效果,非常的有创意,自己也很喜欢,于是乎就萌发了用自己的方法模仿的想法.感谢原创作者的创意,结果一样,但过程不一样哦.奉上代码,供大家参考. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-3d-drag-page-style-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DT

  • javaScript+turn.js实现图书翻页效果实例代码

    为了实现图书翻页的效果我们在网上可以看到很多教程 在这里推荐turn.js 网上的turn.js 有api 不过是英文的  很多人看起来不方便 .关于代码也是奇形怪状在这里我将详细讲解如何使用turn.js实现翻页效果 ,本篇文章只是讲解 turn.js 如何使用!!!!!!! 文章最后提供源码下载,结合源码看本文,turn.js更简单! 首先附上个人的文件路径 对于css   和 js文件不需要过多的解释   在这里要注意的是pages文件夹   这里个文件夹下放的是需要预览的图片文件   

  • Android利用悬浮按钮实现翻页效果

    今天给大家分享下自己用悬浮按钮点击实现翻页效果的例子. 首先,一个按钮要实现悬浮,就要用到系统顶级窗口相关的WindowManager,WindowManager.LayoutParams.那么在AndroidManifest.xml中添加权限: <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" /> 然后,我们要对WindowManager,WindowManager.Layout

  • Android实现阅读APP平移翻页效果

    自己做的一个APP需要用到翻页阅读,网上看过立体翻页效果,不过bug太多了还不兼容.看了一下多看阅读翻页是采用平移翻页的,于是就仿写了一个平移翻页的控件.效果如下: 在翻页时页面右边缘绘制了阴影,效果还不错.要实现这种平移翻页控件并不难,只需要定义一个布局管理页面就可以了.具体实现上有以下难点: 1.循环翻页,页面的重复利用. 2.在翻页时过滤掉多点触碰. 3.采用setAdapter的方式设置页面布局和数据. 下面就来一一解决这几个难点.首先看循环翻页问题,怎么样能采用较少的页面实现这种翻页呢

随机推荐