UG4L15——拖拽相关

本章代码关键字

1
2
3
4
5
gObject.draggable            //将对象的拖曳功能打开
gObject.onDragStart.Add()    //对象开始拖动监听事件
gObject.onDragMove.Add()    //对象拖动中监听事件
gObject.onDragEnd.Add()        //对象拖动结束监听事件
gObject.dragBounds            //限制对象的拖动范围

现有知识实现拖拽

利用onTouchBegin​、onTouchEnd​、onTouchMove​事件可以完成拖拽功能

FGUI中的自由拖拽功能

获取对象设置 draggable​ 属性为 true​ 即可拖拽

注意：拖动只能在元件父组件内移动

1
2
3
//显示面板
TeachPanel panel = UIManager.Instance.ShowPanel<TeachPanel>("teach");
panel.m_btnTest.draggable = true;

该元件即可拖曳至父对象下的如何地方

​imageimage​

自由拖曳事件相关

  1. 开始拖

    1
    2
    3
    4
    5
    6
    7
    //显示面板
    TeachPanel panel = UIManager.Instance.ShowPanel<TeachPanel>("teach");
    panel.m_btnTest.draggable = true;
    panel.m_btnTest.onDragStart.Add(() =>
    {
        print("开始拖");
    });

    输出：​image​

  2. 拖动中

    可以通过eventContext.inputEvent.x/y​来获取拖动到了哪个位置

    1
    2
    3
    4
    5
    6
    7
    //显示面板
    TeachPanel panel = UIManager.Instance.ShowPanel<TeachPanel>("teach");
    panel.m_btnTest.draggable = true;
    panel.m_btnTest.onDragMove.Add((eventContext) =>
    {
        print("拖动中" + new Vector2(eventContext.inputEvent.x, eventContext.inputEvent.y));
    });

    输出：image​

  3. 结束拖

    1
    2
    3
    4
    5
    6
    7
    //显示面板
    TeachPanel panel = UIManager.Instance.ShowPanel<TeachPanel>("teach");
    panel.m_btnTest.draggable = true;
    panel.m_btnTest.onDragEnd.Add(() =>
    {
        print("结束拖");
    });

    输出：image​

设置拖动范围

注意！范围是舞台上的坐标（物理屏幕坐标），不是元件的本地坐标

1
panel.m_btnTest.dragBounds = new Rect(500, 0, 1000, 200);