CN103279357A - 计算机图形界面中实现滑动轮盘控件功能的系统及其方法 - Google Patents

Abstract

本发明涉及一种计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其中包括输入接口模块、输出接口模块、数据模块、算法控制器模块、视图模块。本发明还涉及一种基于该系统实现具备舒适人机交互体验的滑动轮盘控件功能的方法。采用该种计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法，由于其中取二维和三维技术的优点，并基于三维图形显示技术，实现方式适用于所有具备三维图形显示能力的计算机设备，使得利用计算机图形学技术理论，结合相应的精准算法，实现与用户产生丰富流畅互动的图形界面，从而给用户带来舒适的感官享受，节约系统资源、工作性能稳定可靠、适用范围较为广泛。

Description

计算机图形界面中实现滑动轮盘控件功能的系统及其方法

技术领域

本发明涉及计算机软件图形学领域，特别涉及计算机软件界面动画与人机交互技术领域，具体是指一种计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法。

背景技术

随着多媒体技术的不断发展进步，用户界面历经多次变革。身处这个时代的人们已经不满足于只完成功能需求而忽略用户体验的软件，由此催生出众多简单高效，充满趣味让人身心愉快的用户界面以及交互方式。

用户界面虽历经多次变革，但用户浏览信息的方式却大都仍以传统的平面列表或大图块的方式进行，这样的浏览方式优点是简洁明了，技术实现简单，只需要对图像做二维的X轴或Y轴上的平移变换，缺点是太过抽象，拟物的表现力不足，缺少用户操作的乐趣。

另外一类浏览方式则是赋予界面复杂多变的三维效果，在用户浏览过程中模拟现实世界物品的各种特效，带给用户更有趣味的图形界面。但是由于三维界面相较于二维界面单单在几何变换矩阵上就要多出一个维度，且由于三维变换过程中常常因为精度问题而产生锯齿现象，因此计算机不可避免的需要对图形数据进行多次重复计算以便修正这种现象。因此这种方式的一个显然的缺点就是实现算法复杂，会占用大量CPU和GPU的资源来处理图形显示，造成部分老式计算机无法流畅运行，且不方便用户预览更多的信息。种种缺点降低了这种浏览方式在应用程序中大量运用的可能性。

轮盘的一种实现方式是苹果iPhone、iPad应用中广泛运用的日期和数据选择控件（UIPickerView），此控件是IOS SDK的UIKit Framework中的标准控件，以二维方式伪装二维半的效果，完全避开了三维实现需要消耗大量计算机资源的弊端。但是在现实运用中，UIPickerView的表现效果欠佳，很多优秀的App都避开了使用苹果的这一控件。

发明内容

本发明的目的是克服了上述现有技术中的缺点，提供一种能够实现与用户产生丰富流畅互动的图形界面、给用户带来舒适的感官享受、节约系统资源、工作性能稳定可靠、适用范围较为广泛的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法。

为了实现上述的目的，本发明的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法如下：

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其主要特点是，所述的系统包括：

输入接口模块，用于接收输入数据信息和参数信息；

输出接口模块，用于将轮盘控件所捕捉到的事件或流程中的某一个事件传递到外部；

数据模块，用于接收从输入接口模块传入的各种参数信息，并记录系统运行过程中所产生的中间参数；

算法控制器模块，用于接收数据模块的参数信息，并实时计算滑动轮盘的运动轨迹信息；

视图模块，用于接收数据模块输出的数据信息和算法控制器模块输出的运动轨迹信息，进行视图的位置排布控制，设置相应的坐标系系统定义，并提供计算所需要使用的变量信息。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的输入接口模块包括：

数据信息输入接口单元；

图形显示额外指令信息输入接口单元，用于对变换后的视图做额外的几何变换处理，并设置变换后视图的视图参数。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的数据信息输入接口单元包括：

数据条数输入接口子单元，用于输入数据条数信息；

具体数据对象输入接口子单元，用于输入具体的数据对象信息。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的算法控制器模块包括：

视图轨迹线性移动处理单元，用于视图在两端的轨迹变换临界点之间的中间区域移动时进行视图轨迹线性移动计算处理；

视图轨迹曲线移动处理单元，用于视图在边界点和对应的轨迹变换临界点之间的区域移动时进行视图轨迹曲线移动计算处理。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的曲线可以为圆形曲线、椭圆曲线或者贝赛尔曲线。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的视图模块包括：

主容器视图单元；

