CN106648337B - 显示展示列表中内容的方法和装置、电子设备 - Google Patents

显示展示列表中内容的方法和装置、电子设备 Download PDF

Info

Publication number
CN106648337B
CN106648337B CN201611260159.2A CN201611260159A CN106648337B CN 106648337 B CN106648337 B CN 106648337B CN 201611260159 A CN201611260159 A CN 201611260159A CN 106648337 B CN106648337 B CN 106648337B
Authority
CN
China
Prior art keywords
display list
display
list
content data
bottom layer
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN201611260159.2A
Other languages
English (en)
Other versions
CN106648337A (zh
Inventor
王汉
秦国梁
季申
沈海寅
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Smart Car Youhang Technology (beijing) Co Ltd
Original Assignee
Smart Car Youhang Technology (beijing) Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Smart Car Youhang Technology (beijing) Co Ltd filed Critical Smart Car Youhang Technology (beijing) Co Ltd
Priority to CN201611260159.2A priority Critical patent/CN106648337B/zh
Publication of CN106648337A publication Critical patent/CN106648337A/zh
Application granted granted Critical
Publication of CN106648337B publication Critical patent/CN106648337B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481Interaction techniques based on graphical user interfaces [GUI] based on specific properties of the displayed interaction object or a metaphor-based environment, e.g. interaction with desktop elements like windows or icons, or assisted by a cursor's changing behaviour or appearance
    • G06F3/0482Interaction with lists of selectable items, e.g. menus
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06TIMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/002D [Two Dimensional] image generation
    • G06T11/40Filling a planar surface by adding surface attributes, e.g. colour or texture

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本发明公开了一种显示展示列表中内容的方法和装置、电子设备,其中,方法包括:根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据分别填写入位于顶层的第一展示列表和位于底层的第二展示列表中;第一展示列表与第二展示列表基于浮层布局方式设置;对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩;获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容。本发明实现了展示列表中内容透明度渐变的效果,提升了UI设计的自由性和扩展性,提升了用户感受和使用体验。

Description

显示展示列表中内容的方法和装置、电子设备
技术领域
本发明涉及通信技术,尤其是一种显示展示列表中内容的方法和装置、电子设备。
背景技术
随着互联网和智能终端技术的发展,智能终端的功能突飞猛进般地扩展提高,各种互联网应用、智能终端应用不断涌现、更新,正在大规模的应用于人们的生活中。在移动互联网时代,人们会有更多的应用需求,各种应用的开发、设计不止需要注重功能的实现,也更关注用户的使用感观和个人体验。
在实现本发明的过程中,发明人通过调查研究发现,现有智能终端呈现的各种应用界面中,不能实现部分内容的遮罩,例如,搭载于现有安卓(Android)操作系统上的各种应用,如果想对呈现页面中的部分内容进行一个透明度渐变达到滚动下沉的感觉、而又不想改变底层背景颜色的透明度,以实现背景下沉效果。由此对用户界面(user interface,UI)的呈现效果形成了限制,对UI设计形成了折损,无法进一步提升用户感受和使用体验。
发明内容
本发明实施例所要解决的一个技术问题是:提供一种显示展示列表中内容的方法和装置、电子设备,以实现对应用界面部分内容的遮罩。
根据本发明实施例的一个方面,提供的一种显示展示列表中内容的方法,包括:
根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,并分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中;所述第一展示列表与所述第二展示列表基于浮层布局方式设置;
对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩;
获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容;其中,所述图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
可选地,上述显示展示列表中内容的方法,还包括:
在展示列表控件中位于顶层的第一画布中绘制所述第一展示列表,在展示列表控件中位于底层的第二画布中绘制所述第二展示列表,且设置所述第一展示列表与所述第二展示列表的属性为自适应匹配所述展示列表控件的大小;所述展示列表控件中包括基于浮层布局方式设置的所述第一画布和所述第二画布。
可选地,上述显示展示列表中内容的方法,还包括:
监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
可选地,上述显示展示列表中内容的方法,还包括:
通过触屏事件监听用户手指的滑动状态;所述触屏事件基于用户的触屏动作触发;
根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置包括:
利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置,包括:
将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
可选地,上述显示展示列表中内容的方法中,所述图像重叠展现规则包括以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
可选地,上述显示展示列表中内容的方法中,所述获取满足本次内容的透明度遮罩要求的图像重叠展现规则包括:
获取预先设置的一种图像重叠展现规则;或者
根据用户选择的显示效果,确定本次内容显示的透明度遮罩要求;并根据本次内容显示的透明度遮罩要求选择相应的图像重叠展现规则。
可选地,上述显示展示列表中内容的方法中,所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,包括:
通过触屏事件监听用户手指的点击事件;所述触屏事件基于用户的触屏动作触发;
响应于用户手指的点击事件满足预先设置的特殊显示条件,执行所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据的操作。
可选地,上述显示展示列表中内容的方法中,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
根据本发明实施例的另一个方面,提供的一种显示展示列表中内容的装置,包括:
第一展示列表和第二展示列表,所述第一展示列表和所述第二展示列表基于浮层布局方式设置,所述第一展示列表位于顶层,所述第二展示列表位于底层;
数据处理单元,用于根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入位于顶层的第一展示列表和位于底层的第二展示列表中;
透明度处理单元,用于对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩;
显示处理单元,用于获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容;其中,所述图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
可选地,上述显示展示列表中内容的装置中,所述第一展示列表与所述第二展示列表分别为在基于浮层布局方式设置的第一画布和第二画布中绘制形成;其中,所述第一画布位于顶层,所述第二画布位于底层,所述第一展示列表与所述第二展示列表的属性为自适应匹配所述展示列表控件的大小。
可选地,上述显示展示列表中内容的装置,还包括:
监听单元,用于监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
位置更新单元,用于将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
可选地,上述显示展示列表中内容的装置,还包括:
触屏事件单元,基于用户的触屏动作触发,用于监听用户手指的滑动状态;
所述位置更新单元,还用于根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听单元,具体用于利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
所述位置更新单元将所述第二展示列表的位置更新至所述第一展示列表的当前位置时,具体用于将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
可选地,上述显示展示列表中内容的装置中,所述图像重叠展现规则包括以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
可选地,上述显示展示列表中内容的装置中,所述数据处理单元,分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中时,具体用于:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
根据本发明实施例的又一个方面,提供的一种电子设备,耦合设置有展示列表控件,所述展示列表控件包括本发明上述任一实施例所述的显示展示列表中内容的装置。
基于本发明上述实施例提供的显示展示列表中内容的方法和装置、电子设备,根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入基于浮层布局方式设置的第一展示列表和第二展示列表中,对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩,然后根据满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容,实现了展示列表中部分内容的遮罩又不改变未被遮罩部分内容的透明度、从而实现了透明度渐变的效果,提升了UI设计的自由性和扩展性,提升了用户感受和使用体验。
下面通过附图和实施例,对本发明的技术方案做进一步的详细描述。
附图说明
构成说明书的一部分的附图描述了本发明的实施例,并且连同描述一起用于解释本发明的原理。
参照附图,根据下面的详细描述,可以更加清楚地理解本发明,其中:
图1为本发明显示展示列表中内容的方法一个实施例的流程图。
图2为本发明实施例中展示列表控件的一个示意图。
图3为本发明实施例中展示列表滚动的一个示例性流程图。
图4为本发明实施例中展示列表滚动的一个示意图。
图5为本发明实施例中图像重叠展现规则的显示效果示意图。
图6为本发明显示展示列表中内容的方法另一个实施例的流程图。
图7为本发明显示展示列表中内容的装置一个实施例的结构示意图。
图8为本发明显示展示列表中内容的装置另一个实施例的结构示意图。
具体实施方式
现在将参照附图来详细描述本发明的各种示例性实施例。应注意到:除非另外具体说明,否则在这些实施例中阐述的部件和步骤的相对布置、数字表达式和数值不限制本发明的范围。
同时,应当明白,为了便于描述,附图中所示出的各个部分的尺寸并不是按照实际的比例关系绘制的。
以下对至少一个示例性实施例的描述实际上仅仅是说明性的,决不作为对本发明及其应用或使用的任何限制。
对于相关领域普通技术人员已知的技术、方法和设备可能不作详细讨论,但在适当情况下,所述技术、方法和设备应当被视为说明书的一部分。
应注意到:相似的标号和字母在下面的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行进一步讨论。
本发明实施例可以应用于计算机系统/服务器,其可与众多其它通用或专用计算系统环境或配置一起操作。适于与计算机系统/服务器一起使用的众所周知的计算系统、环境和/或配置的例子包括但不限于:个人计算机系统、服务器计算机系统、瘦客户机、厚客户机、手持或膝上设备、基于微处理器的系统、机顶盒、可编程消费电子产品、网络个人电脑、小型计算机系统﹑大型计算机系统和包括上述任何系统的分布式云计算技术环境,等等。
计算机系统/服务器可以在由计算机系统执行的计算机系统可执行指令(诸如程序模块)的一般语境下描述。通常,程序模块可以包括例程、程序、目标程序、组件、逻辑、数据结构等等,它们执行特定的任务或者实现特定的抽象数据类型。计算机系统/服务器可以在分布式云计算环境中实施,分布式云计算环境中,任务是由通过通信网络链接的远程处理设备执行的。在分布式云计算环境中,程序模块可以位于包括存储设备的本地或远程计算系统存储介质上。
图1为本发明显示展示列表中内容的方法一个实施例的流程图。本发明各实施例可以应用于任意操作系统,例如苹果操作系统(iOS)、安卓(Android)操作系统等,其中的展示列表(ListView),具体可以是任意操作系统中的展示列表。如图1所示,该实施例显示展示列表中内容的方法包括:
102,根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目(Item)的内容数据和第二部分条目的内容数据,并分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中。
其中,第一展示列表与第二展示列表基于浮层布局(FrameLayOut)方式设置。
104,对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩。
106,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容。
其中,图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
基于本发明上述实施例提供的显示展示列表中内容的方法,根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入基于浮层布局方式设置的第一展示列表和第二展示列表中,由此,通过不同的浮层实现了两个不同的、分别位于不同层级的展示列表,将一个布局的内容和背景的绘制分割开来,对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩,实现了部分内容的遮罩透明度变化而不是布局整体出现遮罩,然后根据满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容,实现了展示列表中部分内容的遮罩又不改变未被遮罩部分内容的透明度、从而实现了透明度渐变的效果,提升了UI设计的自由性和扩展性,提升了用户感受和使用体验。
另外,在本发明显示展示列表中内容的方法的另一个实施例中,还可以包括:在展示列表控件中位于顶层的第一画布(Canvas)中绘制第一展示列表,在展示列表控件中位于底层的第二画布中绘制第二展示列表,且设置第一展示列表与第二展示列表的属性(即:宽、高)为自适应匹配(MatchParent)展示列表控件的大小。其中,展示列表控件中包括基于浮层布局方式设置的第一画布和第二画布。如图2所示,为本发明实施例中展示列表控件的一个示意图。
基于上述实施例,在不同层级不同画布中绘制了两个展示列表,每个展示列表分别通过一个数据适配器(Adapter)来放置条目的内容数据,这样,只需要在不同的数据适配器中对应其中条目的内容数据进行操作,就将两个展示列表中条目的内容和背景分割开了。由于两个展示列表的属性为自适应匹配展示列表控件的大小,自动填充满展示列表空间的父窗口,避免了手动指定展示列表的宽高造成的重复计算、以及由此带来的显示卡顿。
示例性地,本发明实施例中,可以通过如下方式设置第一展示列表与第二展示列表的自适应匹配属性:
一种是通过可扩展标记语言(X Exrensible Markup Language,xml)中的控件属性:
android:layout_width;
android:layout_height;
另一种是通过在展示列表控件代码中写浮层参数(LayoutParams)的方法动态改变展示列表宽高。
另外,在本发明显示展示列表中内容的方法的又一个实施例中,还可以包括:监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;将第二展示列表的位置更新至第一展示列表的当前位置。
图3为本发明实施例中展示列表滚动的一个示例性流程图。图4为本发明实施例中展示列表滚动的一个示意图。参见图3和图4,本发明各显示展示列表中内容的方法实施例中,具体可以通过如下方式实现展示列表滚动:
202,通过触屏事件(onTouchEvent)监听用户手指的滑动状态,其中的触屏事件基于用户的触屏动作触发。
204,根据用户手指的滑动状态确定第一展示列表的需要滚动的方向和距离,并控制第一展示列表向需要滚动的方向滚动上述距离。
利用活动(Activity)的ontouchEvent方法监听手指点击事件,手指滑动的时候会先按下,滑倒另一个地方再抬起,就可以根据手指按下的坐标和抬起的坐标算出用户是往哪一个方向滑动了。
206,利用第一展示列表的滚动监听事件(onScrollListener)监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表中首个条目(TopFirst)的当前位置。
208,将第一展示列表中首个条目的当前位置设置为第二展示列表中首个条目的目标位置,控制第二展示列表中首个条目滚动至目标位置。
例如,可以通过setSelectionFromTop()方法或setSelection方法,根据第一展示列表的位置来设置第二展示列表的位置,相对而言,setSelectionFromTop()方法比setSelection方法的定位更精准。
将一个布局中的条目分为两部分,分别通过基于浮层布局方式设置的第一展示列表与第二展示列表显示后,通过监听第一展示列表的滚动事件,根据第一展示列表的当前位置更新第二展示列表的位置,就实现了两层设置的两个展示列表的滚动同步、对齐,从而实现一个展示列表的显示的同步效果。
在本发明各显示展示列表中内容的方法实施例中,图像重叠展现规则例如可以包括但不限于以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
示例性地,可以通过PorterDuffXfermode方法或者Xfermode方法来设置两个图像交叉绘制时的上述图像重叠展现规则,从而达到图像的合成效果。图5为本发明实施例中图像重叠展现规则的显示效果示意图。参见图5,示出了分别基于上述16中图像重叠展现规则绘制两个重叠图像后的展现内容。
在本发明上述各显示展示列表中内容的方法实施例的一个具体示例中,可以预先设置一种图像重叠展现规则,则操作106中,获取满足本次内容的透明度遮罩要求的图像重叠展现规则具体为:获取预先设置的一种图像重叠展现规则,此时,只能按照该预先设置的一种图像重叠展现规则展现第一展示列表和第二展示列表重叠后的内容。应用商可以预先根据应用的展现效果需求,预先设置一种最适合当前应用特点的显示效果的图像重叠展现规则,用户使用该应用时,无需手动操作便可实现该显示效果。
另外,也可以不预先设置图像重叠展现规则,由用户选择图像重叠展现规则,从而实现个性化的显示效果。此时,操作106中,获取满足本次内容的透明度遮罩要求的图像重叠展现规则具体为:根据用户选择的显示效果,确定本次内容显示的透明度遮罩要求;并根据本次内容显示的透明度遮罩要求选择相应的图像重叠展现规则。
在本发明上述各显示展示列表中内容的方法实施例的另一个具体示例中,上述实施例的操作102中,具体可以通过触屏事件监听用户手指的点击事件,该触屏事件基于用户的触屏动作触发;响应于用户手指的点击事件满足预先设置的特殊显示条件,开始执行操作102:根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,并分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中。
例如,特殊显示条件例如可以是,两个手指同时点击屏幕,或者上拉显示页面。则通过触屏事件监听用户手指的点击事件满足该特殊现实条件时,基于本发明实施例的方式显示展示列表中内容,即:基于用户的特定操作,例如上拉操作,便可自动实现展示列表中部分内容的遮罩效果,或者基于用户的显示效果指令,例如通过选择图像重叠展现规则选择显示效果,来实现显示展示列表中部分内容的遮罩效果。
在本发明上述各显示展示列表中内容的方法实施例的又一个具体示例中,操作102中,分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,具体可以是:
将需要进行透明度遮罩的第一部分条目的内容数据作为前景,填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据作为背景,填写入位于底层的第二展示列表中;该实施例中,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:两层绘制图像交集部分、显示底层绘制图像DST_IN;或者
将需要进行透明度遮罩的第一部分条目的内容数据作为背景,填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据作为内容,填写入位于底层的第二展示列表中;该实施例中,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
基于上述示例,可以实现展示列表中内容的部分遮罩。例如,可以实现展示列表中的部分条目的内容的透明度渐变达到滚动下沉的感觉,但是又未对底层背景颜色进行透明度改变,从而达到背景下沉效果。
图6为本发明显示展示列表中内容的方法另一个实施例的流程图。该实施例以用户的特定操作动作作为显示透明度渐变效果的触发条件(即:特殊显示条件)为例,对本发明实施例的应用进行进一步说明。如图6所示,该实施例显示展示列表中内容的方法包括:
302,通过触屏事件监听用户手指的滑动状态,其中的触屏事件基于用户的触屏动作触发。
304,根据用户手指的滑动状态,确定用户的操作是否满足预先设置的特殊显示条件。
其中的特殊显示条件,例如可以是向上滚动展示列表。满足该特殊显示条件时,将基于本发明实施例实现展示列表中内容的透明度渐变显示效果。
若用户的操作不满足特殊显示条件,执行操作306;否则,若用户的操作满足特殊显示条件,同时执行操作312,即:执行操作306~310的同时,执行操作312~316。
306,根据用户手指的滑动状态确定第一展示列表的需要滚动的方向和距离,并控制第一展示列表向需要滚动的方向滚动上述距离。
308,利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表中首个条目的当前位置。
310,将第一展示列表中首个条目的当前位置设置为第二展示列表中首个条目的目标位置,控制第二展示列表中首个条目滚动至目标位置。
之后,不执行本发明实施例的后续流程。
312,根据预先设置的透明度遮罩要求,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,并分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中。
其中,第一展示列表与第二展示列表基于浮层布局方式设置。
例如,将需要进行透明度遮罩的第一部分条目的内容数据作为前景,填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据作为背景,填写入位于底层的第二展示列表中。
314,对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩。
316,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,例如,DST_IN,展现第一展示列表和第二展示列表重叠后的内容。
其中,图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
作为本发明实施例的一个应用,在开发地图应用对于地图兴趣点(POI)结果搜索产生的一个结果列表中,采用了本发明实施例显示展示列表中内容的方法,用户在向上滚动的时候,对展示列表中的文字进行了透明度遮罩,而背景色没有受到丝毫的影响,产生一种文字下坠的空间感。
本领域普通技术人员可以理解:实现上述方法实施例的全部或部分步骤可以通过程序指令相关的硬件来完成,前述的程序可以存储于一计算机可读取存储介质中,该程序在执行时,执行包括上述方法实施例的步骤;而前述的存储介质包括:ROM、RAM、磁碟或者光盘等各种可以存储程序代码的介质。
图7为本发明显示展示列表中内容的装置一个实施例的结构示意图。该实施例的显示展示列表中内容的装置,作为一个展示列表控件,可用于实现本发明上述各方法实施例。如图7所示,该实施例显示展示列表中内容的装置包括:第一展示列表,第二展示列表,数据处理单元,透明度处理单元和显示处理单元。其中:
第一展示列表和第二展示列表基于浮层布局方式设置,分别包括一个以上条目,第一展示列表位于顶层,第二展示列表位于底层。
示例性地,第一展示列表与第二展示列表分别为在基于浮层布局方式设置的第一画布和第二画布中绘制形成。其中,第一画布位于顶层,第二画布位于底层,第一展示列表与第二展示列表的属性为自适应匹配展示列表控件的大小。
数据处理单元,用于根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入位于顶层的第一展示列表和位于底层的第二展示列表中。
透明度处理单元,用于对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩。
显示处理单元,用于获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容;其中,图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
示例性地,图像重叠展现规则例如可以包括但不限于以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
基于本发明上述实施例提供的显示展示列表中内容的装置,根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入基于浮层布局方式设置的第一展示列表和第二展示列表中,对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩,然后根据满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容,实现了展示列表中部分内容的遮罩又不改变未被遮罩部分内容的透明度、从而实现了透明度渐变的效果,提升了UI设计的自由性和扩展性,提升了用户感受和使用体验。
图8为本发明显示展示列表中内容的装置另一个实施例的结构示意图。如图8所示,与图7所示的实施例相比,该实施例显示展示列表中内容的装置还包括:监听单元和位置更新单元。其中:
监听单元,用于监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置。
位置更新单元,用于将第二展示列表的位置更新至第一展示列表的当前位置。
另外,再参见图8,在显示展示列表中内容的装置又一个实施例中,还可以包括触屏事件单元,该触屏事件单元基于用户的触屏动作触发,用于监听用户手指的滑动状态。相应地,该实施例中,位置更新单元,还用于根据用户手指的滑动状态确定第一展示列表的需要滚动的方向和距离,并控制第一展示列表向需要滚动的方向滚动距离。监听单元,具体用于利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表中首个条目的当前位置。位置更新单元将第二展示列表的位置更新至第一展示列表的当前位置时,具体用于将第一展示列表中首个条目的当前位置设置为第二展示列表中首个条目的目标位置,控制第二展示列表中首个条目滚动至目标位置。
在本发明上述各显示展示列表中内容的装置实施例的一个具体示例中,数据处理单元,分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中时,具体用于:将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中。该实施例中,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则具体为:两层绘制图像交集部分、显示底层绘制图像DST_IN。
或者,在本发明上述各显示展示列表中内容的装置实施例的另一个具体示例中,将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中。该实施例中,获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则具体为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
本发明实施例还提供了一种电子设备,该电子设备耦合设置有展示列表控件,该展示列表控件具体可以通过本发明上述任一实施例的显示展示列表中内容的装置实现。
本说明书中各个实施例均采用递进的方式描述,每个实施例重点说明的都是与其它实施例的不同之处,各个实施例之间相同或相似的部分相互参见即可。对于系统实施例而言,由于其与方法实施例基本对应,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
可能以许多方式来实现本发明的方法和装置。例如,可通过软件、硬件、固件或者软件、硬件、固件的任何组合来实现本发明的方法和装置。用于所述方法的步骤的上述顺序仅是为了进行说明,本发明的方法的步骤不限于以上具体描述的顺序,除非以其它方式特别说明。此外,在一些实施例中,还可将本发明实施为记录在记录介质中的程序,这些程序包括用于实现根据本发明的方法的机器可读指令。因而,本发明还覆盖存储用于执行根据本发明的方法的程序的记录介质。
本发明的描述是为了示例和描述起见而给出的,而并不是无遗漏的或者将本发明限于所公开的形式。很多修改和变化对于本领域的普通技术人员而言是显然的。选择和描述实施例是为了更好说明本发明的原理和实际应用,并且使本领域的普通技术人员能够理解本发明从而设计适于特定用途的带有各种修改的各种实施例。

Claims (27)

1.一种显示展示列表中内容的方法,其特征在于,包括:
根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,并分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中;所述第一展示列表与所述第二展示列表基于浮层布局方式设置;
对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩;
获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容;其中,所述图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
2.根据权利要求1所述的方法,其特征在于,还包括:
在展示列表控件中位于顶层的第一画布中绘制所述第一展示列表,在展示列表控件中位于底层的第二画布中绘制所述第二展示列表,且设置所述第一展示列表与所述第二展示列表的属性为自适应匹配所述展示列表控件的大小;所述展示列表控件中包括基于浮层布局方式设置的所述第一画布和所述第二画布。
3.根据权利要求1所述的方法,其特征在于,还包括:
监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
4.根据权利要求2所述的方法,其特征在于,还包括:
监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
5.根据权利要求3所述的方法,其特征在于,还包括:
通过触屏事件监听用户手指的滑动状态;所述触屏事件基于用户的触屏动作触发;
根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置包括:
利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置,包括:
将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
6.根据权利要求4所述的方法,其特征在于,还包括:
通过触屏事件监听用户手指的滑动状态;所述触屏事件基于用户的触屏动作触发;
根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置包括:
利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
将所述第二展示列表的位置更新至所述第一展示列表的当前位置,包括:
将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
7.根据权利要求1至6任意一项所述的方法,其特征在于,所述图像重叠展现规则包括以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
8.根据权利要求1至6任意一项所述的方法,其特征在于,所述获取满足本次内容的透明度遮罩要求的图像重叠展现规则包括:
获取预先设置的一种图像重叠展现规则;或者
根据用户选择的显示效果,确定本次内容显示的透明度遮罩要求;并根据本次内容显示的透明度遮罩要求选择相应的图像重叠展现规则。
9.根据权利要求7所述的方法,其特征在于,所述获取满足本次内容的透明度遮罩要求的图像重叠展现规则包括:
获取预先设置的一种图像重叠展现规则;或者
根据用户选择的显示效果,确定本次内容显示的透明度遮罩要求;并根据本次内容显示的透明度遮罩要求选择相应的图像重叠展现规则。
10.根据权利要求1至6任意一项所述的方法,其特征在于,所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,包括:
通过触屏事件监听用户手指的点击事件;所述触屏事件基于用户的触屏动作触发;
响应于用户手指的点击事件满足预先设置的特殊显示条件,执行所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据的操作。
11.根据权利要求7所述的方法,其特征在于,所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,包括:
通过触屏事件监听用户手指的点击事件;所述触屏事件基于用户的触屏动作触发;
响应于用户手指的点击事件满足预先设置的特殊显示条件,执行所述根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据的操作。
12.根据权利要求1至6任意一项所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
13.根据权利要求7所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
14.根据权利要求8所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
15.根据权利要求9所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
16.根据权利要求10所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
17.根据权利要求11所述的方法,其特征在于,所述分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中,包括:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
18.一种显示展示列表中内容的装置,其特征在于,包括:
第一展示列表和第二展示列表,所述第一展示列表和所述第二展示列表基于浮层布局方式设置,所述第一展示列表位于顶层,所述第二展示列表位于底层;
数据处理单元,用于根据是否需要进行透明度遮罩,将待展示内容数据划分为第一部分条目的内容数据和第二部分条目的内容数据,分别填写入位于顶层的第一展示列表和位于底层的第二展示列表中;
透明度处理单元,用于对需要进行透明度遮罩的第一部分条目的内容或第二部分条目的内容进行透明度遮罩;
显示处理单元,用于获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则,展现第一展示列表和第二展示列表重叠后的内容;其中,所述图像重叠展现规则为预先设置的、表示第一展示列表和第二展示列表重叠时展现模式的规则。
19.根据权利要求18所述的装置,其特征在于,所述第一展示列表与所述第二展示列表分别为在基于浮层布局方式设置的第一画布和第二画布中绘制形成;其中,所述第一画布位于顶层,所述第二画布位于底层,所述第一展示列表与所述第二展示列表的属性为自适应匹配所述展示列表控件的大小。
20.根据权利要求18所述的装置,其特征在于,还包括:
监听单元,用于监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
位置更新单元,用于将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
21.根据权利要求19所述的装置,其特征在于,还包括:
监听单元,用于监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取第一展示列表的当前位置;
位置更新单元,用于将所述第二展示列表的位置更新至所述第一展示列表的当前位置。
22.根据权利要求20所述的装置,其特征在于,还包括:
触屏事件单元,基于用户的触屏动作触发,用于监听用户手指的滑动状态;
所述位置更新单元,还用于根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听单元,具体用于利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
所述位置更新单元将所述第二展示列表的位置更新至所述第一展示列表的当前位置时,具体用于将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
23.根据权利要求21所述的装置,其特征在于,还包括:
触屏事件单元,基于用户的触屏动作触发,用于监听用户手指的滑动状态;
所述位置更新单元,还用于根据所述用户手指的滑动状态确定所述第一展示列表的需要滚动的方向和距离,并控制所述第一展示列表向所述需要滚动的方向滚动所述距离;
所述监听单元,具体用于利用第一展示列表的滚动监听事件监听第一展示列表的滚动事件,响应于监听到第一展示列表的位置发生变化,获取所述第一展示列表中首个条目的当前位置;
所述位置更新单元将所述第二展示列表的位置更新至所述第一展示列表的当前位置时,具体用于将所述第一展示列表中首个条目的当前位置设置为所述第二展示列表中首个条目的目标位置,控制所述第二展示列表中首个条目滚动至所述目标位置。
24.根据权利要求18至23任意一项所述的装置,其特征在于,所述图像重叠展现规则包括以下任意一种或多种:
绘制图像不会提交到画布上CLEAR;显示顶层绘制图像SRC;显示底层绘制图像DST;正常显示绘制图像,顶层绘制图像和底层绘制图像叠盖SRC_OVER;顶层绘制图像和底层绘制图像都展示,底层绘制图像居上显示DST_OVER;取两层绘制图像交集部分、显示顶层绘制图像SRC_IN;取两层绘制图像交集部分、显示底层绘制图像DST_IN;取顶层绘制图像非交集部分SRC_OUT;取底层绘制图像非交集部分DST_OUT;取底层绘制图像非交集部分与顶层绘制图像交集部分SRC_ATOP;取顶层绘制图像非交集部分与底层绘制图像交集部分DST_ATOP;取两层绘制图像非交集部分XOR;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色加深DARKEN;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分颜色变亮LIGHTEN;取顶层绘制图像和底层绘制图像交集部分、两层绘制图像交集部分颜色叠加MULTIPLY;取顶层绘制图像和底层绘制图像全部区域、两层绘制图像交集部分为透明色SCREEN。
25.根据权利要求18至23任意一项所述的装置,其特征在于,所述数据处理单元,分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中时,具体用于:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
26.根据权利要求24所述的装置,其特征在于,所述数据处理单元,分别将第一部分条目的内容数据和第二部分条目的内容数据填写入位于顶层的第一展示列表和位于底层的第二展示列表中时,具体用于:
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示底层绘制图像DST_IN;
或者
将需要进行透明度遮罩的第一部分条目的内容数据填写入位于顶层的第一展示列表中,将不需要进行透明度遮罩的第二部分条目的内容数据填写入位于底层的第二展示列表中;
所述获取满足本次内容显示的透明度遮罩要求的图像重叠展现规则为:取两层绘制图像交集部分、显示顶层绘制图像SRC_IN。
27.一种电子设备,其特征在于,耦合设置有展示列表控件,所述展示列表控件包括权利要求18至26任意一项所述的显示展示列表中内容的装置。
CN201611260159.2A 2016-12-30 2016-12-30 显示展示列表中内容的方法和装置、电子设备 Active CN106648337B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201611260159.2A CN106648337B (zh) 2016-12-30 2016-12-30 显示展示列表中内容的方法和装置、电子设备

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201611260159.2A CN106648337B (zh) 2016-12-30 2016-12-30 显示展示列表中内容的方法和装置、电子设备

Publications (2)

Publication Number Publication Date
CN106648337A CN106648337A (zh) 2017-05-10
CN106648337B true CN106648337B (zh) 2020-02-07

Family

ID=58837875

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201611260159.2A Active CN106648337B (zh) 2016-12-30 2016-12-30 显示展示列表中内容的方法和装置、电子设备

Country Status (1)

Country Link
CN (1) CN106648337B (zh)

Families Citing this family (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108874478A (zh) * 2017-05-12 2018-11-23 武汉斗鱼网络科技有限公司 悬浮显示自定义信息的方法、存储介质、电子设备及系统
CN108415637B (zh) * 2018-01-18 2021-02-02 珠海金山网络游戏科技有限公司 一种列表式界面的多层展示方法和系统
WO2019140616A1 (zh) * 2018-01-19 2019-07-25 深圳市大疆创新科技有限公司 障碍物信息处理方法及终端设备
CN110569453B (zh) * 2018-03-27 2021-10-15 阿里巴巴(中国)有限公司 基于canvas元素的路径虚化方法及装置
CN108920515B (zh) * 2018-05-31 2023-07-28 腾讯科技(深圳)有限公司 网页显示过程的信息推荐方法、装置、设备及存储介质
CN109035374B (zh) * 2018-07-13 2023-06-02 Vidaa(荷兰)国际控股有限公司 颜色渐变动画效果的实现方法及装置
CN109614195B (zh) * 2018-12-11 2020-01-14 北京微播视界科技有限公司 一种列表项的预加载方法、装置、设备及存储介质
CN109814961B (zh) * 2018-12-26 2020-11-06 北京城市网邻信息技术有限公司 列表控制方法、装置、电子设备及存储介质
CN109688457B (zh) * 2018-12-28 2021-07-23 武汉斗鱼网络科技有限公司 一种视频防遮挡方法、装置、电子设备及介质
CN109710365A (zh) * 2018-12-28 2019-05-03 武汉斗鱼网络科技有限公司 一种弹幕显示方法、装置、电子设备及介质
CN111782113B (zh) * 2019-12-18 2022-06-07 北京沃东天骏信息技术有限公司 显示方法、装置和计算机可读存储介质
CN111127543B (zh) * 2019-12-23 2024-04-05 北京金山安全软件有限公司 图像处理方法、装置、电子设备以及存储介质

Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101686403A (zh) * 2008-09-28 2010-03-31 扬智科技股份有限公司 图片交互淡入淡出的处理方法及装置
CN104537039A (zh) * 2014-12-23 2015-04-22 四川九洲电器集团有限责任公司 一种图像显示方法及其系统
CN104992412A (zh) * 2015-06-10 2015-10-21 北京金山安全软件有限公司 一种图片渐变方法及装置

Family Cites Families (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US7391929B2 (en) * 2000-02-11 2008-06-24 Sony Corporation Masking tool

Patent Citations (3)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101686403A (zh) * 2008-09-28 2010-03-31 扬智科技股份有限公司 图片交互淡入淡出的处理方法及装置
CN104537039A (zh) * 2014-12-23 2015-04-22 四川九洲电器集团有限责任公司 一种图像显示方法及其系统
CN104992412A (zh) * 2015-06-10 2015-10-21 北京金山安全软件有限公司 一种图片渐变方法及装置

Also Published As

Publication number Publication date
CN106648337A (zh) 2017-05-10

Similar Documents

Publication Publication Date Title
CN106648337B (zh) 显示展示列表中内容的方法和装置、电子设备
US8127246B2 (en) Varying user interface element based on movement
US9367199B2 (en) Dynamical and smart positioning of help overlay graphics in a formation of user interface elements
US9507791B2 (en) Storage system user interface with floating file collection
US20150046856A1 (en) Interactive Charts For Collaborative Project Management
JP6428053B2 (ja) グラフ表示装置およびプログラムおよびサーバ装置
US9146659B2 (en) Computer user interface including lens-based navigation of graphs
US10878175B2 (en) Portlet display on portable computing devices
US9465529B1 (en) Platform-independent environments for customizing user interfaces of native applications for portable electronic devices
EP3028188A1 (en) Three dimensional conditional formatting
US9792268B2 (en) Zoomable web-based wall with natural user interface
US10365791B2 (en) Computer user interface including lens-based enhancement of graph edges
US10410606B2 (en) Rendering graphical assets on electronic devices
CN105094540A (zh) 软件图标显示方法和装置
US11320983B1 (en) Methods and graphical user interfaces for positioning a selection, selecting, and editing, on a computing device running applications under a touch-based operating system
CN109766530B (zh) 图表边框的生成方法、装置、存储介质和电子设备
CN110780952A (zh) 应用界面的交互方法、装置及电子设备
CN109783100B (zh) 查看用户界面元素属性的方法、装置及电子设备
CN110399194B (zh) 日期信息的显示方法、设备及计算机可读存储介质
CN110781652B (zh) 一种在柱状类图表上绘制粒子和光效的方法及装置
US20240004534A1 (en) Click and swap
KR20140142488A (ko) 반응형 위젯 개발 장치, 방법 및 기록 매체
US10775985B2 (en) Dialog transparency adjustability
US20210141524A1 (en) System For Creating Programs
WO2023023054A1 (en) Plugin management system for an interactive system or platform

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant