【问题标题】:Programming custom GUI OPenGL编程自定义 GUI OPenGL
【发布时间】:2021-04-28 00:20:32
【问题描述】:

我正在 OpenTK 中创建自己的 GUI。

我想在光标位于某个 GUI 控件时触发鼠标事件。我怎样才能做到这一点?因为现在我只是遍历主类中的项目列表,并且在 Opentk 窗口的 MouseMove 事件中,我只是检查鼠标坐标是否在我正在绘制的组件的“区域”内.

目前这可行,但我认为可以以更好的方式完成。这样我的代码是无序的并且在主类中,我宁愿将它放在特定的组件类中。

我希望在我的 GUI 的每个组件上附加一个事件,这样我就可以为一个组件定义多个事件。

我的意思是,我想拥有一个按钮组件,我可以在其中覆盖或仅使用在事件发生时触发的方法。与 OpenGL 的窗口相同,您可以在其中覆盖事件。

【问题讨论】:

  • 您似乎描述了一个合理的设计。您是否尝试过实施它?你有遇到什么问题吗?
  • @HymnsForDisco 问题是,我不知道该怎么做。我有我想要的想法,但不知道如何去做。你有什么想法吗?

标签: user-interface opengl opentk


【解决方案1】:

这不是一个完整的答案,因为您的问题相当广泛,但我希望它有所帮助。

为了实现这样的系统,以下是潜在设计的核心组件:

UI 组件: 某种标准接口,不同的组件类型可以定义交互逻辑。根据语言的不同,最常见的方法可能类似于父类组件,其中的方法可以被覆盖。这些可能包括以下内容:

  • 鼠标悬停
  • 鼠标单击(按下/释放)
  • 点击拖动

它还可能需要一些额外的相关信息:

  • 确定组件位置的某种方法。可能是提供一个边界框,或者可能是一个测试给定点是否在此组件内的方法。
  • 用于绘制组件的信息或功能。
  • 显示和分层设置(是可见还是隐藏,应该绘制在其他组件的顶部还是后面)。

UI 上下文:上下文是定义 UI 中存在的组件集的结构。这可能类似于组件的列表结构。为了构建您的 UI,您需要将组件添加到此上下文中。上下文将定义一些行为:

  • 管理组件(添加/删除/修改)。
  • 如何绘制整个上下文(例如,循环每个组件并为每个组件执行绘制功能)。
  • 事件处理(见下一节)

事件分派:为了使您的 UI 可用,您可以插入一个“适配器”层来处理来自您的窗口库 (OpenTK) 的事件,然后将它们转换为您的组件的可用事件并分派它们。下面是一个示例,说明这如何适用于“点击”事件(伪代码):

function TK_Event_ClickPressed(point) {
    for component in context {
        if component.ContainsPoint(point) {
            component.EventClickPressed()
        }
    }
}

在我看来,这实际上是设计中更棘手的部分,因为围绕基于组件的 UI 的工作方式存在一些棘手的约定。您不一定要遵循它们,但至少要注意它们很重要,因为人们可能希望您的 UI 能够正常工作:

  • 单击按下后,单击拖动会继续发生,直到单击释放,即使光标离开组件区域。
  • 点击释放时发生“操作”。
  • 只有在同一组件上发生相应的点击按下时,点击释放才会生效。
  • 如果光标不再在组件内,点击释放不执行任何操作(在释放之前离开并重新进入组件仍然会执行操作,不过)。
  • 您一次只能主动点击一个组件(顶部显示的那个),即使多个组件在该位置重叠。

假设您遵循这些约定,这意味着调度事件实际上比仅检查事件点是否在给定组件中要复杂一些。您需要维护某种状态来跟踪上下文当前是否处于单击状态,以及哪个组件(如果有)正在“消耗”当前单击。也就是说,如果发生点击释放和拖动事件,应该给哪个组件。


有了这些系统,您只需要创建一个窗口,创建一个 UI 上下文,将适配器层注册到窗口以作用于该上下文,设置窗口以在框架上绘制上下文,然后使用该上下文在程序中添加/删除/修改组件。

【讨论】:

  • 谢谢!这是我可以开始的事情
猜你喜欢
  • 2020-07-30
  • 1970-01-01
  • 1970-01-01
  • 2023-03-31
  • 2011-07-20
  • 2013-04-17
  • 2014-05-05
  • 2012-01-31
  • 2011-02-03
相关资源
最近更新 更多