CN114489423A - 图片显示方法及终端设备 - Google Patents

图片显示方法及终端设备 Download PDF

Info

Publication number
CN114489423A
CN114489423A CN202210099039.8A CN202210099039A CN114489423A CN 114489423 A CN114489423 A CN 114489423A CN 202210099039 A CN202210099039 A CN 202210099039A CN 114489423 A CN114489423 A CN 114489423A
Authority
CN
China
Prior art keywords
picture
folding area
folding
area
display
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.)
Pending
Application number
CN202210099039.8A
Other languages
English (en)
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.)
Hisense Mobile Communications Technology Co Ltd
Original Assignee
Hisense Mobile Communications Technology 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 Hisense Mobile Communications Technology Co Ltd filed Critical Hisense Mobile Communications Technology Co Ltd
Priority to CN202210099039.8A priority Critical patent/CN114489423A/zh
Publication of CN114489423A publication Critical patent/CN114489423A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0481—Interaction 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/04817—Interaction 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 using icons
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04842—Selection of displayed objects or displayed text elements
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04845—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range for image manipulation, e.g. dragging, rotation, expansion or change of colour
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04847—Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0487—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser
    • G06F3/0488—Interaction techniques based on graphical user interfaces [GUI] using specific features provided by the input device, e.g. functions controlled by the rotation of a mouse with dual sensing arrangements, or of the nature of the input device, e.g. tap gestures based on pressure sensed by a digitiser using a touch-screen or digitiser, e.g. input of commands through traced gestures
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input 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/14—Digital output to display device ; Cooperation and interconnection of the display device with other functional units
    • G06F3/1407—General aspects irrespective of display type, e.g. determination of decimal point position, display with fixed or driving decimal point, suppression of non-significant zeros

Landscapes

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

Abstract

本申请公开了一种图片显示方法及终端设备，用以解决相关技术中使得用户需要切换界面来确认图片的选择结果，中断了复选操作，增加了额外的操作步骤，导致操作复杂，效率低下的问题。通过显示图片列表，然后响应于对图片列表中任一图片的选择操作，将图片以默认折叠形式添加到折叠区域进行展示，折叠区域的初始尺寸小于屏幕显示区域的尺寸，折叠区域悬浮在图片列表之上且未被折叠区域覆盖的屏幕显示区域支持展示图片列表中的至少一张图片。由此将已选择的图片以默认折叠形式添加到折叠区域进行展示，用户可以在折叠区域进行已选图片的选择结果确认，无需反复滑动图片列表和切换新的界面，提高了用户确认图片的选择结果的效率。

Description