子视图单元，由所述的视图模块根据从所述的输入接口模块收到的数据条数信息生成，并被添加至所述的主容器视图单元的视图堆栈中显示出来，子视图单元和主容器视图单元之间通过相对坐标系进行定位。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的坐标系系统定义包括：

主容器视图滑动位移坐标系；

子视图坐标系。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的主视图滑动位移坐标系为二维坐标系。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的子视图坐标系为三维坐标系，且该三维坐标系为开启OpenGL透视模式的右手坐标系统，该三维坐标系的中点与主容器视图的中点对齐，并设置主容器视图的左边界为负值，右边界为正值。

该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统中的变量信息包括：

●主容器视图的滑动偏移量；

●子视图相较于三维坐标系中点的偏移量；

●透视幅度；

●减速速率；

●位移速度；

●位移速度倍增值；

●反弹最大比率。

该基于上述的系统实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其主要特点是，所述的方法包括以下步骤：

（1）系统进行初始化处理，并初始化数据信息；

（2）系统创建主容器视图；

（3）系统根据所述的数据模块取到的数据进行子视图生成和排列操作；

（4）系统根据辅助参数实现轮盘控件的滑动效果；

（5）系统实时检测用户对轮盘控件的操作；

（6）如果用户对轮盘控件的操作为点击子视图，则进行点击视图操作处理；

（7）如果用户对轮盘控件的操作为拨动轮盘，则进行子视图滑动处理操作；

（8）如果用户对轮盘控件的操作为子视图拖拽进行子视图拖拽处理操作。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的进行子视图生成和排列操作，包括以下步骤：

（31）所述的主容器视图根据所述的数据模块取到的数据生成相应的子视图对象；

（32）根据子视图对象所对应的索引值在三维坐标系中放置相应的子视图。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的系统根据辅助参数实现轮盘控件的滑动效果，包括以下步骤：

（41）当滑动事件发生时，系统检测到所述的主容器视图的滑动偏移量发生变化；

（42）所述的轮盘控件根据此滑动偏移量所发生的变化，重新计算每一个子视图在三维坐标系中的位置；

（43）系统刷新界面显示。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的实时检测用户对轮盘控件的操作，包括以下步骤：

（51）系统捕捉到用户操作的事件；

（52）所述的轮盘控件将用户操作的事件封装为一个带点击位置信息的对象；

（53）所述的轮盘控件将该对象传递至所述的算法控制器模块。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的进行点击视图操作处理，包括以下步骤：

（61）所述的轮盘控件将用户操作的点击事件发生时的参数传递至所述的算法控制器模块；

（62）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被点中；

（63）所述的算法控制器模块将被点中的对象信息传递到所述的输出接口模块。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的点击事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的进行子视图滑动处理操作，包括以下步骤：

（71）所述的轮盘控件将用户操作的子视图滑动事件发生时的参数传递至所述的算法控制器模块；

（72）所述的算法控制器模块通过计算所接收到的参数来确定用户滑动强度，并判断滑动方向；

（73）所述的算法控制器模块将所述的参数代入滑动数学模型进行计算处理；

（74）所述的算法控制器模块通过相应的计算结果控制滑动效果。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的子视图滑动事件发生时的参数包括滑动起始位置信息和滑动结束位置信息。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的确定用户滑动强度并判断滑动方向，具体为：

通过计算所述的滑动起始位置信息和滑动结束位置信息之间的差值来确定用户滑动强度，并根据该差值的正负来判断滑动方向。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的将参数代入滑动数学模型进行计算处理，包括以下步骤：

（731）当子视图在两端的轨迹变换临界点之间的中间区域移动时，根据线性滑动数学模型进行子视图轨迹线性移动计算处理；

（732）当子视图在边界点和对应的轨迹变换临界点之间的区域移动时，根据曲线滑动数学模型进行子视图轨迹曲线移动计算处理。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的线性滑动数学模型为以下公式：

y＝d×x；

其中，x为主容器视图的滑动偏移量，y为子视图三维坐标系平移量，d为x和y之间的关系的放大量值。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的曲线滑动数学模型可以为弧形方程、圆形方程、椭圆形方程或者贝赛尔曲线方程。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的进行子视图拖拽处理操作，包括以下步骤：

（81）所述的轮盘控件将用户操作的子视图拖拽事件发生时的参数传递至所述的算法控制器模块；

（82）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被拖拽；

（83）所述的算法控制器模块监控被拖拽对象的点击时间长短，当超过系统预设的超时时间，则将被拖拽的对象信息传递到所述的输出接口模块。

该实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法中的子视图拖拽事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息。

