Unity3D实现导航效果

 更新时间:2020年6月25日 11:15  点击:1514

介绍:

unity界面开发,会用到很多导航的按钮,他们是公共的,单击其中一个按钮,显示对应的界面。

unity中,UGUI自带Toggle组件,NGUI也有Toggle复选框,都方便了开发者的开发。但是只有合适自己才是王道。

今天,就用普通的按钮组建,来编写自己的导航。

导航的组成:

  • 总控制
  • 按钮组
  • 面板组

步骤:

编写脚本:<NavigationButton>  控制按钮的高亮,动画等。
编写脚本:<NavigationPanel>   控制面板的显示和关闭。
编写脚本:<NavigationGroup>  控制整个导航按钮的逻辑。
编写脚本:  <MainManager>     控制导航栏的逻辑。

NavigationButton:

控制每一个Button的高亮,动画,挂载到每一个NavigationButton上。

public class NavigationButton: MonoBehaviour {
 
 Awake(){ }
 
 //按钮被选中时
 public void Select()
 {
  //transform.DOScale(new Vector3(1.75f, 1.75f, 0), 0.3f).SetId(transform.name);
 }
 //按钮未被选中时
 public void UnSelect()
 {
  //DOTween.Kill(transform.name);
  //transform.DOScale(new Vector3(1.0f, 1.0f, 0), 0.3f).SetId(transform.name);
 }
}

NavigationPanel:

控制面板的显示和隐藏,挂载到每一个NavigationPane上。

public class NavigationPanel : MonoBehaviour {
 //显示
 public void Show() {
  transform.gameObject.SetActive(true);
 }
 //隐藏
 public void Hide() {
  transform.gameObject.SetActive(false);
 }
}

NavigationGroup:

具体逻辑,挂载到NavigationGroup上,拖入button和panel。

public class NavigationGroup: MonoBehaviour {
 
 public NavigationButton[] navBtns; //按钮组
 public NavigationPanel[] navPans;  //面板组
 
 public int index; //索引
 public int length; //长度
 
 private void Awake()
 {
  index = -1;
  length = navBtns.Length;
 
  for (int i = 0; i < length; i++) {
   navBtns[i].UnSelect();
   navPans[i].Hide();
  }
 }
 
 //通过索引来显示被选中后状态和对应panel
 private void OnSelectByIndex() {
  for (int i = 0; i < length; i++)
  {
   if (i == index)
   {
    navBtns[i].Select();
    navPans[i].Show();
   }
   else
   {
    navBtns[i].UnSelect();
    navPans[i].Hide();
   }
  }
 }
 
 //点击按钮事件
 public void OnClickNavBtn(int value)
 {
  if (index != value) {
   index = value;
   OnSelectByIndex();
  }
 }
 
 //初始被选中的按钮
 public void BeginShow(int values = -1) {
  index = values;
  OnSelectByIndex();
 }
 
 //**********************************************
 //附加:滑动屏幕切换页面
 //**********************************************
 
 private Vector2 beginPos=new Vector2(0,0);
 private Vector2 endPos=new Vector2(0,0);
 private float maxDistance=100;
 
 private void Update()
 {
  //获取鼠标滑动起始坐标和终点坐标
  if (Input.GetMouseButtonDown(0)) {
   beginPos =new Vector2(Input.mousePosition.x, Input.mousePosition.y); 
  }
  if (Input.GetMouseButtonUp(0))
  {
   endPos = new Vector2(Input.mousePosition.x, Input.mousePosition.y);
   SlipDirection();
  }
 }
 //判断滑的方向
 public void SlipDirection() {
  if (Mathf.Abs(beginPos.y - endPos.y) < (Mathf.Abs(beginPos.x - endPos.x))) {
   if (Mathf.Abs(beginPos.x - endPos.x) > maxDistance) {
    if (beginPos.x > endPos.x)
    {
     Next();
    }
    else {
     Prev();
    }
   }
  }
 }
 //向前滑动屏幕
 public void Prev() 
 {
  if (index > 0)
  {
   index--;
   OnSelectByIndex();
  }
 }
 //向后滑动屏幕
 public void Next() 
 {
  if(index<length-1)
  {
   index++;
   OnSelectByIndex();
  } 
 }
 
}

MainManager:

总控制。

public class MainManager: MonoBehaviour {
 
 public NavigationGroup navGroup;
 
 Start()
 {
  Begin();
 } 
 //调用初始方法
 public void Begin()
 {
  navGroup.BeginShow(0);
 }
 