图片显示方法及终端设备
技术领域
本申请涉及图片处理技术领域，特别涉及一种图片显示方法及终端设备。
背景技术
随着5G技术的不断发展和逐步地普及应用，智能终端设备产品的多媒体业务和功能也不断丰富，用户复选图片进行分享等操作的场景越来越多，智能化体验需求也越来越高。
一般在进行图片复选时，通常的方案是在图片角落显示checkbox选择框，例如图片的左上角、左下角、右上角或右下角，以标记选择框的方式标记已选择的图片。但是在UI设计(User Interface Design，界面设计)时，一般会将选择框设计的非常小，使得选择框看起来不明显，会导致当复选图片数量较多时，用户确认已选择的图片时，在快速滑动图片列表的过程中，无法快速确认之前已选择的图片，需要缓慢滑动或反复来回滑动确认选择结果。
相关技术中，为了解决这一问题，专门设计了界面来显示已选择的图片，但是使得用户需要切换界面来确认选择结果，中断了复选操作，增加了额外的操作步骤，导致操作复杂，效率低下。
发明内容
本申请的目的是提供一种图片显示方法及终端设备，用以解决相关技术中使得用户需要切换界面来确认图片的选择结果，中断了复选操作，增加了额外的操作步骤，导致操作复杂，效率低下的问题。
第一方面，本申请提供一种图片显示方法，所述方法包括：
显示图片列表，所述图片列表中包括多张图片；
响应于对任一图片的选择操作，将所述图片以默认折叠形式添加到折叠区域进行展示，所述折叠区域的初始尺寸小于屏幕显示区域的尺寸，所述折叠区域悬浮在所述图片列表之上且未被所述折叠区域覆盖的屏幕显示区域支持展示所述图片列表中的至少一张图片。
在一种可能的实施方式中，所述方法还包括：
响应于针对所述折叠区域的展开操作，放大所述折叠区域；
基于放大后的折叠区域，调整所述折叠区域内各图片的显示尺寸，并调整所述折叠区域内各图片之间的间距以使得不同图片之间不遮挡。
在一种可能的实施方式中，所述折叠区域若包括多张图片，所述方法还包括：
根据各图片的选择操作的时间顺序，按照距离当前时间由近及远的顺序选择预设数量的图片在折叠区域内展示；
响应于对所述折叠区域的滑动操作，更新所述折叠区域显示的图片。
在一种可能的实施方式中，所述方法还包括：
响应于收起所述折叠区域的用户操作，将展开的折叠区域恢复至所述折叠区域的初始尺寸；
基于所述折叠区域的初始尺寸，调整所述折叠区域内各图片的尺寸，并调整所述折叠区域内各图片之间的间距。
在一种可能的实施方式中，所述图片中包括放大显示标记；
所述方法还包括：
响应于对所述图片中的放大显示标记的选择操作，将所述图片进行放大显示。
在一种可能的实施方式中，将所述图片以默认折叠形式展示到折叠区域，包括：
将所述图片设置为半透明状态，并以默认折叠形式展示到折叠区域。
在一种可能的实施方式中，所述方法还包括：
若所述图片列表为垂直滑动图片列表，将所述折叠区域置于屏幕显示区域的顶部或屏幕显示区域的底部；
若所述图片列表为水平滑动图片列表，将所述折叠区域置于屏幕显示区域的左侧或屏幕显示区域的右侧。
第二方面，本申请提供一种终端设备，包括：
显示器、处理器和存储器；
所述显示器用于显示屏幕显示区域；
所述存储器，用于存储所述处理器可执行指令；
所述处理器被配置为执行所述指令以实现如上述第一方面中任一项所述的图片显示方法。
第三方面，本申请提供一种计算机可读存储介质，当所述计算机可读存储介质中的指令由终端设备执行时，使得所述终端设备能够执行如上述第一方面中任一项所述的图片显示方法。
第四方面，本申请提供一种计算机程序产品，包括计算机程序：
所述计算机程序被处理器执行时实现如上述第一方面中任一项所述的图片显示方法。
本申请的实施例提供的技术方案至少带来以下有益效果：
本申请实施例通过显示图片列表，图片列表中包括多张图片，然后响应于对任一图片的选择操作，将图片以默认折叠形式添加到折叠区域进行展示，折叠区域的初始尺寸小于屏幕显示区域的尺寸，折叠区域悬浮在图片列表之上且未被折叠区域覆盖的屏幕显示区域支持展示图片列表中的至少一张图片。由此，可以实现在图片列表选择多张图片时，把已选择的图片以默认折叠形式添加到折叠区域进行展示，用户可以在折叠区域进行已选图片的选择结果确认，无需反复滑动图片列表，也无需切换新的界面，使得用户选择和查看多张图片时的操作简单，提高了选择和查看多张图片的效率，提高了用户体验。
本申请的其它特征和优点将在随后的说明书中阐述，并且，部分地从说明书中变得显而易见，或者通过实施本申请而了解。本申请的目的和其他优点可通过在所写的说明书、权利要求书、以及附图中所特别指出的结构来实现和获得。
附图说明
为了更清楚地说明本申请实施例的技术方案，下面将对本申请实施例中所需要使用的附图作简单地介绍，显而易见地，下面所介绍的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1为本申请实施例提供的常见的图片列表界面垂直布局的示意图；
图2为本申请实施例提供的常见的图片列表界面水平布局的示意图；
图3为本申请实施例提供的一种终端设备的结构示意图；
图4为本申请实施例提供的终端设备的软件结构框图；
图5为本申请实施例提供的图片显示方法的流程示意图；
图6为本申请实施例提供的垂直布局的折叠区域的示意图；
图7为本申请实施例提供的水平布局的折叠区域的示意图；
图8为本申请实施例提供的展开折叠区域的流程示意图；
图9为本申请实施例提供的收起折叠区域的流程示意图；
图10为本申请实施例提供的垂直布局的放大后的折叠区域的示意图；
图11为本申请实施例提供的水平布局的放大后的折叠区域的示意图；
图12为本申请实施例提供的动态增加和删除已选择的图片的流程示意图；
图13为本申请实施例提供的数据源、可回收列表界面和适配器的结构关系图。
具体实施方式
为使本申请实施例的目的、技术方案和优点更加清楚，下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述。其中，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例，都属于本申请保护的范围。
并且，在本申请实施例的描述中，除非另有说明，“/”表示或的意思，例如，A/B可以表示A或B；文本中的“和/或”仅仅是一种描述关联对象的关联关系，表示可以存在三种关系，例如，A和/或B，可以表示：单独存在A，同时存在A和B，单独存在B这三种情况，另外，在本申请实施例的描述中，“多个”是指两个或多于两个。
以下，术语“第一”、“第二”仅用于描述目的，而不能理解为暗示或暗示相对重要性或者隐含指明所指示的技术特征的数量。由此，限定有“第一”、“第二”、的特征可以明示或者隐含地包括一个或者更多个该特征，在本申请实施例的描述中，除非另有说明，“多个”的含义是两个或两个以上。
随着5G技术的不断发展和逐步地普及应用，智能终端设备产品的多媒体业务和功能也不断丰富，用户复选图片进行分享等操作的场景越来越多，智能化体验需求也越来越高。
相关技术中，在进行图片复选时，通常的方案是在图片角落显示checkbox选择框，例如图片的左上角、左下角、右上角或右下角，以标记选择框的方式标记已选择的图片，例如图1为图片列表界面垂直布局的示意图，图2为图片列表界面水平布局的示意图。
但是在UI设计(User Interface Design，界面设计)时，为了不遮挡图片，一般会将选择框设计的非常小，使得选择框看起来不明显，会导致当复选图片数量较多时，用户确认已选择的图片时，由于选择框选中状态不容易区分，在快速滑动图片列表的过程中，无法快速确认之前已选择的图片，需要缓慢滑动或反复来回滑动确认选择结果。
相关技术中，为了解决这一问题，专门设计了界面来显示已选择的图片。此方案虽然可以解决此问题，但是使得用户需要切换界面来确认选择结果，中断了复选操作，增加了额外的操作步骤，导致操作复杂，效率低下。
有鉴于此，本申请提供了一种图片显示方法及终端设备，用以解决相关技术中使得用户需要切换界面来确认图片的选择结果，中断了复选操作，增加了额外的操作步骤，导致操作复杂，效率低下的问题。
本申请的发明构思可概括为：本申请实施例通过显示图片列表，所述图片列表中包括多张图片，然后响应于对任一图片的选择操作，将所述图片以默认折叠形式添加到折叠区域进行展示，所述折叠区域的初始尺寸小于屏幕显示区域的尺寸，所述折叠区域悬浮在所述图片列表之上且未被所述折叠区域覆盖的屏幕显示区域支持展示所述图片列表中的至少一张图片。由此，可以实现在图片列表选择多张图片时，把已选择的图片以默认折叠形式添加到折叠区域进行展示，用户可以在折叠区域进行已选图片的选择结果确认，无需反复滑动图片列表，也无需切换新的界面，使得用户选择和查看多张图片时的操作简单，提高了选择和查看多张图片的效率，提高了用户体验。
在介绍完本申请的发明构思之后，下面先对本申请提供的终端设备进行说明。图3示出了一种终端设备100的结构示意图。应该理解的是，图3所示终端设备100仅是一个范例，并且终端设备100可以具有比图3中所示的更多的或者更少的部件，可以组合两个或多个的部件，或者可以具有不同的部件配置。图中所示出的各种部件可以在包括一个或多个信号处理和/或专用集成电路在内的硬件、软件、或硬件和软件的组合中实现。
图3中示例性示出了根据示例性实施例中终端设备100的硬件配置框图。如图3所示，终端设备100包括：射频(radio frequency，RF)电路110、存储器120、显示单元130、摄像头140、传感器150、音频电路160、无线保真(Wireless Fidelity，Wi-Fi)模块170、处理器180、蓝牙模块181、以及电源190等部件。
RF电路110可用于在收发信息或通话过程中信号的接收和发送，可以接收基站的下行数据后交给处理器180处理；可以将上行数据发送给基站。通常，RF电路包括但不限于天线、至少一个放大器、收发信机、耦合器、低噪声放大器、双工器等器件。
存储器120可用于存储软件程序及数据。处理器180通过运行存储在存储器120的软件程序或数据，从而执行终端设备100的各种功能以及数据处理。存储器120可以包括高速随机存取存储器，还可以包括非易失性存储器，例如至少一个磁盘存储器件、闪存器件、或其他易失性固态存储器件。存储器120存储有使得终端设备100能运行的操作系统。本申请中存储器120可以存储操作系统及各种应用程序，还可以存储执行本申请实施例所述图片显示方法的程序代码。
显示单元130可用于接收输入的数字或字符信息，产生与终端设备100的用户设置以及功能控制有关的信号输入，具体地，显示单元130可以包括设置在终端设备100正面的触摸屏131，可收集用户在其上或附近的触摸操作，例如点击按钮。
显示单元130还可用于显示由用户输入的信息或提供给用户的信息以及终端设备100的各种菜单的图形用户界面(graphical user interface，GUI)。具体地，显示单元130可以包括设置在终端设备100正面的显示屏132。其中，显示屏132可以采用液晶显示器、发光二极管等形式来配置。显示单元130可以用于显示本申请中的折叠区域以及终端设备的屏幕显示区域。
其中，触摸屏131可以覆盖在显示屏132之上，也可以将触摸屏131与显示屏132集成而实现终端设备100的输入和输出功能，集成后可以简称触摸显示屏。本申请中显示单元130可以显示应用程序以及对应的操作步骤。
摄像头140可用于捕获静态图像或视频。物体通过镜头生成光学图像投射到感光元件。感光元件可以是电荷耦合器件(charge coupled device，CCD)或互补金属氧化物半导体(complementary metal-oxide-semiconductor，CMOS)光电晶体管。感光元件把光信号转换成电信号，之后将电信号传递给处理器180转换成数字图像信号。
终端设备100还可以包括至少一种传感器150，比如加速度传感器151、距离传感器152、指纹传感器153、温度传感器154。终端设备100还可配置有陀螺仪、气压计、湿度计、温度计、红外线传感器、光传感器、运动传感器等其他传感器。
音频电路160、扬声器161、麦克风162可提供用户与终端设备100之间的音频接口。音频电路160可将接收到的音频数据转换后的电信号，传输到扬声器161，由扬声器161转换为声音信号输出。终端设备100还可配置音量按钮，用于调节声音信号的音量，还可以用于组合其他按钮，调整封闭区域。另一方面，麦克风162将收集的声音信号转换为电信号，由音频电路160接收后转换为音频数据，再将音频数据输出至RF电路110以发送给比如另一终端设备，或者将音频数据输出至存储器120以便进一步处理。
Wi-Fi属于短距离无线传输技术，终端设备100可以通过Wi-Fi模块170帮助用户收发电子邮件、浏览网页和访问流媒体等，它为用户提供了无线的宽带互联网访问。
处理器180是终端设备100的控制中心，利用各种接口和线路连接整个终端设备的各个部分，通过运行或执行存储在存储器120内的软件程序，以及调用存储在存储器120内的数据，执行终端设备100的各种功能和处理数据。在一些实施例中，处理器180可包括一个或多个处理单元；处理器180还可以集成应用处理器和基带处理器，其中，应用处理器主要处理操作系统、用户界面和应用程序等，基带处理器主要处理无线通信。可以理解的是，上述基带处理器也可以不集成到处理器180中。本申请中处理器180可以运行操作系统、应用程序、用户界面显示及触控响应，以及本申请实施例所述的图片显示方法。另外，处理器180与显示单元130耦接。
蓝牙模块181，用于通过蓝牙协议来与其他具有蓝牙模块的蓝牙设备进行信息交互。例如，终端设备100可以通过蓝牙模块181与同样具备蓝牙模块的可穿戴电子设备(例如智能手表)建立蓝牙连接，从而进行数据交互。
终端设备100还包括给各个部件供电的电源190(比如电池)。电源可以通过电源管理系统与处理器180逻辑相连，从而通过电源管理系统实现管理充电、放电以及功耗等功能。终端设备100还可配置有电源按钮，用于终端设备的开机和关机，以及锁屏等功能。
图4是本申请实施例的终端设备100的软件结构框图。
分层架构将软件分成若干个层，每一层都有清晰的角色和分工。层与层之间通过软件接口通信。在一些实施例中，可将Android系统分为四层，从上至下分别为应用程序层，应用程序框架层，安卓运行时(Android runtime)和系统库，以及内核层。
应用程序层可以包括一系列应用程序包。
如图4所示，应用程序包可以包括相机，图库，日历，通话，地图，导航，WLAN，蓝牙，音乐，视频，短信息等应用程序。
应用程序框架层为应用程序层的应用程序提供应用编程接口(applicationprogramming interface，API)和编程框架。应用程序框架层包括一些预先定义的函数。
如图4所示，应用程序框架层可以包括窗口管理器，内容提供器，视图系统，电话管理器，资源管理器，通知管理器等。
窗口管理器用于管理窗口程序。窗口管理器可以获取显示屏大小，判断是否有状态栏，锁定屏幕，截取屏幕等。
内容提供器用来存放和获取数据，并使这些数据可以被应用程序访问。所述数据可以包括视频，图像，音频，拨打和接听的电话，浏览历史和书签，电话簿、短信息等。
视图系统包括可视控件，例如显示文字的控件，显示图片的控件等。视图系统可用于构建应用程序。显示界面可以由一个或多个视图组成的。例如，包括短信息通知图标的显示界面，可以包括显示文字的视图以及显示图片的视图。
电话管理器用于提供终端设备100的通信功能。例如通话状态的管理(包括接通，挂断等)。
资源管理器为应用程序提供各种资源，比如本地化字符串，图标，图片，布局文件，视频文件等。
通知管理器使应用程序可以在状态栏中显示通知信息(例如短信息的消息摘要，消息内容)，可以用于传达告知类型的消息，可以短暂停留后自动消失，无需用户交互。比如通知管理器被用于告知下载完成，消息提醒等。通知管理器还可以是以图表或者滚动条文本形式出现在系统顶部状态栏的通知，例如后台运行的应用程序的通知，还可以是以对话窗口形式出现在屏幕上的通知。例如在状态栏提示文本信息，发出提示音，终端设备振动，指示灯闪烁等。
Android Runtime包括核心库和虚拟机。Android runtime负责安卓系统的调度和管理。
核心库包含两部分：一部分是java语言需要调用的功能函数，另一部分是安卓的核心库。
应用程序层和应用程序框架层运行在虚拟机中。虚拟机将应用程序层和应用程序框架层的java文件执行为二进制文件。虚拟机用于执行对象生命周期的管理，堆栈管理，线程管理，安全和异常的管理，以及垃圾回收等功能。
系统库可以包括多个功能模块。例如：表面管理器(surface manager)，媒体库(Media Libraries)，三维图形处理库(例如：OpenGL ES)，2D图形引擎(例如：SGL)等。
表面管理器用于对显示子系统进行管理，并且为多个应用程序提供了2D和3D图层的融合。
媒体库支持多种常用的音频，视频格式回放和录制，以及静态图像文件等。媒体库可以支持多种音视频编码格式，例如:MPEG4，H.264，MP3，AAC，AMR，JPG，PNG等。
三维图形处理库用于实现三维图形绘图，图像渲染，合成，和图层处理等。
2D(一种动画方式)图形引擎是2D绘图的绘图引擎。
内核层是硬件和软件之间的层。内核层至少包含显示驱动，摄像头驱动，音频驱动，传感器驱动。
本申请实施例中的终端100可以为包括但不限于智能手机、平板电脑、可穿戴电子设备(例如智能手表)、笔记本电脑等电子设备。
为了便于理解本申请实施例提供的图片显示方法，下面结合附图对此进行进一步说明。
图5为本申请实施例提供的图片显示方法的流程示意图。如图5所示，该方法包括以下步骤：
在步骤501中，显示图片列表，图片列表中包括多张图片。
在步骤502中，响应于对任一图片的选择操作，将图片以默认折叠形式添加到折叠区域进行展示，折叠区域的初始尺寸小于屏幕显示区域的尺寸，折叠区域悬浮在图片列表之上且未被折叠区域覆盖的屏幕显示区域支持展示图片列表中的至少一张图片。
在一种可能实施方式中，图片列表可以为垂直图片列表，也可以为水平图片列表。为了实现图片列表以及折叠区域在屏幕显示区域的展示界面，本申请实施例中可以采用RecyclerView(可回收列表界面)。其中，RecyclerView是Android(安卓系统)中比ListView(列表界面)更强大的控件,不仅可以实现和ListView同样的效果,还优化了ListView的各种不足，可以实现数据纵向滚动,也可以实现横向滚动。
具体实施为，通过RecyclerView控件中的RecyclerView.LayoutManager(列表界面-布局管理器)方法，控制图片列表以及折叠区域在屏幕显示区域的展示界面是垂直展示还是水平展示。在RecyclerView中，本申请可以通过LayoutManager(布局管理器)控制布局的显示方式，表现为：在构造LinearLayoutManager(线性布局管理器)时，根据传入的参数控制垂直或水平显示。其中，若传入的参数为LinearLayoutManager.VERTICAL，则控制布局的显示方式为垂直方向，如图6所示，为垂直布局的折叠区域的示意图。若传入的参数为LinearLayoutManager.HORIZONTAL，则控制布局的显示方式为水平方向，如图7所示，为水平布局的折叠区域的示意图。
在一种可能实施方式中，若图片列表为垂直滑动图片列表，将折叠区域置于屏幕显示区域的顶部或屏幕显示区域的底部；若图片列表为水平滑动图片列表，将折叠区域置于屏幕显示区域的左侧或屏幕显示区域的右侧。
在一种可能的实施方式中，本申请实施例中的折叠区域可以展开和折叠，即本申请实施例中折叠区域的尺寸是可以动态调整的。因此若折叠区域如图6所示的折叠状态，本申请实施例可以响应于针对折叠区域的展开操作，放大折叠区域；并基于放大后的折叠区域，调整折叠区域内各图片的显示尺寸，并调整折叠区域内各图片之间的间距以使得不同图片之间不遮挡。若折叠区域如图7所示的展开状态，本申请实施例可以响应于收起折叠区域的用户操作，将展开的折叠区域恢复至折叠区域的初始尺寸；基于折叠区域的初始尺寸，调整折叠区域内各图片的尺寸，并调整折叠区域内各图片之间的间距。
其中，为了减少对下层图片列表的遮挡，本申请中的折叠区域的初始尺寸小于屏幕显示区域的尺寸，可以根据实际使用情况进行设置，例如可以将折叠区域的初始尺寸的最大值设置为屏幕显示区域的尺寸的1/3左右。其中，展开后的折叠区域的尺寸可以等于或小于屏幕显示区域的尺寸。
在一种可能的实施方式中，本申请实施例中展开折叠区域的过程可以具体实施为如图8所示的步骤：
在步骤801中，监听针对折叠区域的展开操作。
在步骤802中，若监听到针对折叠区域的展开操作，响应于针对折叠区域的展开操作，放大折叠区域的显示尺寸。
示例性的，可以通过RecyclerView中的RecyclerView.setLayoutParams方法放大折叠区域的显示尺寸。
在步骤803中，基于放大后的折叠区域的显示尺寸，放大折叠区域内各图片的显示尺寸。
示例性的，可以通过RecyclerView.Adapter(可回收列表界面.适配器)方法设置折叠区域内每个图片的尺寸布局显示。表现为：首先自定义一个继承自RecyclerView.ViewHolder(可回收列表界面.适配器工具类)的ViewHolder(适配器工具类)。然后自定义一个继承自RecyclerView.Adapter的Adapter(适配器)，把data(数据)和ViewHolder绑定，一个data对应一个ViewHolder，即一张图片对应一个ViewHolder。其中，Adapter是Recycler缓存池的基本单元，主要负责ViewHolder的创建以及数据变化时通知RecyclerView。然后使用Adapter中的Adapter.onBindViewHolder方法放大折叠区域内各图片的显示尺寸。
在步骤804中，基于放大后的折叠区域的显示尺寸和放大后的折叠区域内各图片的显示尺寸，放大折叠区域内各图片之间的间距。
示例性的，可以通过RecyclerView.ItemDecoration(子元素装饰器)放大折叠区域内各图片之间的间距。其中ItemDecoration类需要重写，以实现getItemOffsets()(获取元素迁移量)方法，从而控制每个图片的间距。使用ItemDecoration类的时候，首先需要创建一个ItemDecoration对象，并通过RecyclerView的addItemDecoration()方法添加ItemDecoration对象。
在步骤805中，刷新折叠区域。
由此，可以通过放大折叠区域的尺寸、折叠区域内各图片的显示尺寸以及折叠区域内各图片之间的间距的方式展开折叠区域。
在一种可能的实施方式中，本申请实施例中收起折叠区域的过程可以具体实施为如图9所示的步骤：
在步骤901中，监听收起折叠区域的操作。
在步骤902中，若监听到收起折叠区域的操作，响应于收起折叠区域的操作，缩小折叠区域的显示尺寸。
示例性的，可以通过RecyclerView中的RecyclerView.setLayoutParams方法缩小折叠区域的显示尺寸。
在步骤903中，基于缩小后的折叠区域的显示尺寸，缩小折叠区域内各图片的显示尺寸。
示例性的，可以通过RecyclerView.Adapter(可回收列表界面.适配器)方法设置折叠区域内每个图片的尺寸布局显示。表现为：首先自定义一个继承自RecyclerView.ViewHolder(可回收列表界面.适配器工具类)的ViewHolder(适配器工具类)。然后自定义一个继承自RecyclerView.Adapter的Adapter(适配器)，把data(数据)和ViewHolder绑定，一个data对应一个ViewHolder，即一张图片对应一个ViewHolder。其中，Adapter是Recycler缓存池的基本单元，主要负责ViewHolder的创建以及数据变化时通知RecyclerView。然后使用Adapter中的Adapter.onBindViewHolder方法缩小折叠区域内各图片的显示尺寸。
在步骤904中，基于缩小后的折叠区域的显示尺寸和缩小后的折叠区域内各图片的显示尺寸，缩小折叠区域内各图片之间的间距。
示例性的，可以通过RecyclerView.ItemDecoration(子元素装饰器)缩小折叠区域内各图片之间的间距。其中ItemDecoration类需要重写，以实现getItemOffsets()(获取元素迁移量)方法，从而控制每个图片的间距。使用ItemDecoration类的时候，首先需要创建一个ItemDecoration对象，并通过RecyclerView的addItemDecoration()方法添加ItemDecoration对象。
在步骤905中，刷新折叠区域。
由此，可以通过缩小折叠区域的尺寸、折叠区域内各图片的显示尺寸以及折叠区域内各图片之间的间距的方式收起折叠区域。
在一种可能的实施方式中，在响应于针对折叠区域的展开操作，放大折叠区域以及响应于收起折叠区域的用户操作，将展开的折叠区域恢复至折叠区域的初始尺寸之前，都需要监听对折叠区域的操作，因此本申请实施例可以首先设置一个用于监听针对折叠区域的展开操作和监听收起折叠区域的用户操作的按钮。
具体可实施为，首先在RecyclerView中设置button，并为button设置View.onClickListerner(点击事件监听器)，并根据View.onClickListerner对于button的监听结果，判断折叠区域当前的状态，然后设备执行相应的操作：
如图6所示，当折叠区域是垂直布局时，在折叠状态下，button图标显示为向下的小箭头，View.onClickListerner监听到点击button后，设备响应于针对折叠区域的展开操作，放大折叠区域；如图10所示，在展开状态下，button图标显示为向上的小箭头，View.onClickListerner监听到点击button后，响应于收起折叠区域的用户操作，将展开的折叠区域恢复至折叠区域的初始尺寸。
如图7所示，当折叠区域是水平布局时，在折叠状态下，button图标显示为向右的小箭头，View.onClickListerner监听到点击button后，设备响应于针对折叠区域的展开操作，放大折叠区域；如图11所示，在展开状态下，button图标显示为向左的小箭头，View.onClickListerner监听到点击button后，响应于收起折叠区域的用户操作，将展开的折叠区域恢复至折叠区域的初始尺寸。
其中，button是Android中一个非常常用的控件，例如button的表现形式包括但不限于如图6、7、10、11所示的图标，本申请实施例对button的表现形式不做限制。其中View.onClickListerner(点击事件监听器)只监听对于button的点击事件。
在一种可能的实施方式中，本申请实施例还可以动态增加和删除已选择的图片，可以具体实施为如图12所示的步骤：
在步骤1201中，监听对于任一图片的选择操作。若监听到对于任一图片的选择操作，则在步骤1202中，响应对于任一图片的选择操作，判断是否为增加图片，若是增加图片，则在步骤1203中，在数组队列中增加一个图片，若不是增加图片，则在步骤1204中，在数组队列中移除一个图片。其中，数组队列中包括所有已选择的图片。
然后在步骤1205中，适配器将数据变化通知RecyclerView，即通知折叠区域。在RecyclerView接收到适配器的通知后，在步骤1206中，刷新折叠区域。由此折叠区域会显示更新后的数据。例如折叠区域中本身有12张图片，删除一个图片后，折叠区域更新后就会只显示11张图片。
示例性的，可以通过一个ArrayList(数组队列)记录已选择的图片，即RecyclerView的数据源Data Source。数据源Data Source包括所有已选择的图片。其中，ArrayList是动态数组，允许动态增加和删除List(队列)中的元素，是java中比较常用的数据结构。当新增已选择的图片或者取消已选择的图片时，会实时的更新ArrayList中的数据，并通过notifyDataSetChanged()(通知数据变化)方法通知RecyclerView.Adapter更新，从而刷新界面显示更新后的图片。
其中，前文所示的数据源DataSource、可回收列表界面RecylerView和适配器Adapter的结构关系如图13所示。数据源和可回收列表界面之间通过适配器进行连接，适配器中又包括多个适配器工具类，因此数据源和可回收列表界面之间也通过适配器和适配器工具类进行连接。布局管理器在可回收列表界面中，控制着可回收列表界面的布局显示。
在一种可能的实施方式中，为了提高折叠区域在屏幕显示区域的展示效果，本申请实施例还可以将图片设置为半透明状态，并以默认折叠形式展示到折叠区域。
在一种可能的实施方式中，如图6所示，折叠区域的初始尺寸只能展示12张图片，若选择的图片超过12张，多余的图片就不能进行展示，因此在本申请实施例中折叠区域若包括多张图片，可以根据各图片的选择操作的时间顺序，按照距离当前时间由近及远的顺序选择预设数量的图片在折叠区域内展示；然后响应于对折叠区域的滑动操作，更新折叠区域显示的图片。由此，可以根据各图片的选择操作的时间顺序，通过对折叠区域的滑动操作，在折叠区域展示所有已选择的图片。
在一种可能的实施方式中，如图10、11所示，图片中包括放大显示标记，因此本申请实施例还可以响应于对图片中的放大显示标记的选择操作，将图片进行放大显示。由此，用户可以在需要仔细读取任一图片时，可以通过对图片中的放大显示标记的选择操作，选择需要的大小读取相应的图片。
基于前文的描述，本申请实施例通过显示图片列表，图片列表中包括多张图片，然后响应于对任一图片的选择操作，将图片以默认折叠形式添加到折叠区域进行展示，折叠区域的初始尺寸小于屏幕显示区域的尺寸，折叠区域悬浮在图片列表之上且未被折叠区域覆盖的屏幕显示区域支持展示图片列表中的至少一张图片。由此，可以实现在图片列表选择多张图片时，把已选择的图片以默认折叠形式添加到折叠区域进行展示，用户可以在折叠区域进行已选图片的选择结果确认，无需反复滑动图片列表，也无需切换新的界面，使得用户选择和查看多张图片时的操作简单，提高了选择和查看多张图片的效率，提高了用户体验。
本申请提供的实施例之间的相似部分相互参见即可，以上提供的具体实施方式只是本申请总的构思下的几个示例，并不构成本申请保护范围的限定。对于本领域的技术人员而言，在不付出创造性劳动的前提下依据本申请方案所扩展出的任何其他实施方式都属于本申请的保护范围。
此外，尽管在附图中以特定顺序描述了本申请方法的操作，但是，这并非要求或者暗示必须按照该特定顺序来执行这些操作，或是必须执行全部所示的操作才能实现期望的结果。附加地或备选地，可以省略某些步骤，将多个步骤合并为一个步骤执行，和/或将一个步骤分解为多个步骤执行。
本领域内的技术人员应明白，本申请的实施例可提供为方法、系统、或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本申请是参照根据本申请的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
显然，本领域的技术人员可以对本申请进行各种改动和变型而不脱离本申请的精神和范围。这样，倘若本申请的这些修改和变型属于本申请权利要求及其等同技术的范围之内，则本申请也意图包含这些改动和变型在内。

