CN113434214B - 一种页面中的组件显示方法及装置 - Google Patents

Abstract

本说明书一个或多个实施例提供一种页面中的组件显示方法、装置、电子设备及机器可读存储介质，应用于移动终端；所述方法包括：响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面；响应于所述用户针对所述目标页面的滑动操作，确定所述目标页面的滑动距离；将所述目标组件的显示样式更新为与所述滑动距离对应的显示样式。

Description

一种页面中的组件显示方法及装置

技术领域

本说明书一个或多个实施例涉及计算机技术领域，尤其涉及一种页面中的组件显示方法、装置、电子设备及机器可读存储介质。

背景技术

在移动终端向用户显示的页面中，通常可以包含若干组件，并且在上述若干组件中，每个组件的显示样式通常为预先配置的对应的显示样式。

在实际应用中，对于页面中与重要功能对应的组件，或者希望用户关注的组件，可以将该组件的显示样式配置为“在页面顶部显示”，还可以为该组件配置较大的显示区域面积，从而在页面中突出显示该组件。

发明内容

本申请提供一种页面中的组件显示方法，应用于移动终端，所述方法包括：

响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面；

响应于所述用户针对所述目标页面的滑动操作，确定所述目标页面的滑动距离；

将所述目标组件的显示样式更新为与所述滑动距离对应的显示样式。

可选的，所述将所述目标组件的显示样式更新为与所述滑动距离对应的显示样式，包括：

当所述滑动距离大于第一阈值且不大于第二阈值时，将所述目标组件的显示样式由初始的第一显示样式更新为第二显示样式；

当所述滑动距离大于第二阈值时，将所述目标组件的显示样式由第二显示样式更新为第三显示样式。

可选的，所述第一显示样式包括在所述目标页面的顶部显示所述目标组件；所述第二显示样式包括在所述目标页面的底部显示所述目标组件；所述第三显示样式包括在所述目标页面的底部右侧显示所述目标组件。

可选的，所述目标组件的显示样式为第二显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第一显示样式时所述目标组件所占的显示区域面积小；所述目标组件的显示样式为第三显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第二显示样式时所述目标组件所占的显示区域面积小。

可选的，所述目标组件包括用于获取与所述目标页面中的展示对象相关的权益的交互组件。

可选的，所述目标页面包括商品页面；所述展示对象包括在所述商品页面中展示的商品对象；所述目标组件包括用于获取与在所述商品页面中展示的商品对象相关的优惠权益的交互组件。

本申请还提供一种页面中的组件显示装置，应用于移动终端，所述装置包括：

显示单元，用于响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面；

确定单元，用于响应于所述用户针对所述目标页面的滑动操作，确定所述目标页面的滑动距离；

更新单元，用于将所述目标组件的显示样式更新为与所述滑动距离对应的显示样式。

可选的，所述更新单元，具体用于：

当所述滑动距离大于第一阈值且不大于第二阈值时，将所述目标组件的显示样式由初始的第一显示样式更新为第二显示样式；

当所述滑动距离大于第二阈值时，将所述目标组件的显示样式由第二显示样式更新为第三显示样式。

可选的，所述第一显示样式包括在所述目标页面的顶部显示所述目标组件；所述第二显示样式包括在所述目标页面的底部显示所述目标组件；所述第三显示样式包括在所述目标页面的底部右侧显示所述目标组件。

可选的，所述目标组件的显示样式为第二显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第一显示样式时所述目标组件所占的显示区域面积小；所述目标组件的显示样式为第三显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第二显示样式时所述目标组件所占的显示区域面积小。

可选的，所述目标组件包括用于获取与所述目标页面中的展示对象相关的权益的交互组件。

可选的，所述目标页面包括商品页面；所述展示对象包括在所述商品页面中展示的商品对象；所述目标组件包括用于获取与在所述商品页面中展示的商品对象相关的优惠权益的交互组件。

本申请还提供一种电子设备，包括通信接口、处理器、存储器和总线，所述通信接口、所述处理器和所述存储器之间通过总线相互连接；