采用了该发明的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法，由于其中取二维和三维技术的优点，并基于三维图形显示技术，在实现过程中充分简化图形变换的数学模型，并建立内存回收机制，将不用的超出屏幕可见范围的视图元素从内存中移除，同时将可复用的数据保存到设备的存储介质上，以便下一次可以在界面上快速呈现出这些信息，此实现方式适用于所有具备三维图形显示能力的计算机设备，使得利用计算机图形学技术理论，结合相应的精准算法，实现与用户产生丰富流畅互动的图形界面，从而给用户带来舒适的感官享受，节约系统资源、工作性能稳定可靠、适用范围较为广泛。

附图说明

图1为本发明的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统的功能模块架构示意图。

图2为本发明的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的方法的流程图。

图3为采用了本发明的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统的界面效果示意图。

具体实施方式

为了能够更清楚地理解本发明的技术内容，特举以下实施例详细说明。

请参阅图1所示，该计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其主要特点是，所述的系统包括：

（1）输入接口模块，用于接收输入数据信息和参数信息，其中包括：

（a）数据信息输入接口单元，包括：

●数据条数输入接口子单元，用于输入数据条数信息；

●具体数据对象输入接口子单元，用于输入具体的数据对象信息；

（b）图形显示额外指令信息输入接口单元，用于对变换后的视图做额外的几何变换处理，并设置变换后视图的视图参数；

（2）输出接口模块，用于将轮盘控件所捕捉到的事件或流程中的某一个事件传递到外部；

（3）数据模块，用于接收从输入接口模块传入的各种参数信息，并记录系统运行过程中所产生的中间参数；

（4）算法控制器模块，用于接收数据模块的参数信息，并实时计算滑动轮盘的运动轨迹信息，包括：

●视图轨迹线性移动处理单元，用于视图在两端的轨迹变换临界点之间的中间区域移动时进行视图轨迹线性移动计算处理；

●视图轨迹曲线移动处理单元，用于视图在边界点和对应的轨迹变换临界点之间的区域移动时进行视图轨迹曲线移动计算处理；该曲线可以为圆形曲线、椭圆曲线或者贝赛尔曲线；

（5）视图模块，用于接收数据模块输出的数据信息和算法控制器模块输出的运动轨迹信息，进行视图的位置排布控制，设置相应的坐标系系统定义，并提供计算所需要使用的变量信息，包括：

●主容器视图单元；

●子视图单元，由所述的视图模块根据从所述的输入接口模块收到的数据条数信息生成，并被添加至所述的主容器视图单元的视图堆栈中显示出来，子视图单元和主容器视图单元之间通过相对坐标系进行定位，该坐标系系统定义包括：

■主容器视图滑动位移坐标系；该主视图滑动位移坐标系为二维坐标系；

■子视图坐标系，该子视图坐标系为三维坐标系，且该三维坐标系为开启OpenGL透视模式的右手坐标系统，该三维坐标系的中点与主容器视图的中点对齐，并设置主容器视图的左边界为负值，右边界为正值；

该变量信息包括：

●主容器视图的滑动偏移量；

●子视图相较于三维坐标系中点的偏移量；

●透视幅度；

●减速速率；

●位移速度；

●位移速度倍增值；

●反弹最大比率。

再请参阅图2所示，该基于上述的系统实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其中包括以下步骤：

（1）系统进行初始化处理，并初始化数据信息；

（2）系统创建主容器视图；

（3）系统根据所述的数据模块取到的数据进行子视图生成和排列操作；该进行子视图生成和排列操作，包括以下步骤：

（a）所述的主容器视图根据所述的数据模块取到的数据生成相应的子视图对象；

（b）根据子视图对象所对应的索引值在三维坐标系中放置相应的子视图；

（4）系统根据辅助参数实现轮盘控件的滑动效果，包括以下步骤：

（a）当滑动事件发生时，系统检测到所述的主容器视图的滑动偏移量发生变化；

（b）所述的轮盘控件根据此滑动偏移量所发生的变化，重新计算每一个子视图在三维坐标系中的位置；

（c）系统刷新界面显示；

（5）系统实时检测用户对轮盘控件的操作，包括以下步骤：

（a）系统捕捉到用户操作的事件；

（b）所述的轮盘控件将用户操作的事件封装为一个带点击位置信息的对象；

（c）所述的轮盘控件将该对象传递至所述的算法控制器模块；

（6）如果用户对轮盘控件的操作为点击子视图，则进行点击视图操作处理，包括以下步骤：

