一种实现3D UI中圆角图标焦点套合方法及系统技术方案

本发明专利技术公开一种实现3D UI中圆角图标焦点套合方法及系统，所述方法包括步骤：A、预先建立圆角矩形焦点模型，以模型中心为原点建立平面直角坐标系，将位于平面直角坐标系各象限的模型区域分别对应映射预设的1/4的焦点图片形成1/4的焦点图；B、将所映射的1/4的焦点图在保持圆角不变的情况下分别套合至需要获得焦点的圆角图标的对应位置上，并对所映射的1/4的焦点图之间的区域进行插值实现圆角图标焦点套合效果。本发明专利技术实现圆角图标焦点套合系统基于纹理映射的实现方案，能够实现精准套合不同宽高比的圆角矩形，同时可以动态控制焦点边框宽度以及显示范围。解决了由于3D UI中图标进行任意比例的拉伸时，焦点不能与其匹配套合的问题。

【技术实现步骤摘要】

本专利技术涉及计算机软件
，尤其涉及一种实现3DUI中圆角图标焦点套合方法及系统。
技术介绍
在3DUI中有时需要显示不同宽高比的圆角矩形图标（例如图标由于被拉伸，宽高比可能是1：1也可能是2：1或3：1等等），如图1和图2均为圆角矩形图标，其中图1的宽高比为3：1，图2的宽高比为1：1。圆角矩形图标包括图标和套合在图标上的边框，其边框称为焦点（更直观地，如图3所示的方格边框为焦点），焦点通常包括矩形部分和圆角部分。若对图标进行拉伸，焦点也需进行拉伸以与图标套合，但是对焦点进行拉伸的结果往往是矩形部分仍能套合在图标上，而圆角部分却很可能发生扭曲而无法套合在图标上，从整体而言，也即焦点无法套合在图标上。因此，在3DUI中应用圆角矩形图标时，焦点如何恰如其分的套合在图标上，是一个面临的问题。在基于Android系统的2DUI处理中，若需要对图标进行拉伸，可以通过点9的图(andriod平台的应用软件开发里的一种特殊的图片形式，文件扩展名为：.9.png)进行拉伸，以保证焦点的矩形部分和圆角部分均与图标的拉伸保持一致性，而3DUI中图标都是通过图片转换为纹理，纹理再渲染到屏幕上实现的，故不能采用点9的2D方案实现。现有技术解决3DUI中图标拉伸时焦点的套合问题通常是：预先制作许多不同宽高比的焦点来根据图标的宽高比进行匹配套合。这样当图标进行拉伸时，虽然其宽高比也会发现变化，但可以根据变化后的宽高比选择合适的焦点进行匹配套合。但这种方案仍然存在较大缺点：首先是需要预先制作大量的焦点；其次是制作了大量的焦点还不一定能满足图标以任意比例拉伸的需求，也即不能保证图标以任意比例进行拉伸时一定能找到与其匹配的焦点；因此这种方案同样存在焦点与图标无法匹配套合的问题。因此，现有技术还有待于改进和发展。
技术实现思路
鉴于上述现有技术的不足，本专利技术的目的在于提供一种实现3DUI中圆角图标焦点套合方法及系统，旨在解决目前3DUI中图标进行任意比例的拉伸时，焦点不能与其匹配套合的问题。本专利技术的技术方案如下：一种实现3DUI中圆角图标焦点套合方法，其中，所述方法包括以下步骤：A、预先建立圆角矩形焦点模型，以模型中心为原点，以模型圆角对应分布于各象限区域中为原则建立平面直角坐标系，将位于平面直角坐标系各象限的模型区域分别对应映射预设的1/4的焦点图片形成1/4的焦点图；B、将所映射的1/4的焦点图在保持圆角不变的情况下分别套合至需要获得焦点的圆角图标的对应位置上，并对所映射的1/4的焦点图之间的区域进行插值，实现3DUI中圆角图标焦点套合效果。所述的实现3DUI中圆角图标焦点套合方法，其中，所述圆角矩形焦点模型是以平面直角坐标系的x轴和y轴作为对称轴的轴对称图形。所述的实现3DUI中圆角图标焦点套合方法，其中，所述步骤B具体为：B1、接收用户图标选择指令，计算需要获得焦点的圆角图标的渲染区域尺寸；B2、根据所计算出的圆角图标的渲染区域尺寸设置1/4的焦点图对应的纹理的放缩比例；B3、设置焦点图对应的纹理的坐标映射方式为纹理图像边缘拉伸填充的纹理环绕模式，对所映射的1/4的焦点图对应的纹理之间的区域进行插值；B4、按照预设比例调整并计算整个焦点图片显示的范围，并计算整个焦点图对应的纹理坐标的偏移量；B5、利用所计算出的偏移量及放缩比例更新整个焦点图的纹理矩阵，并利用新的纹理矩阵进行渲染，显示3DUI中圆角图标焦点套合效果。所述的3DUI中实现圆角图标焦点套合方法，其中，所述计算需要获得焦点的圆角图标的渲染区域尺寸具体为：利用圆角图标的父节点坐标系以及自身保存的相对坐标系通过累乘计算得出圆角图标在屏幕渲染区域的尺寸。所述的3DUI中实现圆角图标焦点套合方法，其中，所述纹理图像边缘拉伸填充的纹理环绕模式保证焦点图对应的纹理坐标范围在（0，0）到（1，1）的闭区间内。所述的3DUI中实现圆角图标焦点套合方法，其中，利用所计算出的偏移量及放缩比例更新焦点图的纹理矩阵具体为：利用所计算出的偏移量及放缩比例重新重合一个新的纹理矩阵。所述的3DUI中实现圆角图标焦点套合方法，其中，采用以下公式计算焦点图对应的纹理坐标的偏移量：TranslateX=（1/Size.X-1）*（Size.X）*0.5TranslateY=（1/Size.Y-1）*（Size.Y）*0.5，其中，所述TranslateX指X轴偏移量，所述TranslateY指Y轴偏移量，Size.X指焦点图对应纹理在X轴方向上的放缩比例，Size.Y指焦点图对应纹理在X轴方向上的放缩比例。所述的3DUI中实现圆角图标焦点套合方法，其中，所述利用新的纹理矩阵进行渲染，显示3DUI中圆角图标焦点套合效果具体为：利用新的纹理矩阵对纹理进行采样，并利用采样得到的数据渲染到屏幕上，实现3DUI中圆角图标焦点套合效果。一种实现3DUI中圆角图标焦点套合系统，其中，所述系统包括：模型建立及映射模块、用于预先建立圆角矩形焦点模型，以模型中心为原点，以模型圆角对应分布于各象限区域中为原则建立平面直角坐标系，将位于平面直角坐标系各象限的模型区域分别对应映射预设的1/4的焦点图片形成1/4的焦点图；计算模块、用于将所映射的1/4的焦点图在保持圆角不变的情况下分别套合至需要获得焦点的圆角图标的对应位置上，并对所映射的1/4的焦点图之间的区域进行插值；渲染模块，用于根据所述计算模块计算数据实现3DUI中圆角图标焦点套合效果。有益效果：本专利技术提供一种实现3DUI中圆角图标焦点套合方法及系统，该系统基于纹理映射的实现方案，能够实现精准套合不同宽高比的圆角矩形，同时可以动态控制焦点边框宽度以及显示范围。解决了由于3DUI中图标进行任意比例的拉伸时，焦点不能与其匹配套合的问题。附图说明图1为现有的宽高比为3:1的的圆角矩形图标。图2为现有的宽高比为1:1的圆角矩形图标。图3为常见的圆角矩形图标中焦点套合在图标上的效果示意图（方格框为焦点框）。图4为本专利技术具体实施例中实现3DUI中圆角图标焦点套合方法流程图。图5为图4中步骤S100所建立的的圆角矩形焦点模型图。图6为图5的圆角矩形焦点模型映射的1/4焦点图片形成的焦点图。图7为由图6所示的圆角矩形焦点模型映射的1/4焦点图片拼接成的完整焦点图。图8为3DUI中X方向产生拉伸的圆角矩形图标。图9为3DUI中Y方向产生拉伸的圆角矩形图标。图10为在圆角矩形焦点的圆角不变的情况下，插值像素值实现焦点套合拉伸的圆角矩形图标的示意图。图11为具体实施例中圆角图标上的焦点宽边框的示意图。图12为具体实施例中图11中的圆角图标上的焦点窄边框的示意图。图13为图4步骤S200的具体方法流程图。图14为本专利技术具体实施例中实现3DUI中圆角图标焦点套合系统本文档来自技高网...

