竖倾斜ScrollView
using UnityEngine;
using UnityEngine.EventSystems; public class ObliqueScroll : MonoBehaviour,IDragHandler
{
public RectTransform viewport;
public ObliqueScrollContent content; private Transform target;
private float space_min;
private float space_max; private Vector3 position_c; private void OnValidate()
{
if (content != null)
{
target = content.transform;
space_min = ;
space_max = target.childCount * (content.v_cell.y + content.v_space) - viewport.rect.height;
if (space_max < )
{
space_max = ;
}
}
} public void OnDrag(PointerEventData eventData)
{
float move_c = eventData.delta.y;
position_c = target.localPosition;
position_c.y += move_c;
position_c = CheckOut(position_c);
target.localPosition = position_c;
} private Vector3 CheckOut(Vector3 position)
{
if (position.y <= space_min)
{
position.y = space_min;
}
if (position.y >= space_max)
{
position.y = space_max;
}
return position;
}
}
using UnityEngine; public class ObliqueScrollContent : MonoBehaviour
{
public Vector2 v_cell;
public float v_space;
public float v_offset; private Vector2 half = new Vector2(0.5f, 0.5f); private void OnValidate()
{
Refresh();
} private void Refresh()
{
for (int i = ; i < transform.childCount; i++)
{
Transform cell = transform.GetChild(i);
float pos_x = -i * v_offset;
float pos_y = -i * (v_cell.y + v_space);
RefreshCell(cell, new Vector3(pos_x, pos_y, ));
}
} private void RefreshCell(Transform cell, Vector3 position)
{
RectTransform rt = (RectTransform)cell;
rt.anchorMin = half;
rt.anchorMax = half;
rt.pivot = half;
rt.SetSizeWithCurrentAnchors(RectTransform.Axis.Horizontal, v_cell.x);
rt.SetSizeWithCurrentAnchors(RectTransform.Axis.Vertical, v_cell.y);
rt.localPosition = position;
}
}
只是一个思路,拖动很生硬
Scroll(加ObliqueScroll, 倾斜X度)
viewport(加mask)
content(加ObliqueScrollContent, 倾斜-X度)
item1
item2
item3
竖倾斜ScrollView的更多相关文章
- 【水滴石穿】react-native-app
项目地址:https://github.com/WQone/react-native-app 这个是一个非常优秀的小姐姐写的,希望大家能够以她为榜样,一起加油进步呀- 先看效果 分析package.j ...
- React-Native学习系列(二) Image和ScrollView
接下来,我们接着(一)继续讲,今天我们学习的是Image组件和ScrollView组件. Image组件 Image:一个用于显示多种不同类型图片的React组件.那么要如何使用呢? 引入本地图片: ...
- scrollView的讲解
今天就讲下UIScrollView的一些事情,这个可以拖动的组件无论在应用还是游戏开发都会经常用到,所以我们就一定要更加熟悉它了.下面我们开始下手咯. (1)初始化 一般的组件初始化都可以alloc和 ...
- SwipeRefreshLayout嵌套ScrollView包裹复杂头布局和RecyclerView
布局如下:上面是一个描述有:头像和部分信息的布局,底部是一个RecyclerView: 想法:想实现RecyclerView向上滚动的时候,隐藏上面的头像布局信息:使用了 CoordinatorLay ...
- iOS开发——项目篇—高仿百思不得姐 05——发布界面、发表文字界面、重识 bounds、frame、scrollView
加号界面(发布模块) 一.点击加号modal出发布模块,创建控件,布局控件1)使用xib加载view,如果在viewDidLoad创建控件并设置frame 那么self.view 的宽高 拿到的是xi ...
- RecyclerView和ScrollView嵌套使用
我们的recyclerView有多个layoutmanager,通过重写layoutmanager的方法就可以让recyclerView和ScrollView嵌套了.但是请注意,如果recyclerV ...
- ScrollView图片分页显示-简单
用到的控件: 1>UIScrollView:宽度和图片的宽度一样,因为分页的代码就一句 // 设置分页,这个分页的原理实际上是按照ScrollView的宽进行分页的,这里的图片的宽由于和Scro ...
- ScrollView嵌套recyclerView出现的滑动问题
记得以前在解决scrollView与ListView嵌套问题时,那个时候是自定义了listView去测量listView高度,今天项目中刚 好碰到了要用recycerView,同样也是嵌套在scrol ...
- 制作滚动视图(ScrollView)
怎样判断是否应当使用滚动视图 所谓的滚动视图,是指一个可以滑动的视窗,视窗大小和位置固定不变,视窗内的内容用户可以通过手指滑动或者拖动滚动天来进行滚动浏览. 滚动视图的目的是为了解决同类内容过多,一个 ...
随机推荐
- Kafka原理总结
Kafka Kafka是最初由Linkedin公司开发,是一个分布式.支持分区的(partition).多副本的(replica),基于zookeeper协调的分布式消息系统,它的最大的特性就是可以实 ...
- 四大中三家已面向客户推出机器人业务解决方案?别逗了,先用机器人自我革命吧! post by 上海嘉冰信息技术
近日,四大会计师事务所推出的机器人财务及业务解决方案的话题引爆朋友圈.鉴于该话题的前沿性以及对财务及业务领域从业人员未来职业发展有巨大的影响,引起热门讨论在所难免.小编先来汇总下目前国际四大会计师事务 ...
- IIS 请求 超时设置
asp.net 默认的 session state 模式是 in proc(进程内),数据是在网站的应用程序池里面保存的.这样在 web.config 设置的超时时间,是在应用程序池没有发生回收的基础 ...
- Kibana学习笔记——安装和使用
1.首先下载Kibana https://www.elastic.co/downloads 2.解压 tar -zxvf kibana-6.2.1-linux-x86_64.tar.gz -C ~/s ...
- Centos7 启动脚本
Centos7 启动脚本 启动脚本.如果进程已存在,输出错误信息后退出: #! /bin/bash PIDS=`ps -ef | grep '/usr/bin/node ./index.js' | g ...
- 可视化展示attention(seq2seq with attention in tensorflow)
目前实现了基于tensorflow的支持的带attention的seq2seq.基于tf 1.0官网contrib路径下seq2seq 由于后续版本不再支持attention,迁移到melt并做了进一 ...
- Go学习笔记(四)Go自动化测试框架
上篇Go学习笔记(三)Go语言学习 Go自动化测试非常简单,在结合VSCode的,让测试完全自动化 一 .编辑器下测试 1.测试代码以xxx_test.go方式命名 2.测试函数要以 func Tes ...
- Cookiecutter: 更好的项目模板工具:(1)简介及可用资源汇总
原文档地址:https://cookiecutter.readthedocs.io/en/latest/ 本系列只介绍cookiecutter的基础使用,而且会删除与功能使用无关的部分.深度使用及了解 ...
- 联想R720面板右下部分按压后和上面按键串联了
如图所示的位置,一用力按压,就会触发键盘的按键. 前提: 本人刚刚加装了内存条,内存条是京东买的 十铨(Team) DDR4 2400 8GB 笔记本内存,安装完内存以后,发现电脑出了这样的问题. 解 ...
- Ubuntu系统安装nginx
1.首先查看linux系统 cat /proc/version Linux version 4.9.59-v7+ (dc4@dc4-XPS13-9333) (gcc version 4.9.3 (cr ...