【Unity】使用AnimationCurve组件制作类似圆柱滚动的选项界面

策划需求要一个类似圆柱滚动的展示界面,但UGUI自带的Scroll View并不支持缩放变化这些效果,只能百度寻找答案,后发现AnimationCurve的一个案例,通过这个组件可以实现这样的渐变效果

在VS中定义一个AnimationCurve类型的变量,可以通过F12查看其中包含的一些方法和属性

由于我对这个组件了解并不深,所以并没有用代码的形式调整动画曲线,声明称公共的之后可以在面板上很方便的调整,主要用到的是其中的 Evaluate 这一方法

        //
        // 摘要:
        //     Evaluate the curve at time.
        //
        // 参数:
        //   time:
        //     The time within the curve you want to evaluate (the horizontal axis in the curve
        //     graph).
        //
        // 返回结果:
        //     The value of the curve, at the point in time specified.
        [GeneratedByOldBindingsGeneratorAttribute]
        public float Evaluate(float time);

简单来讲就是传入一个x轴的值返回曲线对应的y值。

关于我这个界面的制作,主要是通过实现EventSystem中拖拽点击的几个接口,用百分比值计算获取实际数据的方式设置属性

先说Item,只需要初始化方法和一个移动的方法

public class UI_Control_ScrollFlow_Item : MonoBehaviour
{
    private UI_Control_ScrollFlow parent;
    [HideInInspector]
    public RectTransform rect;
    public Image img;
    /// 
    /// 所处的百分比值
    /// 
    public float v=0;
    private Vector3 p, s;
    /// 
    /// 缩放值
    /// 
    public float sv;
    private Color color;

    public void Init(UI_Control_ScrollFlow _parent)
    {
        rect =this. GetComponent();
        img = this.GetComponent();
        parent = _parent;
        color = img.color;
    }

    public void Drag(float value)
    {
        v += value;
        p=rect.localPosition;
        p.x=parent.GetPosition(v);
        rect.localPosition = p;

        color.a = parent.GetApa(v);
        img.color = color;
        sv = parent.GetScale(v);
        s.x = sv;
        s.y = sv;
        s.z=1;
        rect.localScale = s;
    }
}

拖拽的方法只是通过百分比值确定属性进行赋值更改Item的属性,主Rect的控制方法如下,关于形成循环这里还有很大问题,虽然目前可以通过拖拽调整Rect的大小范围进行隐藏,但是当子项数据较多的时候并不好,应当采用刷新Item数据的方式,而不用创建这么多的子物体,动画效果则只需要点击面板上的动画曲线进行调整即可,我这个缩放曲线就是一个二次函数波峰的形状,略微调整了一下透明度,位置曲线是±0.5因为锚点在中间,设置到最左也可以从零开始

public class UI_Control_ScrollFlow : MonoBehaviour, IBeginDragHandler, IDragHandler, IEndDragHandler, IPointerClickHandler
{
    public RectTransform Rect;
    public List Items;
    /// 
    /// 宽度
    /// 
    public float Width = 1920;
    /// 
    /// 大小
    /// 
    public float MaxScale = 1;
    /// 
    /// StartValue开始坐标值,AddValue间隔坐标值,小于vmian 达到最左,大于vmax达到最右
    /// 
    public float StartValue = 0.1f, AddValue = 0.2f, VMin = 0.1f, VMax = 0.9f;
    /// 
    /// 坐标曲线
    /// 
    public AnimationCurve PositionCurve;
    /// 
    /// 大小曲线
    /// 
    public AnimationCurve ScaleCurve;
    /// 
    /// 透明曲线
    /// 
    public AnimationCurve ApaCurve;
    /// 
    /// 计算值
    /// 
    private Vector2 start_point, add_vect;
    /// 
    /// 动画状态
    /// 
    public bool _anim = false;
    /// 
    /// 动画速度
    /// 
    public float _anim_speed = 1f;

    private float v = 0;
    private List GotoFirstItems = new List(), GotoLaserItems = new List();
    public event CallBack MoveEnd;
    //初始化
    public void Refresh()
    {
        //初始化Item列表
        for (int i = 0; i < Rect.childCount; i++)
        {
            Transform tran = Rect.GetChild(i);
            UI_Control_ScrollFlow_Item item = tran.GetComponent();
            if (item != null)
            {
                Items.Add(item);
                item.Init(this);
                item.Drag(StartValue + i * AddValue);
                if (item.v - 0.5 < 0.05f)
                {
                    Current = Items[i];
                }
            }
        }
    }
    public void OnBeginDrag(PointerEventData eventData)
    {
        start_point = eventData.position;
        add_vect = Vector3.zero;
        _anim = false;
    }

    public void OnDrag(PointerEventData eventData)
    {
        add_vect = eventData.position - start_point;
        v = eventData.delta.x * 1.00f / Width;
        //Debug.LogError(v);
        for (int i = 0; i < Items.Count; i++)
        {
            Items[i].Drag(v);
        }
        Check(v);
    }

    //判断拖拽方向形成循环
    public void Check(float _v)
    {
        if (_v < 0)
        {//向左运动
            for (int i = 0; i < Items.Count; i++)
            {
                if (Items[i].v < (VMin))
                {
                    GotoLaserItems.Add(Items[i]);
                }
            }
            if (GotoLaserItems.Count > 0)
            {
                for (int i = 0; i < GotoLaserItems.Count; i++)
                {
                    GotoLaserItems[i].v = Items[Items.Count - 1].v + AddValue;
                    Items.Remove(GotoLaserItems[i]);
                    Items.Add(GotoLaserItems[i]);
                }
                GotoLaserItems.Clear();
            }
           
        }
        else if (_v > 0)
        {//向右运动,把超出右边的放到前面来

            for (int i = Items.Count - 1; i > 0; i--)
            {
                if (Items[i].v >= VMax)
                {
                    GotoFirstItems.Add(Items[i]);
                }
            }
            if (GotoFirstItems.Count > 0)
            {
                for (int i = 0; i < GotoFirstItems.Count; i++)
                {
                    GotoFirstItems[i].v = Items[0].v - AddValue;
                    Items.Remove(GotoFirstItems[i]);
                    Items.Insert(0, GotoFirstItems[i]);
                }
                GotoFirstItems.Clear();
            }
        }

    }

    public void OnEndDrag(PointerEventData eventData)
    {
        float k = 0, v1;
        for (int i = 0; i < Items.Count; i++)
        {
            if (Items[i].v >= VMin)
            {
                v1 = (Items[i].v - VMin) % AddValue;//还需要位移的百分比
              
                if (add_vect.x >= 0)//判断左右移
                {
                    k = AddValue - v1;
                }
                else
                {
                    k = v1 * -1;
                }
                break;
            }
        }
        add_vect = Vector3.zero;
        AnimToEnd(k);
    }

    public void OnPointerClick(PointerEventData eventData)
    {
 
        if (add_vect.sqrMagnitude <= 1)
        {
           
            UI_Control_ScrollFlow_Item script = eventData.pointerPressRaycast.gameObject.GetComponent();
            if (script != null)
            {
                float k = script.v;
                k = 0.5f - k;
                AnimToEnd(k);
            }

        }
    }


    public float GetApa(float v)
    {
        return ApaCurve.Evaluate(v);
    }
    public float GetPosition(float v)
    {
        return PositionCurve.Evaluate(v) * Width;
    }
    public float GetScale(float v)
    {
        return ScaleCurve.Evaluate(v) * MaxScale;
    }


    private List SortValues = new List();
    private int index = 0;
    //排序Item的层次关系
    public void LateUpdate()
    {
        for (int i = 0; i < Items.Count; i++)
        {
            if (Items[i].v >= VMin && Items[i].v <= VMax)
            {
                index = 0;
                for (int j = 0; j < SortValues.Count; j++)
                {
                    if (Items[i].sv >= SortValues[j].sv)
                    {
                        index = j + 1;
                    }
                }

                SortValues.Insert(index, Items[i]);
            }
        }

        for (int k = 0; k < SortValues.Count; k++)
        {
            SortValues[k].rect.SetSiblingIndex(k);
        }


        SortValues.Clear();
    }

    private float AddV = 0, Vk = 0, CurrentV = 0, Vtotal = 0, VT = 0;
    //private float _v1 = 0, _v2 = 0;

    //private float start_time = 0, running_time = 0;

    public UI_Control_ScrollFlow_Item Current;


    //提供保持选项居中所需位移
    public void AnimToEnd(float k)
    {
        AddV = k;
        if (AddV > 0) { Vk = 1; }
        else if (AddV < 0) { Vk = -1; }
        else
        {
            return;
        }
        Vtotal = 0;
        _anim = true;
    }
    //检测居中
    void Update()
    {
        if (_anim)
        {
            CurrentV = Time.deltaTime * _anim_speed * Vk;//一帧时间*动画速度*动画方向=这帧移动的距离向量
            VT = Vtotal + CurrentV;//已经挪的距离
            //判断还需要挪的距离
            if (Vk > 0 && VT >= AddV) { _anim = false; CurrentV = AddV - Vtotal; }
            if (Vk < 0 && VT <= AddV) { _anim = false; CurrentV = AddV - Vtotal; }
            //==============
            for (int i = 0; i < Items.Count; i++)
            {
                Items[i].Drag(CurrentV);//移动Item位置
                if (Items[i].v - 0.5 < 0.05f)
                {
                    Current = Items[i];
                }
            }
            Check(CurrentV);
            Vtotal = VT;//用于累加的中间变量
        }
    }
}

 

你可能感兴趣的:(Unity)