【技术保护点】
一种实现3D UI中圆角图标焦点套合方法，其特征在于，所述方法包括以下步骤：A、预先建立圆角矩形焦点模型，以模型中心为原点，以模型圆角对应分布于各象限区域中为原则建立平面直角坐标系，将位于平面直角坐标系各象限的模型区域分别对应映射预设的1/4的焦点图片形成1/4的焦点图；B、将所映射的1/4的焦点图在保持圆角不变的情况下分别套合至需要获得焦点的圆角图标的对应位置上，并对所映射的1/4的焦点图之间的区域进行插值，实现3D UI中圆角图标焦点套合效果。

【技术特征摘要】
1.一种实现3DUI中圆角图标焦点套合方法，其特征在于，所述方法包括以下步骤：
A、预先建立圆角矩形焦点模型，以模型中心为原点，以模型圆角对应分布于各象限区域中为原则建立平面直角坐标系，将位于平面直角坐标系各象限的模型区域分别对应映射预设的1/4的焦点图片形成1/4的焦点图；
B、将所映射的1/4的焦点图在保持圆角不变的情况下分别套合至需要获得焦点的圆角图标的对应位置上，并对所映射的1/4的焦点图之间的区域进行插值，实现3DUI中圆角图标焦点套合效果。
2.根据权利要求1所述的实现3DUI中圆角图标焦点套合方法，其特征在于，所述圆角矩形焦点模型是以平面直角坐标系的x轴和y轴作为对称轴的轴对称图形。
3.根据权利要求1所述的实现3DUI中圆角图标焦点套合方法，其特征在于，所述步骤B具体为：
B1、接收用户图标选择指令，计算需要获得焦点的圆角图标的渲染区域尺寸；
B2、根据所计算出的圆角图标的渲染区域尺寸设置1/4的焦点图对应的纹理的放缩比例；
B3、设置焦点图坐标映射方式为纹理图像边缘拉伸填充的纹理环绕模式，对所映射的1/4的焦点图对应的纹理之间的区域进行插值；
B4、按照预设比例调整并计算整个焦点图片显示的范围，并计算焦点图对应的纹理坐标的偏移量；
B5、利用所计算出的偏移量及放缩比例更新整个焦点图的纹理矩阵，并利用新的纹理矩阵进行渲染，显示3DUI中圆角图标焦点套合效果。
4.根据权利要求3所述的实现3DUI中圆角图标焦点套合方法，其特征在于，所述计算需要获得焦点的圆角图标的渲染区域尺寸具体为：
利用圆角图标的父节点坐标系以及自身保存的相对坐标系通过累乘计算得出圆角图标在屏幕渲染区域的尺寸。
5.根据权利要求3所述的实现3DUI中圆角图标焦点套合方法，其特征在于，所述纹理图像边缘拉...

【专利技术属性】
技术研发人员：赵智宝，卢伟超，
申请(专利权)人：TCL集团股份有限公司，
类型：发明
国别省市：广东;44