（a）所述的轮盘控件将用户操作的点击事件发生时的参数传递至所述的算法控制器模块；该点击事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息；

（b）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被点中；

（c）所述的算法控制器模块将被点中的对象信息传递到所述的输出接口模块；

（7）如果用户对轮盘控件的操作为拨动轮盘，则进行子视图滑动处理操作，包括以下步骤：

（a）所述的轮盘控件将用户操作的子视图滑动事件发生时的参数传递至所述的算法控制器模块；该子视图滑动事件发生时的参数包括滑动起始位置信息和滑动结束位置信息；

（b）所述的算法控制器模块通过计算所接收到的参数来确定用户滑动强度，并判断滑动方向；该确定用户滑动强度并判断滑动方向，具体为：

通过计算所述的滑动起始位置信息和滑动结束位置信息之间的差值来确定用户滑动强度，并根据该差值的正负来判断滑动方向；

（c）所述的算法控制器模块将所述的参数代入滑动数学模型进行计算处理，包括以下步骤：

（i）当子视图在两端的轨迹变换临界点之间的中间区域移动时，根据线性滑动数学模型进行子视图轨迹线性移动计算处理；该线性滑动数学模型为以下公式：

y＝d×x；

其中，x为主容器视图的滑动偏移量，y为子视图三维坐标系平移量，d为x和y之间的关系的放大量值；

（ii）当子视图在边界点和对应的轨迹变换临界点之间的区域移动时，根据曲线滑动数学模型进行子视图轨迹曲线移动计算处理；该曲线滑动数学模型可以为弧形方程、圆形方程、椭圆形方程或者贝赛尔曲线方程。

（d）所述的算法控制器模块通过相应的计算结果控制滑动效果；

（8）如果用户对轮盘控件的操作为子视图拖拽进行子视图拖拽处理操作，包括以下步骤：

（a）所述的轮盘控件将用户操作的子视图拖拽事件发生时的参数传递至所述的算法控制器模块；该子视图拖拽事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息；

（b）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被拖拽；

（c）所述的算法控制器模块监控被拖拽对象的点击时间长短，当超过系统预设的超时时间，则将被拖拽的对象信息传递到所述的输出接口模块。

在实际使用当中，此滑动轮盘控件基于三维图形技术，控件在架构上使用标准的MVC（模型-视图-控制器）架构，包括输入接口，输出接口，数据模块，视图模块，算法控制模块。

输入接口包括两个部分如下：

（1）图形显示额外指令信息输入接口，这部分又可细分为：

●在经过滑动轮盘几何数学模型算法处理之后，还需要对变换后的子视图做一些额外的几何变换处理。

●需要单个设置变换后子视图的视图参数。

（2）数据信息输入接口，可细分为数据总数和单个数据对象接口：

●数据条数的输入接口。

●每一条具体数据对象的输入接口。

输出接口将轮盘控件将轮盘捕捉到的事件或流程中的某一个事件传递到外部：

输出接口的流程如下：

●轮盘控件监控用户操作。

●用户操作了轮盘控件。

●轮盘将此次操作的相关参数传递到外部。

数据模块：

数据模块负责接收从输入接口传入的各种参数，并记录下程序运行过程中产生的中间参数，视图模块和控制器模块的所有数据都从此模块调用。

视图模块：

视图模块涉及视图的位置排布，采用的坐标系系统定义，以及提供给控制器模块算法使用的变量。

视图模块结构上分为两个部分：

●主容器视图。

●子视图，此部分视图不止一个，根据从输入接口传入的数据条数，会生成多个子视图，这些子视图在创建和设置完毕后会被添加到主容器视图的视图堆栈中并显示出来，子视图和主容器视图之间通过相对坐标系进行定位。

坐标系定义如下：

●该控件中坐标系有两个，如下：

■主视图滑动位移坐标系：此坐标系为二维坐标系。

■子视图三维坐标系：

■子视图采用三维坐标系，并开启Opengl的透视模式，这样可以通过三维透视的方式实现物体的立体效果。

■坐标系统采用OPengl的右手坐标系统，有XYZ三个方向的坐标。

■三维坐标系的中点和主容器视图的中点对齐，定义主容器视图的左边界为负值，右边界为正值。

子视图的三维坐标系和主视图的二维坐标系必须视口大小一致且坐标系中心点对齐，这样三维视图中的画面就被完美的映射到了主视图平面上。

变量：

此部分变量在控件运行过程中产生，主要包括：

●主视图的滑动偏移量。