所述存储器中存储机器可读指令，所述处理器通过调用所述机器可读指令，执行上述方法。

本申请还提供一种机器可读存储介质，所述机器可读存储介质存储有机器可读指令，所述机器可读指令在被处理器调用和执行时，实现上述方法。

通过以上实施例，一方面，通过响应于用户针对目标页面的滑动操作，确定目标页面的滑动距离，可以将所述目标页面中的目标组件的显示样式，更新为与所述滑动距离对应的显示样式，从而实现目标组件持续地显示在目标页面中，进而用户在针对目标页面进行滑动操作之后，仍然可以针对目标组件进行触发操作；另一方面，由于目标页面的滑动距离不同时，目标组件的显示样式不同，因此可以动态调整目标页面中的目标组件的显示样式，进而动态调整目标组件对用户浏览目标页面中其他内容的干扰程度，从而提升用户体验。

附图说明

图1是一示例性的实施例示出的一种页面中的组件显示方法的流程图；

图2是一示例性的实施例示出的新人活动页面的示意图；

图3是一示例性的实施例示出的一种页面中的组件显示方法的示意图；

图4是一示例性的实施例示出的另一种页面中的组件显示方法的示意图；

图5是一示例性的实施例示出的一种页面中的组件显示装置所在电子设备的硬件结构图；

图6是一示例性的实施例示出的一种页面中的组件显示装置的框图。

具体实施方式

这里将详细地对示例性实施例进行说明，其示例表示在附图中。下面的描述涉及附图时，除非另有表示，不同附图中的相同数字表示相同或相似的要素。以下示例性实施例中所描述的实施方式并不代表与本说明书一个或多个实施例相一致的所有实施方式。相反，它们仅是与如所附权利要求书中所详述的、本说明书一个或多个实施例的一些方面相一致的装置和方法的例子。

需要说明的是：在其他实施例中并不一定按照本说明书示出和描述的顺序来执行相应方法的步骤。在一些其他实施例中，其方法所包括的步骤可以比本说明书所描述的更多或更少。此外，本说明书中所描述的单个步骤，在其他实施例中可能被分解为多个步骤进行描述；而本说明书中所描述的多个步骤，在其他实施例中也可能被合并为单个步骤进行描述。

为了使本技术领域的人员更好地理解本说明书实施例中的技术方案，下面先对本说明书实施例涉及的组件显示的相关技术，进行简要说明。

在移动终端向用户显示的页面中，通常可以包含若干组件，并且在上述若干组件中，每个组件的显示样式通常为预先配置的对应的显示样式。

例如，为了在页面中突出显示某个组件，可以将该组件的显示样式预先配置为：在页面顶部显示，并且该组件在该页面中所占的显示区域面积较大。

在实际应用中，用户在浏览页面时，可能会向下滑动页面，来浏览更多的页面内容，随之需要突出显示的组件也会被“滑上去”；如果页面的滑动距离较大，就会导致该组件被“滑走”(即上述组件无法在页面中继续显示)，导致用户无法继续关注到该组件；在用户向下滑动很长一段距离后，需要先向上滑动至该组件的位置(即向上滑动，直至该组件显示在页面中)，才可以再针对该组件进行触发操作。

由此可见，响应于用户针对包含某一组件的页面的滑动操作，如果该组件随之被“滑走”，会导致用户无法在页面中持续关注到该组件，减少该组件被用户触发的机会；另外，由于用户在页面中向下滑动很长一段距离后，需要先向上滑动回去，导致用户为了针对该组件进行触发操作时所需的操作较多，影响用户体验。

有鉴于此，本说明书旨在提出一种根据目标页面的滑动距离，更新目标组件的显示样式，来在目标页面中持续显示目标组件的技术方案。

在实现时，移动终端响应于用户触发的显示指令，向用户显示包含目标组件的目标页面；响应于上述用户针对上述目标页面的滑动操作，确定上述目标页面的滑动距离；进一步地，将上述目标组件的显示样式，更新为与上述滑动距离对应的显示样式；其中，上述滑动距离不同时，上述目标组件的显示样式不同。

