本公开总体涉及计算机图形
技术领域：
，具体涉及一种对界面控件进行适配的方法及装置。
背景技术：
：随着硬件技术发展以及市场需求的不断变化，一款游戏通常需要在研发出一种显示模式后(该显示模式会定义每个操作控件的大小、位置等影响核心操作体验的关键信息)，需要在配备不同分辨率、不同屏幕长宽比、不同屏幕尺寸的设备上也能够拥有良好的用户体验。如果针对不同的设备分别进行调试和适应，开发成本过高是个不得不面临的问题。对于解决不同设备兼容性的问题，惯常做法是做适配。现有技术采取的适配方式通常分两种，一是同比例屏幕适配，控件等比放大缩小，相对屏幕边缘距离保持固定；二是不同比例屏幕适配，不同位置控件选择屏幕的某一条边线作为相对基准线，并就基准线作为基本参照物来确定控件的相对位置，从而实现适配的目标。上述解决方案能够快速而粗略地解决适配问题，这其中最大的弊端是在细节体验上无法保证品质，一切是基于牺牲一定用户体验为基础的。以《梦幻西游》手游为例，如图1所示，应对不同设备进行适配，通常做法是分背景图和核心操作控件进行分类适配。对于背景图，通常会出1136*640的高清背景图，然后选取其中的960*640部分进行重点绘制(也就是3：2)，设备加载应用时，游戏应用会读取手机硬件信息中的屏幕比例信息，从而对于比3：2比例略高的4：3比例，背景图直接在960*640的基础上扩大显示区域至960*720；对于比3：2比例略宽的16:9比例，背景图则在960*640的基础上水平扩大显示区域至1136*640。对于核心操作控件，依然是以960*640作为基准，960是基本宽度，设备实际水平分辨率除以基本宽度的值，即是控件缩放的比例。控件位置则是以距离控件最近的屏幕边界作为基准线，然后确保控件距离边线的距离是一个始终固定的值，从而实现适配效果。该方案是一种惯常的适配方法，存在以下问题：机械性地通过放大缩小控件不利于保证用户体验，对于基准设备而言，许多控件大小的设定、位置的摆放是综合考虑玩家使用习惯而得出的最优解，在基准设备上确实可以达到良好的用户体验，但是在更大的设备或者更小的设备上进行适配时，单纯放大/缩小操作控件，而进行操作的手指大小是不会变的，所以这会影响到用户体验。因此，针对界面控件的适配问题需要一种新的方法及装置。在所述
背景技术：
部分公开的上述信息仅用于加强对本公开的背景的理解，因此它可以包括不构成对本领域普通技术人员已知的现有技术的信息。技术实现要素：本公开提供一种对界面控件进行适配的方法及装置，针对不同设备确定适配方案，提高用户体验。本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本公开的实践而习得。根据本公开的第一方面，一种对界面控件进行适配的方法，包括：获取设备的屏幕分辨率和PPI值；选取与所述屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值；将画布按照所述设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放；按照所述设计PPI值与所述设备PPI值的比值，对控件进行缩放；选取一中间分辨率，所述中间分辨率的宽度与所述设计分辨率的宽度相同，所述中间分辨率的宽高比与所述设备分辨率的宽高比相同；将画布按照所述中间分辨率在纵向上进行缩放；将画布按照所述中间分辨率与所述设备分辨率的比值进行等比例缩放。根据本公开的一实施方式，所述选取与所述屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值包括：预设多个所述设计分辨率，计算所述屏幕分辨率的宽高比和每个所述设计分辨率的宽高比，计算所述屏幕分辨率的宽高比与每个所述设计分辨率的宽高比的比值，其中，计算所述比值时，选取所述屏幕分辨率的宽高比与所述设计分辨率的宽高比中数值较大的除以数值较小的，选取所述比值较小的作为选取的设计分辨率。根据本公开的一实施方式，所述控件包括自适应控件和可定义控件，所述可定义控件支持定义三种属性，包括缩放比例、位置类型和相对位置。根据本公开的一实施方式，所述将画布按照所述设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放包括：对所述自适应控件按照左上、左下、右上、右下和居中5种类型，分别对应左上参考点、左下参考点、右上参考点、右下参考点和中点的距离进行位置调整；对可定义控件按照设计配置表中定义的位置类型和相对位置进行位置调整。根据本公开的一实施方式，所述将画布按照所述中间分辨率在纵向上进行缩放包括：对所述自适应控件按照左上、左下、右上、右下和居中5种类型，分别对应左上参考点、左下参考点、右上参考点、右下参考点和中点的距离进行纵向调整；对可定义控件按照设计配置表中定义的位置类型和相对位置进行纵向调整。根据本公开的一实施方式，还包括：针对全屏画布，在画布最上端和最下端预先设计延伸底图，以预留画布纵向缩放时的裁剪需要。根据本公开的第二方面，一种对界面控件进行适配的装置，包括：获取设备信息模块，用于获取设备的屏幕分辨率和PPI值；选取设计方案模块，用于选取与所述屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值；设计分辨率缩放模块，用于将画布按照所述设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放；PPI缩放模块，用于按照所述设计PPI值与所述设备PPI值的比值，对控件进行缩放；中间分辨率缩放模块，用于选取一中间分辨率，所述中间分辨率的宽度与所述设计分辨率的宽度相同，所述中间分辨率的宽高比与所述设备分辨率的宽高比相同，将画布按照所述中间分辨率在纵向上进行缩放；设备分辨率缩放模块，用于将画布按照所述中间分辨率与所述设备分辨率的比值进行等比例缩放。根据本公开的一实施方式，所述选取设计方案模块还用于：预设多个所述设计分辨率，计算所述屏幕分辨率的宽高比和每个所述设计分辨率的宽高比，计算所述屏幕分辨率的宽高比与每个所述设计分辨率的宽高比的比值，其中，计算所述比值时，选取所述屏幕分辨率的宽高比与所述设计分辨率的宽高比中数值较大的除以数值较小的，选取所述比值较小的作为选取的设计分辨率。根据本公开的一实施方式，所述控件包括自适应控件和可定义控件，所述可定义控件支持定义三种属性，包括缩放比例、位置类型和相对位置。根据本公开的一实施方式，所述设计分辨率缩放模块还用于：对所述自适应控件按照左上、左下、右上、右下和居中5种类型，分别对应左上参考点、左下参考点、右上参考点、右下参考点和中点的距离进行位置调整；对可定义控件按照设计配置表中定义的位置类型和相对位置进行位置调整。根据本公开的一实施方式，所述中间分辨率缩放模块还用于：对所述自适应控件按照左上、左下、右上、右下和居中5种类型，分别对应左上参考点、左下参考点、右上参考点、右下参考点和中点的距离进行纵向调整；对可定义控件按照设计配置表中定义的位置类型和相对位置进行纵向调整。本发明的对界面控件进行适配的方法及装置通过读取设备硬件信息(屏幕分辨率/物理尺寸)的方式来确定适配方案，对于不同的设备更有针对性，能够提高用户体验的一致性。同时，有助于提升适配阶段的效率从而加快开发速度。应当理解的是，以上的一般描述和后文的细节描述仅是示例性的，并不能限制本公开。附图说明通过参照附图详细描述其示例实施例，本公开的上述和其它目标、特征及优点将变得更加显而易见。图1为现有技术中以梦幻西游手游为例的适配效果图。图2示出根据本公开示例实施方式的对界面控件进行适配的方法流程图。图3示出根据本公开示例实施方式的对界面控件进行适配的装置方框图。具体实施方式现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。此外，所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、步骤等。在其它情况下，不详细示出或描述公知结构、方法、实现或者操作以避免喧宾夺主而使得本公开的各方面变得模糊。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。本发明的对界面控件进行适配的方法及装置本着在适配过程中最大化保证用户体验为核心目标，在确定适配方案时参考硬件信息，一方面减少了适配的工作量，另一方面确保了游戏的操作体验，是一种较为合理而科学的适配解决方案。挑选市场上设备的主流宽高比对应的设备分辨率(Resolution)和屏幕物理尺寸大小，预定义多个设计分辨率。同时确定制作分辨率，制作分辨率是制作人员进行美术资源制作的分辨率。对于控件，可将其分为两类，分别为自适应控件(AutoResolutionWidget)和可定义控件(CustomWidget)。可定义控件可支持三种属性定义，分别为缩放比例(Scale)、控件位置类型(PosStyle)和控件相对位置(Postion)。在编辑器中支持制作人员针对可定义控件(CustomWidget)自定义参数类型，可将制作人员自定义类型自动转换为设计配置表。图2示出根据本公开示例实施方式的对界面控件进行适配的方法流程图。如图2所示，对界面控件进行适配的方法，包括步骤S202～S214：在步骤S202中，获取设备的屏幕分辨率和PPI值。针对要适配的设备，读取设备的硬件信息，获取两个核心参数：设备分辨率和屏幕物理尺寸大小，根据屏幕分辨率和屏幕尺寸计算出设备的PPI(PixelsPerInch，像素密度)值。在步骤S204中，选取与屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值。计算设备分辨率的宽高比，本实施方式中的宽高比指的是操作设备(例如移动端游戏)时的横屏模式下设备分辨率的宽高比。在预定义中的设计分辨率中选取与设备分辨率最接近的作为本方案中的设计分辨率，再根据确定的设计分辨率与设备的屏幕尺寸大小计算出设计PPI值。在步骤S206中，将画布按照设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放。可先将画布按照横向分辨率进行图像的等比例缩放，将图像由制作分辨率按照横向分辨率的缩放比等比缩放到设计分辨率。对于可定义控件(CustomWidget)可按照设计配置表中定义的比例进行再缩放。然后在纵向上进行缩放。在步骤S208中，按照设计PPI值与设备PPI值的比值，对控件进行缩放。读取或计算设备的PPI值，按照设计PPI值与设备PPI值的比值，对控件进行缩放。在步骤S210中，选取一中间分辨率，中间分辨率的宽度与设计分辨率的宽度相同，中间分辨率的宽高比与设备分辨率的宽高比相同。由于设计分辨率与设备分辨率不一定是宽高等比例缩放的，这里需要一个中间分辨率进行缩放。中间分辨率的宽度与设计分辨率相同，宽高比与设备分辨率相同。在步骤S212中，将画布按照中间分辨率在纵向上进行缩放。按照中间分辨率的高度，重新调整控件的高度信息。主要是按照左上、左下、右上、右下和居中类型对控件进行调整，此时可定义控件(CustomWidget)按照位置类型自动进行归类，不再考虑位置信息。在步骤S214中，将画布按照中间分辨率与设备分辨率的比值进行等比例缩放。将画布按照中间分辨率与设备分辨率的比值进行等比例缩放，图像缩放到与设备分辨率相适应，完成适配。本实施方式的对界面控件进行适配的方法通过读取设备硬件信息(屏幕分辨率/物理尺寸)的方式来确定适配方案，对于不同的设备更有针对性，能够提高用户体验的一致性。同时，有助于提升适配阶段的效率从而加快开发速度。针对上述实施方式的内容，下面举例进行说明。挑选市场上设备的主流宽高比对应的设备分辨率(Resolution)和屏幕物理尺寸大小，预定义多个设计分辨率，例如预定义两个设计分辨率960*640、1024*768，对应的屏幕尺寸为3.5英寸和9.7英寸，则计算设计PPI值为326和132，同时确定制作分辨率1136*640。在步骤S202中，获取设备的屏幕分辨率和PPI值。针对要适配的设备，读取设备的硬件信息，获取两个核心参数：设备分辨率(Resolution)和屏幕物理尺寸大小，根据屏幕分辨率和屏幕尺寸计算出设备的PPI值。例如，设备分辨率为1920*1080，屏幕尺寸为4.7英寸，计算其PPI值为468。在步骤S204中，选取与屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值。计算设备分辨率的宽高比，在预定义中的设计分辨率中选取与设备分辨率最接近的作为本方案中的设计分辨率。其中，可利用计算屏幕分辨率的宽高比和每个设计分辨率的宽高比，然后再计算屏幕分辨率的宽高比与每个设计分辨率的宽高比的比值，其中，计算比值时，选取屏幕分辨率的宽高比与设计分辨率的宽高比中数值较大的除以数值较小的，选取比值较小的作为确定的设计分辨率。例如，可比较然后选取较小的一个作为设计分辨率，具体为如果设备分辨率宽高比为1.4，最接近的两个分辨率宽高比为3:2(960*640)和4:3(1024*768)，比较所以设计分辨率为1024*768。而本实施例中选取的设备分辨率宽高比为1.78，计算比值为所以最接近的设计分辨率为960*640，设计PPI值为326。在步骤S206中，将画布按照设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放。可先将画布根节点按照横向分辨率进行图像的等比例缩放，将图像先由制作分辨率按照横向分辨率的缩放比等比缩放到设计分辨率，例如1136*640->960*640，即将画布根节点按照960/1136的比例进行缩放。然后将画布在纵向进行缩放，对于自适应控件(AutoResolutionWidget)可按照左上、左下、右上、右下和居中分成5种类型，分别按照距离左上参考点、左下参考点、右上参考点、右下参考点和中点的距离进行对应位置调整。对于可定义控件(CustomWidget)按照设计配置表中定义的比例进行再缩放，并按照设计配置表中定义的位置类型(PosStyle)和相对位置(Postion)进行位置调整。在步骤S208中，按照设计PPI值与设备PPI值的比值，对控件进行缩放。读取或计算设备的PPI值，按照设计PPI值与设备PPI值的比值，对控件进行缩放。按照设计PPI值326与设备PPI值468比值，对控件进行缩放。在步骤S210中，选取一中间分辨率，中间分辨率的宽度与设计分辨率的宽度相同，中间分辨率的宽高比与设备分辨率的宽高比相同。由于设计分辨率与设备分辨率不一定是宽高等比例缩放的，这里需要一个中间分辨率进行缩放。中间分辨率的宽度与设计分辨率相同，宽高比与设备分辨率相同，例如设计分辨率为960*640，设备分辨率为1920*1080，则中间分辨率可为960*540。在步骤S212中，将画布按照中间分辨率在纵向上进行缩放。按照中间分辨率960*540的高度，重新调整控件的高度信息。主要是按照左上、左下、右上、右下和居中类型对控件进行调整，此时可定义控件(CustomWidget)按照位置类型自动进行归类，不再考虑位置信息。在步骤S214中，将画布按照中间分辨率与设备分辨率的比值进行等比例缩放。将画布按照中间分辨率960*540与设备分辨率1920*1080的比值进行等比例缩放，图像缩放到与设备分辨率相适应，完成适配。根据一示例实施方式，一般美术出图时会制作一张底图，在该底图中框出一个4：3区域作为核心展示部分，其余部分是延伸底图，预留做适配用。核心展示部分保证足够的效果以及需要的素材，延伸底图则是为了应对各种不同分辨率下的适配问题。由于步骤S406和步骤S412中都会进行高度的调整，所以全屏画布需要自动居中处理，针对全屏画布，在画布最上端和最下端可预留延伸底图，以满足画布纵向缩放时的裁剪需要。应清楚地理解，本公开描述了如何形成和使用特定示例，但本公开的原理不限于这些示例的任何细节。相反，基于本公开公开的内容的教导，这些原理能够应用于许多其它实施方式。图3示出根据本公开示例实施方式的对界面控件进行适配的装置方框图。如图3所示，对界面控件进行适配的装置，包括：获取设备信息模块302，用于获取设备的屏幕分辨率和PPI值。针对要适配的设备，读取设备的硬件信息，获取两个核心参数：设备分辨率(Resolution)和屏幕物理尺寸大小，根据屏幕分辨率和屏幕尺寸计算出设备的PPI值。选取设计方案模块304，用于选取与屏幕分辨率的宽高比最接近的一设计分辨率和一设计PPI值。计算设备分辨率的宽高比，在预定义中的设计分辨率中选取与设备分辨率最接近的作为本方案中的设计分辨率，再根据确定的设计分辨率与设备的屏幕尺寸大小计算出设计PPI值。设计分辨率缩放模块306，用于将画布按照设计分辨率的横向分辨率进行等比例缩放，然后在纵向上进行缩放。可先将画布按照横向分辨率进行图像的等比例缩放，将图像由制作分辨率按照横向分辨率的缩放比等比缩放到设计分辨率。对于可定义控件(CustomWidget)可按照设计配置表中定义的比例进行再缩放，然后在纵向上进行缩放。PPI缩放模块308，用于按照设计PPI值与设备PPI值的比值，对控件进行缩放。读取或计算设备的PPI值，按照设计PPI值与设备PPI值的比值，对控件进行缩放。中间分辨率缩放模块310，用于选取一中间分辨率，中间分辨率的宽度与设计分辨率的宽度相同，中间分辨率的宽高比与设备分辨率的宽高比相同，将画布按照中间分辨率在纵向上进行缩放。由于设计分辨率与设备分辨率不一定是宽高等比例缩放的，这里需要一个中间分辨率进行缩放。中间分辨率的宽度与设计分辨率相同，宽高比与设备分辨率相同。按照中间分辨率的高度，重新调整控件的高度信息。主要是按照左上、左下、右上、右下和居中类型对控件进行调整，此时可定义控件(CustomWidget)按照位置类型自动进行归类，不再考虑位置信息。设备分辨率缩放模块312，用于将画布按照中间分辨率与设备分辨率的比值进行等比例缩放。将画布按照中间分辨率与设备分辨率的比值进行等比例缩放，图像缩放到与设备分辨率相适应，完成适配。以上具体地示出和描述了本公开的示例性实施方式。应可理解的是，本公开不限于这里描述的详细结构、设置方式或实现方法；相反，本公开意图涵盖包含在所附权利要求的精神和范围内的各种修改和等效设置。当前第1页1 2 3