●子视图相较于三维坐标系中点的偏移量。

●透视幅度（实现立体效果）。

●减速速率（模拟物体减速运动效果）。

●位移速度。

●位移速度倍增值。

●反弹最大比率。（此值模拟弹簧效果）

算法控制器模块：

滑动轮盘的数学模型

观看滑动轮盘的运动轨迹可以发现，滑动轮盘的运动轨迹并不规则，由一部分线性运动和一部分弯曲轨迹组成，因此简单的使用某一个几何图形公式无法完成这样的运动轨迹。滑动轮盘的运动轨迹公式由两部分组成：

公式一：

当子视图在控件的中间部分运动时，这时使用线性公式计算子视图的运动轨迹。

数学公式是：

y＝d×x；（x为主视图滑动偏移量，y为子视图三维坐标系平移量，d为两者关系的放大量值）

公式二：

当子视图到达轨迹变换的临界点时，使用新的公式计算子视图的位移轨迹。

此运动轨迹多种多样，需要根据所需效果的实际情况来决定使用的计算公式，轨迹可以是普通的弧形，圆形，椭圆形，或更复杂的贝赛尔曲线（Bézier curve），因此此运动轨迹没有一个固定的计算公式。

若曲线为普通椭圆形，公式通常为：

$\frac{x^2}{a^2}+\frac{y^2}{b^2}=1;$

（假设椭圆坐标原点为x＝0，y＝0）

这部分的变量包括：

线性运动和弯曲轨迹运动两部分的临界点，这部分需根据控件大小和轨迹的弯曲度数计算，若轨迹为贝赛尔曲线，贝赛尔曲线在临界点位置的切线要和线性运动轨迹平行，临界点的位置取值在控件左右边界点和曲线环绕中点之间。

中间线性运动部分的长度，这部分长度没有一个固定值，需要根据临界点的位置和控件总长度计算，大小为临界点和中点之间距离的两倍。

通过滑动辅助参数计算出一个辅助因子，用来影响最终滑动效果。

●滑动辅助参数

●透视投影幅度：

正投影方式生成的图形具有深度但没有立体感，而透视投影产生的图像立体感很强，因此此幅度的大小直接影响图形的立体感，此值一般为视口的长宽比，因为人眼看到的视野范围一般为长方形，因此此值在－1到1之间取值。

减速速率（模拟物体减速运动效果）。

减速速率影响轮盘减速的灵敏程度，由于此速率起到逐渐降低速度的作用，通常此值的范围在0.5～1.0之间。

位移速度。

位移速度同加速度一样影响轮盘滑动的直观感觉，根据主视图偏移量在不同设备上的大小可能不同，此值在0.1到2.0之间取值。

位移速度倍增值。

此倍增值是对位移速度和主视图偏移量变化效果的一个强化值，小于1用于降低偏移效果，大于1用于加强偏移效果，通常在0.5和2.0之间取值。

反弹最大比率。

控件在滑动到边界时，会根据超出边界的偏移量和反弹最大值之间的差值来强化减速效果，最终偏移量在等于此最大幅度时，控件将停止滑动。此值一般在0到1之间取值，表示可滑出边界的偏移量占图形大小的比例。

控件初始化与运转流程：

（1）轮盘创建完毕，通过数据模块向数据输入接口请求数据，同时主容器视图创建完毕。

（2）根据数据模块取到的数据，主容器根据数据模型生成子视图对象，同时根据子视图对应的索引值在三维坐标系上放置子视图。

（3）子视图将被放置到数学几何模型所设定的轨迹上。

（4）当滑动事件发生时，主视图的滑动偏移量发生变化，滑动控件根据此变量重新计算每一个子视图在三维坐标系中的位置。并刷新界面，从而实现滑动效果。

用户操作过程详解

用户对轮盘可进行的操作如下：

点击子视图操作，控件处理步骤如下：

用户点击轮盘视图，轮盘视图捕捉到用户事件，轮盘控件将事件封装为一个带点击位置信息的对象，并传递算法控制器模块。

点击事件发生时传递的参数包括：

（x，y）点击发生位置

点击时间长短

算法控制器在收到此对象后，监测具体是哪一个对象被点中。

算法控制器将被点中的对象传递到输出接口。

左右轮拨时引发的子视图滑动操作。

用户滑动主视图，主视图将捕捉到的信息传递到算法控制器。

捕捉到的信息包括：

●滑动起始位置

●滑动结束位置

算法控制器通过计算起始位置和结束位置之间的差值来确定用户滑动强度，根据差值的正负来判断滑动方向。