 //**************************************
 //长时间没交互,返回待机界面
 //**************************************
 
 public void ReturnStandBy() {
  navGroup.BeginShow(0);
 }
 
 private void Update()
 {
  if (Input.GetMouseButtonDown(0)) {
   Invoke("ReturnStandBy", 60.0f);
  }
 }
}

以上,基本导航完成。

可以添加导航界面出现和关闭时的动画,在Navigation里添加两个函数: NavShow() ,NavHide()

show的时候记得调用BeginShow(); 在外面调用 show 和 hide 即可。

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

[!--infotagslink--]

相关文章

  • 使用jQuery.Pin垂直滚动时固定导航

    这篇文章主要为大家详细介绍了使用jQuery.Pin垂直滚动时固定导航的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2017-05-27
  • 基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载

    这篇文章主要介绍了基于jQuery实现鼠标点击导航菜单水波动画效果附源码下载,需要的朋友参考下...2016-01-08
  • BootStrap 附加导航组件

    Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架,主要基于 HTML、CSS、JAVASCRIPT 的。接下来通过本文给大家介绍BootStrap 附加导航组件的知识,感兴趣的朋友一起学习吧...2016-07-29
  • jQuery实现的导航下拉菜单效果

    这篇文章主要介绍了jQuery实现的导航下拉菜单效果,涉及jQuery响应鼠标事件动态操作页面元素的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下...2016-07-06
  • 微信小程序实现导航功能的操作步骤

    这篇文章主要给大家介绍了关于微信小程序实现导航功能的操作步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-03-10
  • Unity3D UGUI实现翻书特效

    这篇文章主要为大家详细介绍了Unity3D UGUI实现翻书特效,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • Bootstrap导航栏各元素操作方法(表单、按钮、文本)

    这篇文章主要介绍了Bootstrap导航栏各元素操作方法,针对表单、按钮、文本进行操作,感兴趣的小伙伴们可以参考一下...2015-12-29
  • jQuery实现网页顶部固定导航效果代码

    这篇文章主要介绍了jQuery实现网页顶部固定导航效果代码,涉及jQuery响应scroll事件动态操作页面元素样式的相关技巧,需要的朋友可以参考下...2015-12-25
  • jQuery实现B2B网站后台管理系统侧导航

    这篇文章主要介绍了jQuery实现B2B网站后台管理系统侧导航,文中示例代码非常详细,帮助大家更好的理解和学习,感兴趣的朋友可以了解下...2020-07-09
  • Unity3D实现飞机大战游戏(1)

    这篇文章主要为大家详细介绍了Unity3D实现飞机大战游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-11-03
  • Unity3D使用GL实现图案解锁功能

    这篇文章主要为大家详细介绍了Unity3D使用GL实现图案解锁功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • Bootstrap3制作自己的导航栏

    这篇文章主要教会大家如何利用Bootstrap3制作自己的导航栏,设计自己喜欢的元素、样式,感兴趣的小伙伴们可以参考一下...2016-05-14
  • Unity3D游戏开发数据持久化PlayerPrefs的用法详解

    在本篇文章里小编给大家整理了关于Unity3D游戏开发之数据持久化PlayerPrefs的使用的相关知识点内容,需要的朋友们参考下。...2020-06-25
  • Bootstrap多级导航栏(级联导航)的实现代码

    这篇文章主要介绍了Bootstrap多级导航栏的实现代码的相关资料,需要的朋友可以参考下...2016-03-10
  • Unity3D基于OnGUI实时显示FPS

    这篇文章主要介绍了Unity3D基于OnGUI实时显示FPS,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • Unity3D仿写Button面板事件绑定功能

    这篇文章主要为大家详细介绍了Unity3D仿写Button面板事件绑定功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • unity3D实现三维物体跟随鼠标

    这篇文章主要为大家详细介绍了unity3D实现三维物体跟随鼠标,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2020-06-25
  • CSS3 media queries结合jQuery实现响应式导航

    这篇文章主要为大家详细介绍了CSS3 media queries结合jQuery实现响应式导航,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-10-02
  • unity3d调用手机或电脑摄像头

    这个是在网上看到的,经测试可以在电脑上运行,确实调用了本地摄像头。有需要的小伙伴可以参考下。...2020-06-25
  • 在ASP.NET 2.0中操作数据之三:创建母版页和站点导航

    本文主要介绍在ASP.NET如何创建母版页以及站点地图等操作,母版页的实现的功能有点类似自定义用户控件,可以实现网站页面统一的设计和布局。...2021-09-22