由此可见，在本说明书中的技术方案中，一方面，通过响应于用户针对目标页面的滑动操作，确定目标页面的滑动距离，可以将上述目标页面中的目标组件的显示样式，更新为与上述滑动距离对应的显示样式，从而实现目标组件持续地显示在目标页面中，进而用户在针对目标页面进行滑动操作之后，仍然可以针对目标组件进行触发操作；另一方面，由于目标页面的滑动距离不同时，目标组件的显示样式不同，因此可以动态调整目标页面中的目标组件的显示样式，进而动态调整目标组件对用户浏览目标页面中其他内容的干扰程度，从而提升用户体验。

下面通过具体实施例，并结合具体的应用场景对本申请进行描述。

请参见图1，图1是一示例性的实施例示出的一种页面中的组件显示方法的流程图，上述方法应用于移动终端，上述方法执行以下步骤：

步骤102：响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面；

步骤104：响应于上述用户针对上述目标页面的滑动操作，确定上述目标页面的滑动距离；

步骤106：将上述目标组件的显示样式更新为与上述滑动距离对应的显示样式。

在本说明书中，上述移动终端，具体可以包括但不限于智能手机、平板电脑、个人数字助理等便携式的终端设备。

在实际应用中，上述移动终端通常具备显示屏；在实现时，响应于用户在上述移动终端上触发的显示指令，上述移动终端可以通过上述显示屏向用户显示与上述显示指令对应的页面。

在本说明书中，上述目标页面中至少可以包含一个组件；上述目标组件，可以包括上述目标页面包含的若干组件中的与预设功能对应的组件。在实现时，用户可以在上述目标页面中针对上述目标组件进行触发操作，来实现与上述目标组件对应的预设功能。

例如，上述目标页面可以为会员活动页面，则上述目标组件可以为上述会员活动页面中的与领取会员卡功能对应的“领取”按钮，用户可以在上述会员活动页面中点击上述“领取”按钮，来领取会员卡。

需要说明的是，在以上实施例中，上述目标页面为会员活动页面，上述目标组件为与领取会员卡功能对应的“领取”按钮，仅仅是一种示例性的描述，并不对本说明书做特别限定；例如，上述目标页面还可以包括但不限于补贴活动页面、砍价活动页面、新人活动页面等等；上述目标组件还可以包括但不限于与领取红包对应的“领取”按钮、与领取折扣资格对应的“领取”按钮等等。

另外，需要说明的是，除了上述目标组件，本领域技术人员还可以根据需求，在上述目标页面中灵活地配置并显示其他组件，本说明书中不做限定。

在实际应用中，上述目标页面中还可以包含若干展示对象；上述目标组件，可以包括用于获取与上述目标页面中的展示对象相关的权益的交互组件。在实现时，用户可以在上述目标页面中针对上述目标交互组件进行触发操作，来获取与上述目标页面中的展示对象相关的权益。

接着以上示例继续举例，上述展示对象可以为与会员礼品对应的礼品信息，与上述展示对象相关的权益可以为与上述会员礼品对应的免费领取权益；用户在上述会员活动页面中点击上述“领取”按钮，来领取会员卡，就可以获取到与在上述会员活动页面中展示的会员礼品对应的免费领取权益。

需要说明的是，在以上实施例中，与上述展示对象相关的权益为免费领取权益，仅仅是一种示例性的描述，并不对本说明书做特别限定；在实际应用中，可以根据需求灵活设置，例如，上述权益还可以包括但不限于满减权益、折扣权益、红包权益等等。

在示出的一种实施方式中，上述目标页面可以包括商品页面；上述展示对象可以包括在上述商品页面中展示的商品对象；上述目标组件可以包括用于获取与在上述商品页面中展示的商品对象相关的优惠权益的交互组件。

例如，在商品页面中可以展示若干商品对象，具体可以展示商品对象的图片、名称、评分等详情信息，上述目标组件可以为商品页面中包含的“领取红包”按钮；用户在上述商品页面中点击上述“领取红包”按钮，可以领取对应的“红包”，获取到与在上述商品页面中展示的商品对象相关的优惠权益，也即，用户在购买上述商品对象时可以使用上述领取到的“红包”抵扣实付金额。

在本说明书中，上述移动终端响应于用户触发的显示指令，可以向用户显示包含上述目标组件的上述目标页面。

其中，用户在上述移动终端触发的上述显示指令，可以理解为，当用户针对上述移动终端执行预设的显示操作时，上述移动终端可以检测到与上述目标页面对应的显示指令；其中，上述预设的显示操作，本领域技术人员可以根据需求灵活设置，如：打开与目标页面对应的应用程序的操作、在其他页面中点击与目标页面对应的活动图标的操作、在其他页面中点击用于跳转至目标页面的按钮的操作等。

例如，移动终端响应于用户触发的与会员活动页面对应的显示指令，可以向用户显示会员活动页面，并且在会员活动页面中显示与领取会员卡功能对应的“领取”按钮。

在本说明书中，上述移动终端响应于用户针对上述目标页面的滑动操作，可以确定上述目标页面的滑动距离。

例如，移动终端响应于用户针对会员活动页面的滑动操作，可以检测到与所述滑动操作对应的滑动轨迹、滑动时间等信息，进一步地，可以通过预设的滑动距离算法，计算出与检测到的滑动轨迹、滑动时间等信息对应的目标页面的滑动距离。

其中，上述针对目标页面的滑动操作，可以包括向上滑动目标页面和向下滑动目标页面；上述目标页面的滑动距离，可以体现上述目标页面的滑动距离大小、以及上述目标页面的滑动方向。

例如，可以将“屏”(即移动终端的屏幕上所显示的目标页面的高度)作为上述滑动距离的单位；目标页面的滑动距离为“1屏”，可以表示上述目标页面向下滑动，滑动距离大小为1“屏”；类似地，目标页面的滑动距离为“-2屏”，可以表示上述目标页面向上滑动，滑动距离大小为2“屏”。

需要说明的是，关于上述移动终端响应于用户针对上述目标页面的滑动操作，确定上述目标页面的滑动距离的具体实现方式，以上仅仅是一种示例性的描述，本说明书中不做限制；在实际应用中，本领域技术人员根据需求，可以采用其他方式确定目标页面的滑动距离，也可以采用其他方式来表示上述滑动距离，其他方式请参见相关技术，在此不再赘述。

在本说明书中，由于移动终端的屏幕大小有限，上述目标页面的显示区域面积大小也有限，如果上述目标组件的初始显示样式在上述目标页面中占用了较大的显示区域面积，并且上述目标组件以初始显示样式在上述目标页面中持续显示，会导致上述目标页面中用于显示其他页面内容的区域面积很小，影响用户正常浏览其他页面内容；因此，在实现时，上述移动终端可以将上述目标组件的显示样式更新为与上述滑动距离对应的显示样式；其中，上述滑动距离不同时，上述目标组件的显示样式不同。

接着以上示例继续举例，移动终端响应于用户针对会员活动页面的滑动操作，确定上述会员活动页面的滑动距离为“1屏”之后，进一步地，可以将与领取会员卡功能对应的“领取”按钮(即目标组件)的显示样式，更新为与滑动距离“1屏”对应的显示样式。

在实际应用中，上述目标组件初始的显示样式为第一显示样式时，上述将上述目标组件的显示样式更新为与上述滑动距离对应的显示样式，具体可以包括：当上述滑动距离大于零且不大于第一阈值时，上述目标组件的显示样式保持第一显示样式；当上述滑动距离大于第一阈值且不大于第二阈值时，将上述目标组件的显示样式由初始的第一显示样式更新为第二显示样式；当上述滑动距离大于第二阈值时，将上述目标组件的显示样式由第二显示样式更新为第三显示样式。