算法控制器将差值代入数学模型计算。

算法控制器通过计算结果控制滑动效果。

长按子视图时引发的拖拽操作，控件处理步骤如下：

用户点击轮盘视图，轮盘视图捕捉到用户事件，轮盘控件将事件封装为一个带点击位置信息的对象，并传递算法控制器模块。

点击事件发生时传递的参数包括：

●（x，y）点击发生位置

●点击时间长短

算法控制器在收到此对象后，监测具体是哪一个对象被点中。

算法控制器监控时间长短，达到临界点后传递长按事件到输出接口。

以在IOS上实现的轮盘滑动控件为例，讲解本控件的具体实施方式：

●IOS版轮盘控件使用苹果的CoreAnimation framework工具实现，CoreAnimation是苹果提供给广大开发者的二维和三维图形绘制工具，具有使用简单运行速度高效的特点。

●轮盘控件视图——功能是创建和管理程序运行过程中产生的子视图，为数据模块和控制器模块提供数据输入输出的接口。

●轮盘控件数据模块——功能是操控轮盘输入模块，从轮盘输入模块取得需要的参数并保存程序运行过程中产生的中间变量。

●轮盘控件控制器模块——功能是将根据数学模型建立出的计算公式运用到轮盘子视图的位置计算当中，并且根据滑动辅助参数计算出来因子调整子视图的位移效果。

●轮盘输出模块——功能是将轮盘控件中需要监控的事件，通过此模块传递到外部。

●轮盘输入模块——功能是从外部读取需要的参数，读取用于展现的数据。

1.轮盘控件视图（RotaryScrollView）

需要以下变量：

●perspective（透视）

●decelerationRate（减速率）

●scrollOffset（当前轮盘主视图的滑动偏移量）

●offsetMultiplier（轮盘位移的放大倍数）

●scrollSpeed（轮盘位移速度）

●bounceDistance（反弹距离占子视图大小）

●contentView（主视图）

除了这些变量以外，还需要实现下面几个方法用于采集主视图上的各种事件：

●viewDidPan：

本发明使用UIkit的UIPanGestureRecognizer来识别用户的手势操作，滑动手势发生时，可以在此处取得手势的位移参数，并将此位移参数转换到主视图之上，最后得到的偏移量就是主视图的滑动偏移量x。我们需要获得的是此次偏移量同上一次偏移量的差值，因此还需要将此偏移量同之前记录的偏移量做一个减法差值。最后得到的差值dx有两个作用：

1、dx×scrollSpeed得到的是轮盘的加速度，由于手机的屏幕有限，因此dx的值不会太大，加速度也就被有效的限制在一定范围内。

2、dx×offsetMultiplier得到的是此次滑动目标位移位置，同上，由于屏幕的限制，位移不会太大。

除此之外，由于轮盘存在左右边界，因此需要在轮盘滑动到边界上时，给轮盘一个减速缓冲区。这个值的计算公式是：

fmin（fabs（scrollOffset－MAX），bounceDistance）/bounceDistance；

从公式可以看出，如果位移超出限制，计算结果会越来越趋向于bounceDistance这个值。

●animationSteps：

动画需要时间和插值来完成，在动画播放的时间内，程序会连续调用此函数来完成动画插值运算工作。

2.数据模块（RotaryScrollViewDataProvider）

数据模块由子视图数组，和dataSource引用组成：

●visibleViews所有可见的子视图都保存在这个数组中。

●dataSource此变量是对RotaryScrollViewDataSource模块的引用。

3.轮盘控件控制器模块（RotaryScrollViewLayoutStrategy）

此模块根据数学模型计算子视图的位置：

下面是处理临界点部分的伪代码：

变量：

arc＝弧度大小;

spacing＝子视图之间的空格;

limitOffset＝临界点位置;

offset＝当前子视图的偏移量;

subView＝当前子视图;

如果offset小于最大边界值且offset大于临界点

执行

  radius＝fmax（0.01f，subView宽度*spacing/ftan（arc））;

  angle＝（offset-2）*arc;

沿z轴平移-radius距离

绕y轴旋转angle角度

沿x轴平移radius距离

  如不成立判断offset大于最大边界值

    子视图沿x轴加速移出屏幕

  如还不成立执行

沿x轴的平移变换offset×subView宽度×spacing

4.轮盘输出模块（RotaryScrollViewDelegate）

轮盘需要输出的内容包括两个部分

●轮盘在运行过程中的偏移量

●轮盘点击事件