Claims (10)

1.一种图片显示方法，其特征在于，所述方法包括：
显示图片列表，所述图片列表中包括多张图片；
响应于对任一图片的选择操作，将所述图片以默认折叠形式添加到折叠区域进行展示，所述折叠区域的初始尺寸小于屏幕显示区域的尺寸，所述折叠区域悬浮在所述图片列表之上且未被所述折叠区域覆盖的屏幕显示区域支持展示所述图片列表中的至少一张图片。
2.根据权利要求1所述的方法，其特征在于，所述方法还包括：
响应于针对所述折叠区域的展开操作，放大所述折叠区域；
基于放大后的折叠区域，调整所述折叠区域内各图片的显示尺寸，并调整所述折叠区域内各图片之间的间距以使得不同图片之间不遮挡。
3.根据权利要求1所述的方法，其特征在于，所述折叠区域若包括多张图片，所述方法还包括：
根据各图片的选择操作的时间顺序，按照距离当前时间由近及远的顺序选择预设数量的图片在折叠区域内展示；
响应于对所述折叠区域的滑动操作，更新所述折叠区域显示的图片。
4.根据权利要求2所述的方法，其特征在于，所述方法还包括：
响应于收起所述折叠区域的用户操作，将展开的折叠区域恢复至所述折叠区域的初始尺寸；
基于所述折叠区域的初始尺寸，调整所述折叠区域内各图片的尺寸，并调整所述折叠区域内各图片之间的间距。
5.根据权利要求1-4中任一所述的方法，其特征在于，所述图片中包括放大显示标记；
所述方法还包括：
响应于对所述图片中的放大显示标记的选择操作，将所述图片进行放大显示。
6.根据权利要求1所述的方法，其特征在于，将所述图片以默认折叠形式展示到折叠区域，包括：
将所述图片设置为半透明状态，并以默认折叠形式展示到折叠区域。
7.根据权利要求1所述的方法，其特征在于，所述方法还包括：
若所述图片列表为垂直滑动图片列表，将所述折叠区域置于屏幕显示区域的顶部或屏幕显示区域的底部；
若所述图片列表为水平滑动图片列表，将所述折叠区域置于屏幕显示区域的左侧或屏幕显示区域的右侧。
8.一种终端设备，其特征在于，包括：
显示器、处理器和存储器；
所述显示器用于显示屏幕显示区域；
所述存储器，用于存储所述处理器可执行指令；
所述处理器被配置为执行所述指令以实现如权利要求1-7中任一项所述的图片显示方法。
9.一种计算机可读存储介质，其特征在于，当所述计算机可读存储介质中的指令由终端设备执行时，使得所述终端设备能够执行如权利要求1-7中任一项所述的图片显示方法。
10.一种计算机程序产品，其特征在于，包括计算机程序：
所述计算机程序被处理器执行时实现如权利要求1-7中任一项所述的图片显示方法。
CN202210099039.8A 2022-01-25 2022-01-25 图片显示方法及终端设备 Pending CN114489423A (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202210099039.8A CN114489423A (zh) 2022-01-25 2022-01-25 图片显示方法及终端设备

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202210099039.8A CN114489423A (zh) 2022-01-25 2022-01-25 图片显示方法及终端设备

Publications (1)

Publication Number Publication Date
CN114489423A true CN114489423A (zh) 2022-05-13

Family

ID=81476076

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202210099039.8A Pending CN114489423A (zh) 2022-01-25 2022-01-25 图片显示方法及终端设备

Country Status (1)

Country Link
CN (1) CN114489423A (zh)

Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US7689933B1 (en) * 2005-11-14 2010-03-30 Adobe Systems Inc. Methods and apparatus to preview content
CN105867893A (zh) * 2015-11-18 2016-08-17 乐视致新电子科技（天津）有限公司 一种图形用户界面的显示终端、显示方法及显示装置
CN106162306A (zh) * 2016-07-05 2016-11-23 梁建峰 一种用于视频直播购物的商品展示及下单提醒系统
CN106527886A (zh) * 2016-09-30 2017-03-22 北京小米移动软件有限公司 图片显示方法及装置
CN106528879A (zh) * 2016-12-14 2017-03-22 北京小米移动软件有限公司 图片处理方法及装置
CN107678657A (zh) * 2017-10-23 2018-02-09 努比亚技术有限公司 批量选择图片处理方法及对应的移动终端
CN107797717A (zh) * 2016-09-02 2018-03-13 阿里巴巴集团控股有限公司 推送方法、显示方法、客户端设备和数据处理系统
CN108762870A (zh) * 2018-05-24 2018-11-06 网易乐得科技(黑龙江)有限公司 一种页面展示方法及装置
CN111290678A (zh) * 2020-01-19 2020-06-16 深圳集智数字科技有限公司 一种图片预览方法、装置及设备

Patent Citations (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US7689933B1 (en) * 2005-11-14 2010-03-30 Adobe Systems Inc. Methods and apparatus to preview content
CN105867893A (zh) * 2015-11-18 2016-08-17 乐视致新电子科技（天津）有限公司 一种图形用户界面的显示终端、显示方法及显示装置
CN106162306A (zh) * 2016-07-05 2016-11-23 梁建峰 一种用于视频直播购物的商品展示及下单提醒系统
CN107797717A (zh) * 2016-09-02 2018-03-13 阿里巴巴集团控股有限公司 推送方法、显示方法、客户端设备和数据处理系统
CN106527886A (zh) * 2016-09-30 2017-03-22 北京小米移动软件有限公司 图片显示方法及装置
CN106528879A (zh) * 2016-12-14 2017-03-22 北京小米移动软件有限公司 图片处理方法及装置
CN107678657A (zh) * 2017-10-23 2018-02-09 努比亚技术有限公司 批量选择图片处理方法及对应的移动终端
CN108762870A (zh) * 2018-05-24 2018-11-06 网易乐得科技(黑龙江)有限公司 一种页面展示方法及装置
CN111290678A (zh) * 2020-01-19 2020-06-16 深圳集智数字科技有限公司 一种图片预览方法、装置及设备

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
张全法;庄春意;: "根据窗口宽度创建可自动折叠或展开的工具栏", 郑州轻工业学院学报(自然科学版), no. 02 *
范美英主编: "Android移动应用开发项目教程", vol. 2020, 30 June 2020, 机械工业出版社, pages: 183 *

Similar Documents

Publication Publication Date Title
CN111597000B (zh) 一种小窗口管理方法及终端
CN111225108A (zh) 一种通信终端及负屏界面的卡片显示方法
CN112612386B (zh) 移动终端及其应用卡片的显示方法
CN111124219A (zh) 一种通信终端及负屏界面的卡片显示方法
CN114721761B (zh) 一种终端设备、应用图标管理方法和存储介质
CN111857531A (zh) 移动终端及其文件显示方法
CN113709026B (zh) 即时通信消息的处理方法、设备、存储介质和程序产品
CN113835571A (zh) 一种终端设备、信息展示方法和存储介质
CN113055585B (zh) 拍摄界面的缩略图显示方法及移动终端
CN114546219B (zh) 图片列表的处理方法及相关装置
CN113253905B (zh) 基于多指操作的触控方法及智能终端
CN113900740A (zh) 加载多项列表数据的方法及装置
CN114489423A (zh) 图片显示方法及终端设备
CN114675786A (zh) 一种大容量存储挂载方法、装置、终端及介质
CN112825536B (zh) 电子终端及后台卡片显示方法
CN114035870A (zh) 一种终端设备、应用资源控制方法和存储介质
CN113254132A (zh) 一种应用显示方法及相关装置
CN113760164A (zh) 显示设备及其控制操作的响应方法
CN112363653A (zh) 一种水墨屏显示方法及终端
CN113642010A (zh) 一种获取扩展存储设备数据的方法及移动终端
CN114020379B (zh) 一种终端设备、信息反馈方法和存储介质
CN113407082B (zh) 应用于终端设备的字体颜色控制方法及相关装置
CN114911394B (zh) 一种终端设备以及单手操作方法
EP3109755A1 (en) Activation of functions through dynamic association of attributes and functions and attribute-based selection of functions
CN113835574A (zh) 应用通知消息的处理方法、设备、存储介质和程序产品

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