UGUI如果只做特定次数的滑动界面

  今天朋友问,他该怎么样只做一个滚动界面,而且每次恰好滚动在正中间,开始我想了一下我告诉他你自己计算位置吧。我朋友一脸懵逼,说怎么计算。。

  我这么懒。。我说你试试别的办法,他说啥。。好吧,我只能自己动手来帮他做一个了。

  其实很简单我们只需要使用到scroll rect上的滑动条来控制这个滑动界面的滑动次数,假如我们有10张图,那么我们就设置滑动条10步才能从0-1.这样保证每次我们滑动的都是间隔一个图的距离。

  顺便在这里写一下如何制作滑动条界面吧。

  首先创建一个画布后,我们创建一个panel当做我们滑动界面的背景好吧,由于我比较懒。。所以也没有找什么图,都是白的。大家不要介意。












这这个之后在Panel上创建一个空物体,空物体的大小决定滑动范围的大小。


之后创建若干个image当做我们滑动的图标。


如上图,我们在空物体上添加Grid Layot Group和Content Size Fitter来控制Image的排序和大小。效果如下图。

我们在panel上添加Scroll rect组件 把 content设置成我们创建的空物体,同时创建一个滑动条来控制水平方向的滑动,这里我勾掉了竖直方向的滑动。把滑动条关联上。

修改滑动条设置如下:


Number of Steps 就是设置特定次数滑动的关键属性,这里我有10张图片我设置10. 通过上面的size可以发现。他是根据这个步数来改变的。

这时候运行场景就可以做到一个可以滑动10次的滑动界面且每次图片都是正中央~。

示例工程地址

欢迎大家一起交流UGUI,AR,VR等方面的知识~共同进步

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
### 回答1: UGUI是Unity引擎中的一套用户界面系统,可以用于开发游戏中的各种UI界面。在UGUI中,可以通过设置滑动条的大小和位置来实现中间大两边小的滑动效果。 首先,我们可以通过在Scene场景中创建一个空的Canvas对象来添加UI元素。然后在Canvas上创建一个Image对象,作为滑动条的背景。可以通过调整Image对象的大小和位置,设置为中间大两边小的形状。 接下来,在Canvas上创建一个Slider对象,并设置该Slider的RectTransform属性,使其与Image对象的大小和位置保持一致。在Slider对象上添加Slider组件,并调整Value属性的值,使Slider的拇指(Thumb)控制器位于中间位置。 然后,通过调整Image对象的渐变效果,使得滑动条在两边逐渐变小。可以使用渐变图像或Gradient组件来实现这个效果。将透明度或颜色的渐变应用到Image对象上,使得滑动条的两端逐渐变得不可见或透明。 最后,我们还可以通过添加其他UI元素来增强滑动条的效果,比如在滑动条的两端添加箭头、文本或其他图标。可以使用UGUI内置的Button、Text或Image组件来实现这些效果。 通过以上步骤,我们可以使用UGUI实现中间大两边小的滑动效果。调整滑动条和滑动条背景的大小、位置,设置渐变效果和添加其他UI元素,可以使滑动条呈现出符合需求的效果。UGUI提供了简单易用的UI开发工具,为游戏开发者提供了更多自定义UI界面的可能性。 ### 回答2: UGUI(Unity Graphic User Interface)是Unity引擎中用于创建用户界面的工具。对于“中间大两边小的滑动”效果,在UGUI中可以通过使用Scroll Rect组件和Content组件来实现。 首先,创建一个UI画布(Canvas),然后在画布上创建一个Panel,并将Panel设置为可滚动的区域。接下来,添加一个Scroll Rect组件到Panel上。在Scroll Rect组件中,将Content属性设置为一个包含滑动内容的RectTransform。 通过调整Content的RectTransform,可以实现“中间大两边小”的效果。可以将Content的宽度设置为大于画布宽度的值,然后将锚点和位置调整到正确的位置,使其在Panel中居中显示。根据实际情况,还可以通过添加ContentSize Fitter组件来自动调整Content的大小,以适配内容。 最后,在Scroll Rect组件中,将Horizontal属性设置为true,允许水平滑动。可以调整滑动的灵敏度、惯性、以及滚动条的显示与否,以便实现所需的效果。 通过以上步骤,就可以在UGUI中实现“中间大两边小”的滑动效果。可以通过动态改变Content的大小和位置,使内容在中间放大显示,两侧内容缩小显示,并通过滑动实现内容的切换和浏览。这样可以为用户提供更好的交互体验和视觉效果。 ### 回答3: ugui是Unity的一个UI系统,提供了许多用于创建用户界面的工具和组件。其中,中间大两边小的滑动效果可以通过ugui中的ScrollRect组件实现。 ScrollRect组件是一个可滚动区域的容器,可以将内容放置在其中,并通过滑动来查看隐藏的内容。想要实现中间大两边小的滑动效果,可以通过以下步骤进行设置: 1.在Unity编辑器中,选择需要实现滑动效果的Canvas对象,然后在Inspector面板中点击Add Component按钮,搜索并添加ScrollRect组件。 2.在ScrollRect组件的Inspector面板中,可以设置一些滑动效果的属性。首先,将Horizontal属性和Vertical属性的值都设置为false,这样就只能在一个方向上滑动。 3.然后,在Content属性中,将需要放置在滚动区域内的内容拖拽到这个属性中。例如,可以将一张图片作为背景拖拽到Content属性中。 4.接下来,可以在HorizontalScrollbar和VerticalScrollbar属性中,将Scrollbar预制体拖拽到对应的属性中,用于显示水平和垂直方向上的滑动条。 5.最后,在Viewport属性中,可以设置背景图的大小,将背景图的宽度设置为较大的值,高度设置为较小的值,以实现中间大两边小的效果。 设置完上述属性后,运行程序,就可以通过鼠标滑动或触摸操作来查看滚动区域中的内容了。滑动的时候,内容会根据滑动方向进行滚动,实现了中间大两边小的效果。 通过ugui中的ScrollRect组件,可以方便地实现中间大两边小的滑动效果,适用于开发游戏、应用等需要滚动显示内容的界面设计。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值