近期在项目中，策划给出了一个需求就是，让按钮按照一个轮盘的轨迹进行滑动的效果，经过一番测试，实现了初步的效果。
我这里区分了横向滑动和纵向滑动，这里以纵向滑动为例子进行示范，实现按钮的滑动效果。
首先就是先进行位置初始化:
/// <summary>
///从大到小排序,Y轴
/// </summary>
private Comparison<CircleScrollRectItemBase> ComparisionY =
delegate (CircleScrollRectItemBase itemA, CircleScrollRectItemBase itemB)
{
if (itemA.transform.localPosition.y == itemB.transform.localPosition.y) return 0;
return (itemA.transform.localPosition.y > itemB.transform.localPosition.y) ? -1 : 1;
};
public void Init()
{
if (null == listItems || listItems.Length == 0)
{
return;
}
if (itemPostions != null && itemPostions.Length > 0)
{
for (int i = 0; i < itemPostions.Length; i++)
{
listItems[i].transform.localPosition = itemPostions[i];
}
}
//XY轴排序按不同方式排序，可以统一使用共同的函数
if (horizontal)
{
//位置从小到大排序
Array.Sort(listItems, ComparisionX);
}
else
{
//位置从大到小排序
Array.Sort(listItems, ComparisionY);
}
//设置元素关系及固定位置
itemPostions = new Vector3[listItems.Length];
for (int i = 0; i < listItems.Length; ++i)
{
listItems[i].SetItemConfig(i, //set id
listItems[(i + 1) % listItems.Length], //next item
listItems[(i - 1 + listItems.Length) % listItems.Length]); //previous item
itemPostions[i] = new Vector3(listItems[i].transform.localPosition.x,
listItems[i].transform.localPosition.y,
listItems[i].transform.localPosition.z);
listItems[i].currPosIndex = i;
}
RefreshContentListLength();
GetCurrPointItem();
InitValue();
}
鼠标拖动时的更新代码：
开始拖动设置拖拽状态
public virtual void OnBeginDrag(PointerEventData eventData)
{
BeginDrag(eventData);
}
public void BeginDrag(PointerEventData eventData)
{
dragging = true;
needAdjust = false;
dragStartPostion = eventData.position;
}
在拖动过程中更新item的位置
/// <summary>
// 拖动中更新位置
/// </summary>
/// <param name="eventData"></param>
public virtual void OnDrag(PointerEventData eventData)
{
Draging(eventData);
}
public void Draging(PointerEventData eventData)
{
if (horizontal)
{
if (ShiftListHorizontal(eventData.position - dragStartPostion))
{
dragStartPostion = eventData.position; //更新起始位置
}
}
else
{
if (ShiftListVertical(eventData.position - dragStartPostion))
{
dragStartPostion = eventData.position; //更新起始位置
}
}
}
拖动结束，调整位置，刷新指定界面
/// <summary>
/// 拖动结束
/// </summary>
/// <param name="eventData"></param>
public virtual void OnEndDrag(PointerEventData eventData)
{
EndDrag(eventData);
}
public void EndDrag(PointerEventData eventData)
{
dragging = false;
if (needAdjust)
{
if (horizontal)
{
AdjustLocationX();
}
else
{
AdjustLocationY();
}
}
//在滑动结束 处理变换颜色和其他信息
GetCurrPointItem();
}
处理收拾滑动，还做了点击指定item ,自动跳转过去
//在这里获取所有类型的按钮
for (int i = 0; i < listItems.Length; i++)
{
GameObject go = listItems[i].gameObject;
listItems[i].GetComponent<Button>().onClick.AddListener(() =>
{
AutoMoveAllItem(go);
});
}
/// <summary>
/// 根据点击情况 自动移动所有的道具类型按钮
/// </summary>
/// <param name="go"></param>
private void AutoMoveAllItem(GameObject go)
{
//如果正在拖拽 不进行任何操作
if (dragging)
{
return;
}
//点击中间那个 不进行任何操作
if (go.transform.localPosition.y == 0)
{
return;
}
//所有按钮下一一格
if (go.transform.localPosition.y > 0)
{
UpdateItemMovePos(2);
}
//上移
else
{
UpdateItemMovePos(1);
}
}
下面是实现的效果：
工程地址：Unity实现轮盘方式的按钮滚动效果