5.轮盘输入模块（RotaryScrollViewDataSource）

轮盘需要输入的内容包括：

●子视图所需的数据

●子视图条数

●子视图的宽高

控件在临界点滑动时的特殊处理方法使轮盘可以沿曲线滑动：

轮盘滑动过程中使用分段函数的方式来完成不规则的轨迹，其中包括：

●在文档所描述的临界点之间的中间区域使用线性方式移动。

●在文档所描述的临界点和边界点之间的区域使用曲线方式移动，涉及的曲线包括：

■圆形曲线

■椭圆曲线

■贝赛尔曲线（Bézier curve）

控件滑动过程中用来控制最终效果的辅助因子：

轮盘在滑动过程中使用辅助因子来加强滑动的效果，其中包括：

●通过bounceDistance来缓冲越界的滑动操作。

●通过减速速率来控制滑动灵敏度。

●通过减速速率来使轮盘更快滚动到目标位置。

使用此发明技术实现的滑动轮盘具备以下特点：

（1）滑动触感流畅。

（2）滑动图像使用真正的三维算法生成，因此轮盘的拟物效果很好。

采用了上述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统及其方法，由于其中取二维和三维技术的优点，并基于三维图形显示技术，在实现过程中充分简化图形变换的数学模型，并建立内存回收机制，将不用的超出屏幕可见范围的视图元素从内存中移除，同时将可复用的数据保存到设备的存储介质上，以便下一次可以在界面上快速呈现出这些信息，此实现方式适用于所有具备三维图形显示能力的计算机设备，使得利用计算机图形学技术理论，结合相应的精准算法，实现与用户产生丰富流畅互动的图形界面，从而给用户带来舒适的感官享受，节约系统资源、工作性能稳定可靠、适用范围较为广泛。

在此说明书中，本发明已参照其特定的实施例作了描述。但是，很显然仍可以作出各种修改和变换而不背离本发明的精神和范围。因此，说明书和附图应被认为是说明性的而非限制性的。

Claims (24)

1.一种计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的系统包括：

输入接口模块，用于接收输入数据信息和参数信息；

输出接口模块，用于将轮盘控件所捕捉到的事件或流程中的某一个事件传递到外部；

数据模块，用于接收从输入接口模块传入的各种参数信息，并记录系统运行过程中所产生的中间参数；

算法控制器模块，用于接收数据模块的参数信息，并实时计算滑动轮盘的运动轨迹信息；

视图模块，用于接收数据模块输出的数据信息和算法控制器模块输出的运动轨迹信息，进行视图的位置排布控制，设置相应的坐标系系统定义，并提供计算所需要使用的变量信息。

2.根据权利要求1所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的输入接口模块包括：

数据信息输入接口单元；

图形显示额外指令信息输入接口单元，用于对变换后的视图做额外的几何变换处理，并设置变换后视图的视图参数。

3.根据权利要求2所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的数据信息输入接口单元包括：

数据条数输入接口子单元，用于输入数据条数信息；

具体数据对象输入接口子单元，用于输入具体的数据对象信息。

4.根据权利要求1所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的算法控制器模块包括：

视图轨迹线性移动处理单元，用于视图在两端的轨迹变换临界点之间的中间区域移动时进行视图轨迹线性移动计算处理；

视图轨迹曲线移动处理单元，用于视图在边界点和对应的轨迹变换临界点之间的区域移动时进行视图轨迹曲线移动计算处理。

5.根据权利要求4所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的曲线为圆形曲线、椭圆曲线或者贝赛尔曲线。

6.根据权利要求1所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的视图模块包括：

主容器视图单元；

子视图单元，由所述的视图模块根据从所述的输入接口模块收到的数据条数信息生成，并被添加至所述的主容器视图单元的视图堆栈中显示出来，子视图单元和主容器视图单元之间通过相对坐标系进行定位。

7.根据权利要求1所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的坐标系系统定义包括：

主容器视图滑动位移坐标系；

子视图坐标系。

8.根据权利要求7所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的主视图滑动位移坐标系为二维坐标系。

9.根据权利要求7所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的子视图坐标系为三维坐标系，且该三维坐标系为开启OpenGL透视模式的右手坐标系统，该三维坐标系的中点与主容器视图的中点对齐，并设置主容器视图的左边界为负值，右边界为正值。

10.根据权利要求7所述的计算机图形界面中实现具备舒适人机交互体验的滑动轮盘控件功能的系统，其特征在于，所述的变量信息包括：

●主容器视图的滑动偏移量；

