界面中控件的显示方法及装置制造方法及图纸

本发明专利技术公开了一种界面中控件的显示方法及装置。其中，该方法包括：获取界面中的控件，其中控件在界面中的布局以树状结构关联；根据树状结构确定控件在界面中的布局，并依据布局显示控件。本发明专利技术解决了相关技术中界面与屏幕分辨率实现较好适配时工作量较大、工作效率较低的技术问题。

【技术实现步骤摘要】

本专利技术涉及计算机领域，具体而言，涉及一种界面中控件的显示方法及装置。
技术介绍
在进行多媒体展示时，经常会出现待展示的界面和用户设备的屏幕不匹配的问题。下面以移动游戏为例进行说明。在移动游戏中，不同的游戏玩家通过各种不同的移动设备进行游戏，不同的移动设备的尺寸、分辨率不尽相同。在展示游戏界面时，正确、自然地向持有不同设备的玩家展示游戏的内容对于提升用户体验十分重要。例如，游戏中的一个面板尺寸是800px*600px(即4：3的比例)，这在800px*600px的手机上可以刚好铺满全屏。但是，如果要显示在一个2048px*1536px(即3：2的比例)的设备上，则至少会出现以下的问题：(1)覆盖屏幕面积大小不匹配的问题。如果以游戏的原面板大小进行显示，会出现游戏内容只显示在某小块区域的问题。该问题一般可通过游戏面板的缩放来解决。但是，如果采用缩放的方法来适配屏幕面积，通常又会存在以下的问题：如果将长和宽等比缩放，顶到屏幕边缘，可以保证界面显示在屏幕内，但该方法可能导致屏幕上留有黑边；如果将长和宽等比缩放，顶到屏幕边缘，可以保证界面覆盖整个屏幕，该方法不会使屏幕留有黑边，但游戏的部分界面会被裁切；如果将长和宽不等比缩放，分别顶到屏幕边缘，可以保证界面覆盖整个屏幕。该方法不会导致屏幕留有黑边，并且游戏界面也不会被裁切，但由于缩放不等比，会造成游戏界面中的图像变形。(2)界面内部的坐标定位问题。如果采用缩放的方式来适配面积，那么界面内部的控件位置需要重新调整排列，通常为了美观，需要对各控件的定位方式进行定制。(3)图片尺寸问题。如果游戏界面同时要适配小尺寸(比如320*240)和大尺寸(比如2048*1536)，那么采用图片的尺寸就需要考虑。如果使用适用于320*240的图片大小，那么在2048*1536的屏幕中显示时就会很模糊；反之，如果使用适用于2048*1536的图片大小，那么在320*240的屏幕中显示时，就会出现采样不连续导致的锯齿形状。为解决上述问题，相关技术中提出了两种解决方案，一种是基于绝对坐标的定位、缩放适配的方式，另外一种是对不同屏幕使用多套界面配置适配的方式。方式一、基于绝对坐标的定位、缩放适配的方式该方法规定了一种设计分辨率(w,h)，编辑时控件位置的坐标是相对左上角或左下角的绝对坐标，每个控件的长宽也是像素的绝对大小。在将(w,h)适用到屏幕分辨率(W,H)时，先将界面居中，再采用两种缩放大小min(W/w,H/h)或max(W/w,H/h)来进行适配。在按缩放大小min(W/w,H/h)进行适配时，将宽度为w、高度为h的矩形控件缩放到比例为max(W/w,H/h)，使得至少有两条边贴到宽度为W、高度为H的屏幕边缘，同时保证该控件面积完全位于屏幕内(如图1、图2所示)。在按缩放大小max(W/w,H/h)进行适配时，将宽度为w、高度为h的矩形控件缩放到比例为max(W/w,H/h)，使得至少有两条边贴到宽度为W、高度为H的屏幕边缘，同时保证屏幕面积完全位于该控件之内(如图3、图4所示)。该方法通过比较简单的方式将传统的绝对坐标定位的界面通过缩放适配到各种不同大小的屏幕中。但是，该方法存在以下的问题：(1)由于设计分辨率与实际屏幕分辨率的长宽比并不一致，但长宽缩放比又必须保持等比缩放，因此会导致屏幕留有黑边，进而降低了屏幕空间的利用率；或者会出现部分界面超出屏幕而被裁切的现象。(2)该方法在界面元素的坐标定位上也存在问题。比如，我们要把4个按钮分别固定在左下角、左上角、右下角、右上角，如果按该方法中所述的适配方式，如果设计分辨率与屏幕分辨率不一致，则无法将上述按钮固定在上述的位置。(3)由于设计分辨率与实际分辨率的大小差别可能很大，因此，该方法为设计分辨率所采用的界面图片的精度可能与实际分辨率所要求的图片精度差别太大。如果实际分辨率达到设计分辨率的数倍的话，那么在屏幕上显示的图像就会很模糊；如果设计分辨率达到实际分辨率的数倍的话，由于图片精度太高，则在屏幕上显示的图片就可能会跳过采样点而导致出现锯齿，同时图片也会占用过多的内存空间。方式二、对不同屏幕使用多套界面配置适配的方式在该方法中，对不同的屏幕大小采用不同的参数进行分类。比如，按长宽比的比率先分类一次，再按屏幕的像素大小再次分类。长宽比类似的屏幕，可以使用类似的界面配置；屏幕像素大小分类不同的屏幕，可以使用不同的图片。例如，有5种屏幕：(480,320)，(960,640)，(1024,768),(2048,1536)以及(1334,750)。按长宽比可以将屏幕分为3类，如表1所示：表1分类长宽比分辨率11.5(480,320)，(960,640)21.33(1024,768),(2048,1536)31.78(1334,750)按屏幕像素大小可以将屏幕分为3类，如表2所示：表2分类精度分辨率11(480,320)22(960,640),(1024,768),(1334,750)34(2048,1536)对于不同的分类，需要设计不同的界面配置或不同精度的图片。该方法对不同的分辨率能实现较好的适配，但这是建立在大量重复工作的基础之上的，效率极低。由于配置的总量是各种不同方式分类数量的乘积，因此，如果要适配更多分辨率的话，总量就会爆炸。另外，如果需要修改界面，设计人员的工作量将非常大。针对上述的问题，目前尚未提出有效的解决方案。
技术实现思路
本专利技术实施例提供了一种界面中控件的显示方法及装置，以至少解决相关技术中界面与屏幕分辨率实现较好适配时工作量较大、工作效率较低的技术问题。根据本专利技术实施例的一个方面，提供了一种界面中控件的显示方法，包括：获取界面中的控件，其中控件在界面中的布局以树状结构关联；根据树状结构确定控件在界面中的布局，并依据布局显示控件。进一步地，控件在界面中的布局以树状结构关联包括：多个控件在界面中的布局存在父子关系，其中，子控件的布局根据子控件所属的父控件确定。进一步地，根据树状结构确定控件在界面中的布局包括：获取子控件的表示方式；根据表示方式在子控件所属的父控件中确定子控件的布局。进一步地，表示方式包括以下参数至少之一：坐标，用于指示子控件中一指定点相对于父控件的坐标；尺寸，用于指示子控本文档来自技高网...