例如，预先配置的第一阈值为“1屏”，第二阈值为“2屏”，与领取会员卡功能对应的“领取”按钮初始的显示样式为第一显示样式；当会员活动页面的滑动距离为“0.5屏”时，上述“领取”按钮保持初始的第一显示样式；当会员活动页面的滑动距离为“1.5屏”时，上述“领取”按钮的显示样式由第一显示样式更新为第二显示样式；当会员活动页面的滑动距离为“3屏”时，上述“领取”按钮的显示样式由第一显示样式更新为第三显示样式；其中，第一显示样式、第二显示样式与第三显示样式，为不同的显示样式。

需要说明的是，在以上示出的实施例中，关于第一阈值、第二阈值的具体大小，仅仅是一种示例性的说明，本说明书不做限制，本领域技术人员可以根据需求灵活设置。

另外，在实际应用中，当前上述目标组件的显示样式为第二显示样式时，将上述目标组件的显示样式更新为与上述滑动距离对应的显示样式，具体可以包括：当上述滑动距离大于零且不大于第二阈值时，上述目标组件的显示样式保持第二显示样式；当上述滑动距离大于第二阈值时，将上述目标组件的显示样式由当前的第二显示样式更新为第三显示样式。

例如，预先配置的第二阈值为“2屏”，与领取会员卡功能对应的“领取”按钮的显示样式，当前已经更新为第二显示样式；当会员活动页面的滑动距离为“0.5屏”时，上述“领取”按钮保持初始的第二显示样式；当会员活动页面的滑动距离为“3屏”时，上述“领取”按钮的显示样式由当前的第二显示样式更新为第三显示样式。

另外，需要说明的是，当上述滑动距离小于零时，更新上述目标组件的显示样式的具体实现方式，可以视为上述实施例的相反过程，在此不再赘述；例如，当前上述“领取”按钮的显示样式为第三显示样式，如果会员活动页面的滑动距离为“-3屏”时，上述“领取”按钮的显示样式由第三显示样式更新为第一显示样式。

在示出的一种实施方式中，上述目标组件的显示样式不同时，上述目标组件在上述目标页面中的显示位置不同；在实现时，随着上述目标页面的滑动距离增大，上述组件在上述目标页面中的显示位置可以更新为更加靠近目标页面底部、更加靠近目标页面左右两侧等，对用户浏览目标页面干扰更小的显示位置。

在实际应用中，第一显示样式可以包括在上述目标页面的顶部显示上述目标组件；第二显示样式可以包括在上述目标页面的底部显示上述目标组件；第三显示样式可以包括在上述目标页面的底部右侧显示上述目标组件。

需要说明的是，在以上示出的实施方式中，关于不同显示样式时上述目标组件在上述目标页面中的具体显示位置，以上仅仅是示例性的说明，并不对本说明书做限制；例如，第二显示样式也可以包括在上述目标页面的左侧或右侧显示上述目标组件，第三显示样式也可以包括在上述目标页面的底部左侧显示上述目标组件，等等。

在示出的另一种实施方式中，上述目标组件的显示样式不同时，上述目标组件在上述目标页面中所占的显示区域面积不同；在实现时，随着上述目标页面的滑动距离增大，上述目标组件在上述目标页面中所占的显示区域面积可以减小。

在实际应用中，上述目标组件的显示样式为第二显示样式时上述目标组件在上述目标页面中所占的显示区域面积，比上述目标组件的显示样式为第一显示样式时上述目标组件所占的显示区域面积小；上述目标组件的显示样式为第三显示样式时上述目标组件在上述目标页面中所占的显示区域面积，比上述目标组件的显示样式为第二显示样式时上述目标组件所占的显示区域面积小。

需要说明的是，在以上示出的实施方式中，关于上述目标组件的不同显示样式，除了存在单一维度(如显示位置、显示区域面积、形状等)的差异，还可以同时存在多个维度的差异；例如，第一显示样式为在目标页面的顶部以模块卡片的样式显示目标组件时，第二显示样式可以为在目标页面的顶部以横条的样式显示目标组件，第二显示样式可以为在目标页面的顶部左侧以悬浮图标的样式显示目标组件，也可以实现随着目标页面的滑动距离增加，减少目标组件对用户浏览其他页面内容的干扰。