●子视图相较于三维坐标系中点的偏移量；

●透视幅度；

●减速速率；

●位移速度；

●位移速度倍增值；

●反弹最大比率。

11.一种基于权利要求1所述的系统实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的方法包括以下步骤：

（1）系统进行初始化处理，并初始化数据信息；

（2）系统创建主容器视图；

（3）系统根据所述的数据模块取到的数据进行子视图生成和排列操作；

（4）系统根据辅助参数实现轮盘控件的滑动效果；

（5）系统实时检测用户对轮盘控件的操作；

（6）如果用户对轮盘控件的操作为点击子视图，则进行点击视图操作处理；

（7）如果用户对轮盘控件的操作为拨动轮盘，则进行子视图滑动处理操作；

（8）如果用户对轮盘控件的操作为子视图拖拽进行子视图拖拽处理操作。

12.根据权利要求11所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的进行子视图生成和排列操作，包括以下步骤：

（31）所述的主容器视图根据所述的数据模块取到的数据生成相应的子视图对象；

（32）根据子视图对象所对应的索引值在三维坐标系中放置相应的子视图。

13.根据权利要求11所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的系统根据辅助参数实现轮盘控件的滑动效果，包括以下步骤：

（41）当滑动事件发生时，系统检测到所述的主容器视图的滑动偏移量发生变化；

（42）所述的轮盘控件根据此滑动偏移量所发生的变化，重新计算每一个子视图在三维坐标系中的位置；

（43）系统刷新界面显示。

14.根据权利要求11所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的实时检测用户对轮盘控件的操作，包括以下步骤：

（51）系统捕捉到用户操作的事件；

（52）所述的轮盘控件将用户操作的事件封装为一个带点击位置信息的对象；

（53）所述的轮盘控件将该对象传递至所述的算法控制器模块。

15.根据权利要求14所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的进行点击视图操作处理，包括以下步骤：

（61）所述的轮盘控件将用户操作的点击事件发生时的参数传递至所述的算法控制器模块；

（62）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被点中；

（63）所述的算法控制器模块将被点中的对象信息传递到所述的输出接口模块。

16.根据权利要求15所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的点击事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息。

17.根据权利要求14所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的进行子视图滑动处理操作，包括以下步骤：

（71）所述的轮盘控件将用户操作的子视图滑动事件发生时的参数传递至所述的算法控制器模块；

（72）所述的算法控制器模块通过计算所接收到的参数来确定用户滑动强度，并判断滑动方向；

（73）所述的算法控制器模块将所述的参数代入滑动数学模型进行计算处理；

（74）所述的算法控制器模块通过相应的计算结果控制滑动效果。

18.根据权利要求17所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的子视图滑动事件发生时的参数包括滑动起始位置信息和滑动结束位置信息。

19.根据权利要求18所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的确定用户滑动强度并判断滑动方向，具体为：

通过计算所述的滑动起始位置信息和滑动结束位置信息之间的差值来确定用户滑动强度，并根据该差值的正负来判断滑动方向。

20.根据权利要求18所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的将参数代入滑动数学模型进行计算处理，包括以下步骤：

（731）当子视图在两端的轨迹变换临界点之间的中间区域移动时，根据线性滑动数学模型进行子视图轨迹线性移动计算处理；

（732）当子视图在边界点和对应的轨迹变换临界点之间的区域移动时，根据曲线滑动数学模型进行子视图轨迹曲线移动计算处理。

21.根据权利要求20所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的线性滑动数学模型为以下公式：

y＝d×x；

其中，x为主容器视图的滑动偏移量，y为子视图三维坐标系平移量，d为x和y之间的关系的放大量值。

22.根据权利要求20所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的曲线滑动数学模型为弧形方程、圆形方程、椭圆形方程或者贝赛尔曲线方程。

23.根据权利要求14所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的进行子视图拖拽处理操作，包括以下步骤：

（81）所述的轮盘控件将用户操作的子视图拖拽事件发生时的参数传递至所述的算法控制器模块；

（82）所述的算法控制器模块在接收到所述的参数后检测判断具体是哪一个对象被拖拽；

（83）所述的算法控制器模块监控被拖拽对象的点击时间长短，当超过系统预设的超时时间，则将被拖拽的对象信息传递到所述的输出接口模块。

24.根据权利要求23所述的实现计算机图形界面中具备舒适人机交互体验的滑动轮盘控件功能的方法，其特征在于，所述的子视图拖拽事件发生时的参数包括点击发生位置坐标信息和点击时间长短信息。

Images