【技术保护点】
一种界面中控件的显示方法，其特征在于，包括：获取界面中的控件，其中所述控件在所述界面中的布局以树状结构关联；根据所述树状结构确定所述控件在所述界面中的布局，并依据所述布局显示所述控件。

【技术特征摘要】
1.一种界面中控件的显示方法，其特征在于，包括：
获取界面中的控件，其中所述控件在所述界面中的布局以树状结构关联；
根据所述树状结构确定所述控件在所述界面中的布局，并依据所述布局显示所述控
件。
2.根据权利要求1所述的方法，其特征在于，所述控件在所述界面中的布局以树状结构
关联包括：
多个所述控件在所述界面中的布局存在父子关系，其中，子控件的布局根据所述子控
件所属的父控件确定。
3.根据权利要求2所述的方法，其特征在于，根据所述树状结构确定所述控件在所述界
面中的布局包括：
获取所述子控件的表示方式；
根据所述表示方式在所述子控件所属的父控件中确定所述子控件的布局。
4.根据权利要求3所述的方法，其特征在于，所述表示方式包括以下参数至少之一：
坐标，用于指示所述子控件中一指定点相对于所述父控件的坐标；
尺寸，用于指示所述子控件的形状及大小；
缩放比例，用于指示所述子控件对应的图片资源在显示时的缩放比例；
锚点，用于指示所述子控件在发生变化时的不动点的坐标。
5.根据权利要求4所述的方法，其特征在于，所述坐标通过以下方式之一表示：
通过数字表示坐标；
通过相对于所述父控件相应尺寸的比例值表示坐标；
通过数字与资源比例的乘积表示坐标，其中，所述资源比例为屏幕分辨率与设计分辨
率的精度比例；
通过所述父控件相应尺寸与上述表示方式表示出的坐标的差值来表示坐标。
6.根据权利要求4所述的方法，其特征在于，所述尺寸通过以下方式之一表示：
通过数字表示尺寸；
通过相对于所述父控件相应尺寸的比例值表示尺寸；
...

【专利技术属性】
技术研发人员：钟浩涛，
申请(专利权)人：网易杭州网络有限公司，
类型：发明
国别省市：浙江;33