通过以上技术方案可知，一方面，通过响应于用户针对目标页面的滑动操作，确定目标页面的滑动距离，可以将上述目标页面中的目标组件的显示样式，更新为与上述滑动距离对应的显示样式，从而实现目标组件持续地显示在目标页面中，进而用户在针对目标页面进行滑动操作之后，仍然可以针对目标组件进行触发操作；另一方面，由于目标页面的滑动距离不同时，目标组件的显示样式不同，因此可以动态调整目标页面中的目标组件的显示样式，进而动态调整目标组件对用户浏览目标页面中其他内容的干扰程度，从而提升用户体验。

为了方便理解上述方法中上述目标组件的不同显示样式之间的差异，下面以上述移动终端为智能手机、上述目标页面为新人活动页面、上述目标组件为用于获取新人补贴红包的交互组件为例，对本申请进行描述。

请参见图2，图2是一示例性的实施例示出的新人活动页面的示意图。

如图2所示，目标页面210中至少可以包含目标组件211；响应于用户在目标页面210中针对目标组件211的触发操作，可以在目标页面210中向用户展示弹窗界面212；其中，弹窗界面212可以用于提示用户已实现与上述目标组件对应的预设功能。

具体地，目标页面210为新人活动页面，目标组件211为用于获取与新人活动页面中的展示对象相关的优惠权益的交互组件，弹窗界面212用于提示用户已成功获取与新人活动页面中的展示对象相关的优惠权益。

请参见图3，图3是一示例性的实施例示出的一种页面中的组件显示方法的示意图。

如图3所示，在目标页面310中，目标组件311的显示样式为初始的第一显示样式，目标组件312的显示样式为第二显示样式；其中，目标组件311在目标页面310顶部以模块卡片的样式显示，目标组件312在目标页面310底部以横条的样式显示，并且，目标组件311显示区域面积比目标组件312显示区域面积大。

在实现时，响应于用户针对目标页面310的滑动操作，确定目标页面310的滑动距离；进一步地，如果上述滑动距离大于预设的第一阈值且不大于预设的第二阈值，可以将目标组件311的显示样式更新为目标组件312的显示样式；进一步地，响应于用户针对目标组件312的触发操作，可以在目标页面310中向用户展示弹窗界面313，用于提示用户已成功获取与新人活动页面中的展示对象相关的优惠权益。

请参见图4，图4是一示例性的实施例示出的另一种页面中的组件显示方法的示意图。

如图4所示，在目标页面410中，目标组件411的显示样式为第二显示样式，目标组件412的显示样式为第三显示样式；其中，目标组件411在目标页面410底部以横条的样式显示，目标组件412在目标页面410底部右侧以悬浮图标的样式显示，并且，目标组件411显示区域面积比目标组件412显示区域面积大。

在实现时，响应于用户针对目标页面410的滑动操作，确定目标页面410的滑动距离；进一步地，如果上述滑动距离大于预设的第二阈值，可以将目标组件411的显示样式更新为目标组件412的显示样式；进一步地，响应于用户针对目标组件412的触发操作，可以在目标页面410中向用户展示弹窗界面413，用于提示用户已成功获取与新人活动页面中的展示对象相关的优惠权益。

应当理解的是，以上示出的实施例仅仅是一种示例性的描述，并不对本说明书做特殊限定。

与上述页面中的组件显示方法的实施例对应的，本说明书还提供了一种页面中的组件显示装置的实施例。

请参见图5，图5是一示例性的实施例示出的一种页面中的组件显示装置所在电子设备的硬件结构图。在硬件层面，该设备包括处理器502、内部总线504、网络接口506、内存508以及非易失性存储器510，当然还可能包括其他业务所需要的硬件。本说明书一个或多个实施例可以基于软件方式来实现，比如由处理器502从非易失性存储器510中读取对应的计算机程序到内存508中然后运行。当然，除了软件实现方式之外，本说明书一个或多个实施例并不排除其他实现方式，比如逻辑器件抑或软硬件结合的方式等等，也就是说以下处理流程的执行主体并不限定于各个逻辑单元，也可以是硬件或逻辑器件。

请参见图6，图6是一示例性的实施例示出的一种页面中的组件显示装置的框图。该页面中的组件显示装置可以应用于图5所示的电子设备中，以实现本说明书的技术方案。其中，上述页面中的组件显示装置可以包括：

显示单元602，用于响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面；

确定单元604，用于响应于上述用户针对上述目标页面的滑动操作，确定上述目标页面的滑动距离；

更新单元606，用于将上述目标组件的显示样式更新为与上述滑动距离对应的显示样式。

在本实施例中，上述更新单元606，具体用于：

当上述滑动距离大于第一阈值且不大于第二阈值时，将上述目标组件的显示样式由初始的第一显示样式更新为第二显示样式；

当上述滑动距离大于第二阈值时，将上述目标组件的显示样式由第二显示样式更新为第三显示样式。

在本实施例中，上述第一显示样式包括在上述目标页面的顶部显示上述目标组件；上述第二显示样式包括在上述目标页面的底部显示上述目标组件；上述第三显示样式包括在上述目标页面的底部右侧显示上述目标组件。

在本实施例中，上述目标组件的显示样式为第二显示样式时上述目标组件在上述目标页面中所占的显示区域面积，比上述目标组件的显示样式为第一显示样式时上述目标组件所占的显示区域面积小；上述目标组件的显示样式为第三显示样式时上述目标组件在上述目标页面中所占的显示区域面积，比上述目标组件的显示样式为第二显示样式时上述目标组件所占的显示区域面积小。

在本实施例中，上述目标组件包括用于获取与上述目标页面中的展示对象相关的权益的交互组件。

在本实施例中，上述目标页面包括商品页面；上述展示对象包括在上述商品页面中展示的商品对象；上述目标组件包括用于获取与在上述商品页面中展示的商品对象相关的优惠权益的交互组件。

上述装置中各个单元的功能和作用的实现过程具体详见上述方法中对应步骤的实现过程，在此不再赘述。

对于装置实施例而言，由于其基本对应于方法实施例，所以相关之处参见方法实施例的部分说明即可。以上所描述的装置实施例只是示意性的，其中所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部模块来实现本说明书方案的目的。本领域普通技术人员在不付出创造性劳动的情况下，即可以理解并实施。

上述实施例阐明的系统、装置、模块或单元，具体可以由计算机芯片或实体实现，或者由具有某种功能的产品来实现。一种典型的实现设备为计算机，计算机的具体形式可以是个人计算机、膝上型计算机、蜂窝电话、相机电话、智能电话、个人数字助理、媒体播放器、导航设备、电子邮件收发设备、游戏控制台、平板计算机、可穿戴设备或者这些设备中的任意几种设备的组合。

在一个典型的配置中，计算机包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。

内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。

计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带、磁盘存储、量子存储器、基于石墨烯的存储介质或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。

还需要说明的是，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。

上述对本说明书特定实施例进行了描述。其它实施例在所附权利要求书的范围内。在一些情况下，在权利要求书中记载的动作或步骤可以按照不同于实施例中的顺序来执行并且仍然可以实现期望的结果。另外，在附图中描绘的过程不一定要求示出的特定顺序或者连续顺序才能实现期望的结果。在某些实施方式中，多任务处理和并行处理也是可以的或者可能是有利的。

在本说明书一个或多个实施例中使用的术语是仅仅出于描述特定实施例的目的，而非旨在限制本说明书一个或多个实施例。在本说明书一个或多个实施例和所附权利要求书中所使用的单数形式的“一种”、“所述”和“该”也旨在包括多数形式，除非上下文清楚地表示其他含义。还应当理解，本文中使用的术语“和/或”是指并包含一个或多个相关联的列出项目的任何或所有可能组合。

应当理解，尽管在本说明书一个或多个实施例可能采用术语第一、第二、第三等来描述各种信息，但这些信息不应限于这些术语。这些术语仅用来将同一类型的信息彼此区分开。例如，在不脱离本说明书一个或多个实施例范围的情况下，第一信息也可以被称为第二信息，类似地，第二信息也可以被称为第一信息。取决于语境，如在此所使用的词语“如果”可以被解释成为“在……时”或“当……时”或“响应于确定”。

以上所述仅为本说明书一个或多个实施例的较佳实施例而已，并不用以限制本说明书一个或多个实施例，凡在本说明书一个或多个实施例的精神和原则之内，所做的任何修改、等同替换、改进等，均应包含在本说明书一个或多个实施例保护的范围之内。

Claims (8)

1.一种页面中的组件显示方法，其特征在于，应用于移动终端，所述方法包括：

响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面，所述目标组件包括用于获取与所述目标页面中的展示对象相关的权益的交互组件；

响应于所述用户针对所述目标页面的滑动操作，确定所述目标页面的滑动距离，所述滑动操作为下滑动所述目标页面；

当所述滑动距离大于第一阈值且不大于第二阈值时，将所述目标组件的显示样式由初始的第一显示样式更新为第二显示样式，所述第一显示样式包括在所述目标页面的顶部显示所述目标组件，所述第二显示样式包括在所述目标页面的底部显示所述目标组件；

当所述滑动距离大于第二阈值时，将所述目标组件的显示样式由第二显示样式更新为第三显示样式，所述第三显示样式包括在所述目标页面的底部右侧显示所述目标组件，所述目标组件的显示样式为第三显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第二显示样式时所述目标组件所占的显示区域面积小。

2.根据权利要求1所述的方法，其特征在于，所述目标组件的显示样式为第二显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第一显示样式时所述目标组件所占的显示区域面积小。

3.根据权利要求1所述的方法，其特征在于，所述目标页面包括商品页面；所述展示对象包括在所述商品页面中展示的商品对象；所述目标组件包括用于获取与在所述商品页面中展示的商品对象相关的优惠权益的交互组件。

4.一种页面中的组件显示装置，其特征在于，应用于移动终端，所述装置包括：

显示单元，用于响应于用户在移动终端上触发的显示指令，向用户显示包含目标组件的目标页面，所述目标组件包括用于获取与所述目标页面中的展示对象相关的权益的交互组件；

确定单元，用于响应于所述用户针对所述目标页面的滑动操作，确定所述目标页面的滑动距离，所述滑动操作为下滑动所述目标页面；

更新单元，用于当所述滑动距离大于第一阈值且不大于第二阈值时，将所述目标组件的显示样式由初始的第一显示样式更新为第二显示样式，所述第一显示样式包括在所述目标页面的顶部显示所述目标组件，所述第二显示样式包括在所述目标页面的底部显示所述目标组件；当所述滑动距离大于第二阈值时，将所述目标组件的显示样式由第二显示样式更新为第三显示样式，所述第三显示样式包括在所述目标页面的底部右侧显示所述目标组件，所述目标组件的显示样式为第三显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第二显示样式时所述目标组件所占的显示区域面积小。

5.根据权利要求4所述的装置，其特征在于，所述目标组件的显示样式为第二显示样式时所述目标组件在所述目标页面中所占的显示区域面积，比所述目标组件的显示样式为第一显示样式时所述目标组件所占的显示区域面积小。

6.根据权利要求4所述的装置，其特征在于，所述目标页面包括商品页面；所述展示对象包括在所述商品页面中展示的商品对象；所述目标组件包括用于获取与在所述商品页面中展示的商品对象相关的优惠权益的交互组件。

7.一种电子设备，其特征在于，包括通信接口、处理器、存储器和总线，所述通信接口、所述处理器和所述存储器之间通过总线相互连接；

所述存储器中存储机器可读指令，所述处理器通过调用所述机器可读指令，执行权利要求1至3任一项所述的方法。

8.一种机器可读存储介质，其特征在于，所述机器可读存储介质存储有机器可读指令，所述机器可读指令在被处理器调用和执行时，实现权利要求1至3任一项所述的方法。