CN109741424A - 一种在文字周围插入图片的方法、装置及电子设备 - Google Patents
一种在文字周围插入图片的方法、装置及电子设备 Download PDFInfo
- Publication number
- CN109741424A CN109741424A CN201811653694.3A CN201811653694A CN109741424A CN 109741424 A CN109741424 A CN 109741424A CN 201811653694 A CN201811653694 A CN 201811653694A CN 109741424 A CN109741424 A CN 109741424A
- Authority
- CN
- China
- Prior art keywords
- picture
- text
- adjusted
- original image
- component
- 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
Links
Abstract
本发明实施例公开一种在文字周围插入图片的方法、装置及电子设备,涉及计算机应用开发技术领域,为可控制所显示图片的尺寸,有效增强图文显示的协调性而设计。所述在文字周围插入图片的方法,包括:读取原始图片;解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;显示所述待显示组件,在文字的周围显示所述调整后的图片。本发明可应用于安卓UI界面开发中。
Description
技术领域
本发明涉及计算机应用开发技术领域,尤其涉及一种在文字周围插入图片的方法、装置及电子设备。
背景技术
TextView是Android开发中常用的组件,用来显示文字,可以认为是显示一块文本的区域,除设置文字外,TextView还可提供给文字的四周插入图片的功能。为了应用程序App(Application)表达上的需要,即,为了提供多种多样的可视化界面,经常需要进行图文混排,因此,经常需要用到TextView来实现图文混排。
目前,利用TextView来实现图文混排一般通过两种方法,一种方法是在TextView的布局文件中设置drawLeft、drawRight等属性,给文字的指定侧边设置插图;另一种方式是TextView的运行时通过调用setCompoundDrawables函数动态地向文字周围插入想要的图片。
但是,这两种方法存在同一个问题,显示的图片的尺寸无法控制,TextView组件的宽高尺寸会根据图片的大小相应的伸缩,从而使得TextView组件的宽高能够将图片和文字完整地包裹住。因此,如果TextView的文字字号比较小,而给定的图片的尺寸过大,最后呈现的界面是很大的图片包裹很小的文字,显示效果很不协调。
发明内容
有鉴于此,本发明实施例提供一种在文字周围插入图片的方法、装置及电子设备,能够控制显示的图片的尺寸,从而可以有效增强图文显示的协调性。
第一方面,本发明实施例提供一种在文字周围插入图片的方法,包括:读取原始图片;解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;显示所述待显示组件,在文字的周围显示所述调整后的图片。
在本发明实施例的一具体实现方式中,所述方法包括:在所述布局文件中添加待显示组件对应的自定义类,其中,所述待显示组件包括文字和用于显示于所述文字周围的图片,所述自定义类继承自TextView;在所述布局文件中所述自定义类对应的属性值文件中设置所述图片目标尺寸。
在本发明实施例的一具体实现方式中,所述解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸,包括:利用所述自定义类的构造函数,解析所述布局文件,以获取所述属性值文件中设置的所述图片目标尺寸。
在本发明实施例的一具体实现方式中,所述根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片,包括:获取所述原始图片的初始尺寸;根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片。
在本发明实施例的一具体实现方式中,所述读取原始图片,包括:读取待在文字第一侧显示的原始图片;所述根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片,包括:根据待在文字第一侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;
所述显示所述待显示组件,在文字的周围显示所述调整后的图片,包括:显示所述待显示组件,其中所述调整后的图片紧贴文字第一侧显示。
在本发明实施例的一具体实现方式中,所述显示所述待显示组件,在文字的周围显示所述调整后的图片,还包括:在所述文字的左侧和/或右侧显示所述调整后的图片时,所述调整后的图片的高度相对于所述文字居中显示;在所述文字的上侧和/或下侧显示所述调整后的图片时,所述调整后的图片的宽度相对于所述文字居中显示。
在本发明实施例的一具体实现方式中,在读取原始图片之前,所述方法还包括:监视到预定事件发生时,触发读取原始图片。
第二方面,本发明实施例提供一种在文字周围插入图片的装置,包括:图片读取单元,用于读取原始图片;解析单元,用于解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;尺寸调整单元,用于根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;显示单元,用于显示所述待显示组件,在文字的周围显示所述调整后的图片。
在本发明实施例的一具体实现方式中,所述的装置,还包括:目标尺寸设置单元,用于在布局文件中自定义类对应的属性值文件中设置图片目标尺寸;所述自定义类继承自TextView。
在本发明实施例的一具体实现方式中,所述解析单元,具体用于利用所述自定义类的构造函数,解析所述布局文件,以获取所述属性值文件中设置的所述图片目标尺寸。
在本发明实施例的一具体实现方式中,所述尺寸调整单元,具体用于:获取所述原始图片的初始尺寸;根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片。
在本发明实施例的一具体实现方式中,所述图片读取单元,具体用于读取待在文字第一侧显示的原始图片;所述尺寸调整单元,具体用于:根据待在文字第一侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;所述显示单元,具体用于:显示所述待显示组件,其中所述调整后的图片紧贴文字第一侧显示。
在本发明实施例的一具体实现方式中,所述显示单元,还具体用于:显示所述待显示组件,其中所述调整后的图片的高度或宽度相对于所述文字居中显示。
在本发明实施例的一具体实现方式中,所述的装置,还包括:动态加载单元,用于监视到预定事件发生时,触发读取原始图片。
第三方面,本发明实施例提供一种电子设备,所述电子设备包括:壳体、处理器、存储器、电路板、电源电路,其中,电路板安置在壳体围成的空间内部,处理器和存储器设置在电路板上;电源电路,用于为上述电子设备的各个电路或器件供电;存储器用于存储可执行程序代码;处理器通过读取存储器中存储的可执行程序代码来运行与可执行程序代码对应的程序,用于执行前述任一实施方式所述的方法。
第四方面,本发明实施例提供一种计算机可读存储介质,存储有计算机程序,所述计算机程序被处理器执行时实现前述任一实现方式所述的方法。
本发明实施例提供的一种在文字周围插入图片的方法、装置和电子设备,自定义封装TextView,即自定义继承自在TextView的类,并给自定义类添加图片的显示尺寸,即显示尺寸可以自由灵活设置,因此,在显示与自定义类对应的待显示组件时,可以在布局文件中添加自定义类并灵活设置待显示组件的图片的显示尺寸值,因此,可以根据所添加的显示尺寸值控制待显示组件中图片的显示尺寸,因此,可以将文字周围的图片设置成合适的尺寸,增加所述显示组件中所显示的文字和图片的协调性。
附图说明
为了更清楚地说明本发明实施例的技术方案,下面将对实施例描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其它的附图。
图1为本发明的实施例提供的在文字周围插入图片的方法的一种流程示意图;
图2为本发明的实施例提供的在文字周围插入图片的方法和现有技术的显示效果对比示意图;
图3为本发明的实施例提供的在文字周围插入图片的装置的一种结构示意图;
图4为本发明的实施例提供的在文字周围插入图片的装置的一种结构示意图;
图5为本发明的实施例提供的电子设备的一种结构示意图。
具体实施方式
下面结合附图对本发明实施例进行详细描述。
应当明确,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其它实施例,都属于本发明保护的范围。
首先需要说明的是,本发明适用于Android软件开发,具体涉及Android APP的用户界面UI等界面的显示开发。由于利用TextView来实现图文混排时,即,在文字的周围,在文字的上下左右四侧中的至少一侧插入图片时,是适配于图片的尺寸来调整TextView组件的尺寸的,因此,无法控制图片的尺寸,因此,可能呈现的TextView组件可能出现文字小图片过大的情景,显示效果很不协调和美观。
为了实现图片的尺寸大小可控,本发明实施例中,自定义封装TextView,即自定义继承自TextView的类,本发明实施例中将其称之为自定义类。
本领域技术人员所熟知的,“继承”是面向对象软件技术当中的一个概念。如果一个类A继承自另一个类B,就把这个A称为"B的子类",而把B称为"A的父类"。继承可以使得子类具有父类的各种属性和方法,而不需要再次编写相同的代码。在令子类继承父类的同时,可以重新定义某些属性,并重写某些方法,即覆盖父类的原有属性和方法,使其获得与父类不同的功能。另外,为子类追加新的属性和方法也是常见的做法。
本发明实施例中,上述自定义类即为TextView的子类,TextView为自定义类的父类,自定义类具有TextView的各种属性和方法,并且追加了新的自定义属性,该新的属性为自定义类组件中设置在文字周围的图片的显示尺寸,该显示尺寸可以自定义设置,因此,可以根据所添加的显示尺寸值控制自定义类组件的图片的显示尺寸,从而可以将文字周围的图片设置成合适的尺寸,增加所显示的图文组件的美感和协调性。
可以理解的是,由于自定义类继承自TextView,因此,自定义类对应的文字属性和方法可以与TextView完全一致,因此,本发明实施例中针对文字的显示不做详细说明,具体可参见TextView组件中关于文字的显示方式。
以下,对本发明实施例的在文字周围插入图片的方法进行详细说明,如图1所示,本发明实施例的在文字周围插入图片的方法,可以包括:
步骤101,读取原始图片。
本步骤中,可从预先设置的原始图片资源库中或原始图片插图列表中读取待显示在文字周围的原始图片。可根据原始图片在原始图片资源库或原始图片插图列表中的位置,确定所述原始图片在文字周围的位置。比如,可设置一个长度为4的数组,该数组自开始至末尾,可依次代表文字的左上右下的插图资源。
步骤102,解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸。
所述图片目标尺寸可预先设置为固定的值。为了能够自适应文字的大小,所述图片目标尺寸,也可按照待显示组件中所要显示的文字尺寸的一定比例设置,在这种情况下,文字左、上、右、下的图片目标尺寸可以相同,也可以不相同。
在进行界面显示时,当接收到用户的界面显示指令时,需要解析界面的布局文件,从而获取到界面的各组件以及各组件的相关属性,基于获取到的组件和属性显示各组件,即呈现界面。
本步骤中,在需要显示该待显示组件时,例如接收到用户的显示指令时,解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸,具体地,可利用自定义类的构造函数解析布局文件,从自定义类的属性值文件中获取到该待显示组件中所设置的图片目标尺寸。
可以理解的是,文字周围,即文字的上下左右侧均可以插入图片,因此,自定义类的自定义属性可包括left_width,left_height,top_width,top_height,right_width,right_height,bottom_width,bottom_height,分别代表文字左边、上边、右边、下边相应插图的宽高尺寸。如果仅需要在文字的上下左右侧中的部分侧面插入图片,仅需将不插入图片的侧面对应的属性值设为空值或者特定值。
举例而言,待显示组件中的图片中包括用于显示于文字左侧的第一图片,则,解析到的、即在属性值文件中设置的第一图片的显示尺寸包括左侧图片宽left_width,和左侧图片高left_height。
步骤103,根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致。
本步骤中,若所述原始图片的尺寸大于所述图片目标尺寸,可将所述原始图片缩小至所述图片目标尺寸;若所述原始图片的尺寸小于所述图片目标尺寸,可将所述原始图片放大至所述图片目标尺寸。
步骤104,显示所述待显示组件,在文字的周围显示所述调整后的图片。
本实施例中,由于图片的显示尺寸是自定义设置的,因此,可以通过设置图片目标尺寸,将所显示的组件中,文字周围的图片显示成合适的尺寸,从而增加所述显示组件中所显示的文字和图片的协调性。
TextView为现有的显示组件,为了减少开发工作量,可充分利用现有的显示组件来实现自定义的显示组件。具体地,在本发明一实施例中,在所述读取原始图片(步骤101)之前,所述方法可包括:
步骤A1,在所述布局文件中添加待显示组件对应的自定义类。
其中,待显示组件即为自定义类组件,具体可包括文字和用于显示于文字周围的图片。
该自定义类继承自TextView,具有TextView的各种属性和方法,但增加了自定义的属性,所增加的自定义属性包括待显示组件中图片的显示尺寸,例如,left_width,left_height,top_width,top_height,right_width,right_height,bottom_width,bottom_height,分别代表文字左边、上边、右边、下边相应插图的尺寸。可通过自定义类对应的属性值文件中,按照需求设置图片的显示尺寸值。
针对于自定义类的待显示组件中的文字的属性和方法继承自TextView,本发明实施例不做详细说明。
为了显示自定义类的待显示组件,首先需要在layout布局文件中添加该自定义类。
步骤A2,在所述布局文件中自定义类对应的属性值文件中设置所述图片目标尺寸。
为了控制图片的尺寸,需要在layout布局文件中该自定义类对应的属性值文件中设置该组件中图片的显示尺寸,即图片目标尺寸,显示尺寸值可根据实际显示出的图片大小需求设置。
本实施例中,可基于现有的TextView,实现自定义的待显示组件,工作量小,易于实现。
进一步的,在本发明的一个实施例中,在步骤103根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片可包括:
步骤B1,获取所述原始图片的初始尺寸。
举例而言,可以通过调用getBounds方法获取所述原始图片的初始尺寸,即初始显示范围。
举例而言,本步骤中,获取到的第一图片(待显示在文字左侧的原始图片)的初始显示区域(初始尺寸),包括左侧图片初始上边界bounds.top、左侧图片初始下边界bounds.bottom、左侧图片初始左边界bounds.left和左侧图片初始右边界bounds.right。
步骤B2,根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片。
本步骤中,可对所述原始图片进行缩放操作,以将所述原始图片的初始尺寸调整至所述图片目标尺寸。具体地,若所述原始图片的尺寸大于所述图片目标尺寸,可将所述原始图片缩小至所述图片目标尺寸;若所述原始图片的尺寸小于所述图片目标尺寸,可将所述原始图片放大至所述图片目标尺寸。
为了使插入的图片与文字相协调,可时插入的图片的侧边紧贴文字的侧边显示,具体地,在本发明的一个实施例中,所述读取原始图片(步骤101),可包括:读取待在文字第一侧显示的原始图片;所述第一侧可以是文字的左侧、右侧、上侧或下侧。
所述根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片(步骤102),可包括:
根据待在文字第一侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;
所述显示所述待显示组件,在文字的周围显示所述调整后的图片(步骤103),可包括:
显示所述待显示组件,其中所述调整后的图片紧贴文字第一侧显示。
为了使插入的图片位置与文字的位置相协调,进一步地,在本发明的一个实施例中,所述显示所述待显示组件,在文字的周围显示所述调整后的图片(步骤103),还可包括:
在所述文字的左侧和/或右侧显示所述调整后的图片时,所述调整后的图片的高度相对于所述文字居中显示;
在所述文字的上侧和/或下侧显示所述调整后的图片时,所述调整后的图片的宽度相对于所述文字居中显示。
举例而言,若所述文字第一侧为文字左侧时,上述步骤可具体为:读取待在文字左侧显示的原始图片;
根据待在文字左侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;
显示所述待显示组件,其中所述调整后的图片的右侧紧贴文字左侧侧显示,调整后的图片的高度相对于所述文字居中显示。
举例而言,以屏幕左上角为原点,向右是X轴正坐标,向下是Y轴正坐标,为了实现文字左侧的第一图片紧贴在文字的左边,并且上下居中,可根据以下公式组,确定调整后的第一图片:
第一图片即左侧图片的左边界Left.left=bounds.left–left_width
第一图片上边界Left.top=bounds.top+(bounds.height-left_height)/2
第一图片右边界Left.right=bounds.right
第一图片下边界:Left.bottom=bounds.top+(bounds.height+left_height)/2。
其中,Left.left为所述左侧图片目标左边界,Left.top为所述左侧图片目标上边界,Left.right为所述左侧图片目标右边界,Left.bottom为所述左侧图片目标下边界,所述left_height为所述左侧图片目标高度,所述left_width为所述左侧图片目标宽度;
所述bounds.right为所述左侧图片初始右边界,所述bounds.bottom为所述左侧图片初始下边界,所述bounds.left为所述左侧图片初始左边界,bounds.height为第一图片初始高度。
举例而言,待显示组件中的图片中包括用于显示于文字上侧的第二图片,则,解析到的、即在属性值文件中设置的第二图片的图片目标尺寸包括上侧图片宽度top_width,和上侧图片高度top_height。
而本步骤中获取到的第二图片的初始尺寸(初始显示区域)包括上侧图片初始上边界bounds.top、上侧图片初始下边界bounds.bottom、上侧图片初始左边界bounds.left和上侧图片初始右边界bounds.right;
则,本步骤中,为了实现文字上侧的第二图片紧贴在文字的上边,并且水平居中,可根据以下公式组,确定调整后的第二图片:
第二图片即上侧图片的左边界
Top.left=bounds.left+(bounds.width-top_width)/2
第二图片的上边界Top.top=bounds.bottom–top_height
第二图片的右边界:Top.right=bounds.left+(bounds.width+top_width)/2
Top.bottom=bounds.bottom
其中,Top.left为所述上侧图片目标左边界,Top.top为所述上侧图片目标上边界,Top.right为所述上侧图片目标右边界,Top.bottom为所述上侧图片目标下边界,所述top_height为所述上侧图片目标高度,所述top_width为所述上侧图片目标宽度;
所述bounds.right为所述上侧图片初始右边界,所述bounds.bottom为所述上侧图片初始下边界,所述bounds.Top为所述上侧图片初始左边界,所述bounds.width为第二图片初始宽度。
举例而言,待显示组件中的图片中包括用于显示于文字右侧的第三图片,则,解析到的、即在属性值文件中设置的第三图片的显示尺寸包括右侧图片宽度right_width,和右侧图片高度right_height。
而本步骤中获取到的第三图片的初始尺寸(初始显示区域)包括右侧图片初始上边界bounds.top、右侧图片初始下边界bounds.bottom、右侧图片初始左边界bounds.left和右侧图片初始右边界bounds.right。
则,本步骤中,为了实现文字右侧的第三图片紧贴在文字的右边,并且上下居中,可根据以下公式组,确定调整后的第三图片:
第三图片即右侧图片的左边界Right.left=bounds.left
第三图片的上边界Right.top=bounds.top+(bounds.height-right_height)/2
第三图片的右边界Right.right=bounds.left+right_width
第三图片的下边界
Right.bottom=bounds.top+(bounds.height+right_height)/2
其中,Right.left为所述右侧图片目标左边界,Right.top为所述右侧图片目标上边界,Right.right为所述右侧图片目标右边界,Right.bottom为所述右侧图片目标下边界,所述right_height为所述右侧图片目标高度,所述right_width为所述右侧图片目标宽度;
所述bounds.right为所述右侧图片初始右边界,所述bounds.bottom为所述右侧图片初始下边界,所述bounds.left为所述右侧图片初始左边界,所述bounds.width为第三图片初始宽度。
举例而言,待显示组件中的图片中包括用于显示于文字下侧的第四图片,则,解析到的、即在属性值文件中设置的第四图片的显示尺寸包括下侧图片宽bottom_width,和下侧图片高bottom_height。
而本步骤中获取到的第四图片的初始尺寸(初始显示区域)包括下侧图片初始上边界bounds.top、下侧图片初始下边界bounds.bottom、下侧图片初始左边界bounds.left和下侧图片初始右边界bounds.right;
则,本步骤中,为了实现文字下侧的第四图片紧贴在文字的下边,并且水平居中,可根据以下公式组,确定调整后的第四图片:
第四图片即下侧图片的左边界Bottom.left=bounds.left+(bounds.width-bottom_width)/2
第四图片的上边界Bottom.top=bounds.top
第四图片的右边界
Bottom.right=bounds.left+(bounds.width+bottom_width)/2
第四图片的下边界Bottom.bottom=bounds.top+bottom_height
其中,Bottom.Bottom为所述下侧图片目标左边界,Bottom.top为所述下侧图片目标上边界,Bottom.right为所述下侧图片目标右边界,Bottom.bottom为所述下侧图片目标下边界,所述bottom_height为所述下侧图片目标高度,所述bottom_width为所述下侧图片目标宽度;
所述bounds.right为所述下侧图片初始右边界,所述bounds.bottom为所述下侧图片初始下边界,所述bounds.Bottom为所述下侧图片初始左边界,bounds.width第四图片初始宽度。
下面通过一个具体的实施例对本发明实施例的在文字周围插入图片的方法进行进一步详细说明。本实施例中,具体包括以下步骤:
第一步,自定义一个类FitDrawableSizeTextView,继承自TextView。
该类具有TextView的各种属性和方法,并且追加了新的自定义属性,该新的属性为自定义类组件中设置在文字周围的图片的显示尺寸(图片目标尺寸),
第二步,将待显示的自定义类组件(简称view)对应的自定义类添加到布局文件中。
第三步:在自定义属性attr.xml文件中给自定义的View添加关于四周插图尺寸的属性:left_width,left_height,top_width,top_height,right_width,right_height,bottom_width,bottom_height,分别代表左边、上边、右边、下边相应插图的尺寸。
该属性值可以按照插图实际显示的尺寸需求设置。
第四步:在FitDrawableSizeTextView的构造函数中解析布局文件中给这个组件设置的属性值。
第五步:通过getCompoundDrawables方法获取布局文件中给此View四周设置的插图列表,该插图列表具体为一个长度为4的Drawable数组,4个单元依次代表左上右下边的插图资源。
第六步,根据解析出来的属性值去调整相应的插图显示尺寸和显示区域,显示该View。
具体举例:
设置左边插图,目标是让左边的插图调整到left_width,left_height指定大小,然后紧贴在文字的左边,并且上下居中。读取Drawable数组第一个单元的值,记为drawLeft。调用drawLeft.getBounds方法获取其初始显示区域,记为bounds(类型为Rect)。假设解析出来的宽高为left_width和left_height,,则计算出bounds的left,top,right,bottom四个新的属性值为:bounds.right-left_width,left_height,bounds.top+(bounds.height-left_height)/2,bounds.right,bounds.top+(bounds.height+left_height)/2。调用drawLeft的setBounds方法,将四个新的显示区域属性值设置给drawLeft。
设置上边的插图,目标是让上边的插图调整到指定的尺寸top_width,top_height,并紧贴在文字的上方,并且水平居中。具体过程类似设置左边视图,四个新属性值计算公式为:bounds.left+(bounds.width-top_width)/2,bounds.bottom-top_height,bounds.left+(bounds.width+top_width)/2,bounds.bottom。
设置右边插图,目标是让右边插图调整到指定的right_width,right_height尺寸,紧贴文字右边并且垂直居中。具体过程同上,计算公式为:bounds.left,bounds.top+(bounds.height-right_height)/2,bounds.left+right_width,bounds.top+(bounds.height+right_height)/2。
设置下边插图。目标是让其调整到bottom_width,bottom_height大小,并且水平居中紧贴于文字下边。过程同上,公式为:bounds.left+(bounds.width-bottom_width)/2,bounds.top,bounds.left+(bounds.width+bottom_width)/2,bounds.top+bottom_height。
最后,调整完成,四周插图显示成了布局文件中指定的大小。
图2示例了利用本发明实施例的在文字周围插入图片的方法和现有技术的方法的显示效果对比示意图,从图中可知,本发明实施例的图片尺寸可控,可以按需设置。
上述实施例中,在文字周围插入图片为预先设置的,在这种情况下,在显示组件中显示文字时,会自动地按照上述步骤在文字周围插入图片。本发明实施例不限于此,在预先未设置在文字周围插入图片的情况下,也可在所述显示组件显示时,动态地在文字周围插入图片,具体地,在本发明另一实施例中,在读取原始图片之前,所述方法还包括:监视到预定事件发生时,触发读取原始图片。本实施例中,在文字周围插入图片不是基于预先的图片插入设定而触发,而是基于预定事件的发生而触发,比如用户点击了某个预定按钮而触发在文字周围插入图片,图片在文字周围的具体插入过程,和上述方法实施例相似,在此不再赘述。
与前述方法实施例相对应,本发明实施例还提供了一种在文字周围插入图片的装置,如图3所示,包括:图片读取单元11、解析单元12、尺寸调整单元13及显示单元14;其中,
所述图片读取单元11,用于读取原始图片;
所述解析单元12,用于解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;
所述尺寸调整单元13,用于根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;
所述显示单元14,用于显示所述待显示组件,在文字的周围显示所述调整后的图片。
参看图4,在本发明一实施例中,所述的装置,还包括:目标尺寸设置单元15,用于在布局文件中自定义类对应的属性值文件中设置图片目标尺寸;所述自定义类继承自TextView。
本实施例中,可基于现有的TextView,实现自定义的待显示组件,工作量小,易于实现。
在本发明一实施例中,所述解析单元12,具体用于利用所述自定义类的构造函数,解析所述布局文件,以获取所述属性值文件中设置的所述图片目标尺寸。
在本发明一实施例中,所述尺寸调整单元13,具体用于:获取所述原始图片的初始尺寸;根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片。
在本发明一实施例中,所述图片读取单元11,具体用于读取待在文字第一侧显示的原始图片;所述尺寸调整单元12,具体用于:根据待在文字第一侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;所述显示单元14,具体用于:显示所述待显示组件,其中所述调整后的图片紧贴文字第一侧显示。
在本发明一实施例中,所述显示单元14,还具体用于:显示所述待显示组件,其中所述调整后的图片的高度或宽度相对于所述文字居中显示。
上述实施例中,在文字周围插入图片为预先设置的,在这种情况下,在显示组件中显示文字时,会自动地按照上述步骤在文字周围插入图片。本发明实施例不限于此,在预先未设置在文字周围插入图片的情况下,也可在所述显示组件显示时,动态地在文字周围插入图片,具体地,在本发明另一实施例中,所述的装置,还包括:动态加载单元,用于监视到预定事件发生时,触发读取原始图片。本实施例中,在文字周围插入图片不是基于预先的图片插入设定而触发,而是基于预定事件的发生而触发,比如用户点击了某个预定按钮而触发在文字周围插入图片,图片在文字周围的具体插入过程,和上述方法实施例相似,在此不再赘述。
本实施例的装置,可以用于执行上述方法实施例的技术方案,其实现原理和技术效果类似,此处不再赘述。
需要说明的是,在本文中,诸如第一和第二等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来,而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。而且,术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含,从而使得包括一系列要素的过程、方法、物品或者设备不仅包括那些要素,而且还包括没有明确列出的其他要素,或者是还包括为这种过程、方法、物品或者设备所固有的要素。在没有更多限制的情况下,由语句“包括一个……”限定的要素,并不排除在包括所述要素的过程、方法、物品或者设备中还存在另外的相同要素。
本说明书中的各个实施例均采用相关的方式描述,各个实施例之间相同相似的部分互相参见即可,每个实施例重点说明的都是与其他实施例的不同之处。
尤其,对于装置实施例而言,由于其基本相似于方法实施例,所以描述的比较简单,相关之处参见方法实施例的部分说明即可。
在流程图中表示或在此以其他方式描述的逻辑和/或步骤,例如,可以被认为是用于实现逻辑功能的可执行指令的定序列表,可以具体实现在任何计算机可读介质中,以供指令执行系统、装置或设备(如基于计算机的系统、包括处理器的系统或其他可以从指令执行系统、装置或设备取指令并执行指令的系统)使用,或结合这些指令执行系统、装置或设备而使用。就本说明书而言,"计算机可读介质"可以是任何可以包含、存储、通信、传播或传输程序以供指令执行系统、装置或设备或结合这些指令执行系统、装置或设备而使用的装置。计算机可读介质的更具体的示例(非穷尽性列表)包括以下:具有一个或多个布线的电连接部(电子装置),便携式计算机盘盒(磁装置),随机存取存储器(RAM),只读存储器(ROM),可擦除可编辑只读存储器(EPROM或闪速存储器),光纤装置,以及便携式光盘只读存储器(CDROM)。另外,计算机可读介质甚至可以是可在其上打印所述程序的纸或其他合适的介质,因为可以例如通过对纸或其他介质进行光学扫描,接着进行编辑、解译或必要时以其他合适方式进行处理来以电子方式获得所述程序,然后将其存储在计算机存储器中。
应当理解,本发明的各部分可以用硬件、软件、固件或它们的组合来实现。
在上述实施方式中,多个步骤或方法可以用存储在存储器中且由合适的指令执行系统执行的软件或固件来实现。例如,如果用硬件来实现,和在另一实施方式中一样,可用本领域公知的下列技术中的任一项或他们的组合来实现:具有用于对数据信号实现逻辑功能的逻辑门电路的离散逻辑电路,具有合适的组合逻辑门电路的专用集成电路,可编程门阵列(PGA),现场可编程门阵列(FPGA)等。
本发明实施例还提供一种电子设备,所述电子设备包含前述任一实施例所述的装置。
图5为本发明电子设备一个实施例的结构示意图,可以实现本发明图1所示实施例的流程,如图5所示,上述电子设备可以包括:壳体51、处理器52、存储器53、电路板54和电源电路55,其中,电路板54安置在壳体51围成的空间内部,处理器52和存储器53设置在电路板54上;电源电路55,用于为上述电子设备的各个电路或器件供电;存储器53用于存储可执行程序代码;处理器52通过读取存储器53中存储的可执行程序代码来运行与可执行程序代码对应的程序,用于执行前述任一实施例所述的方法。
处理器52对上述步骤的具体执行过程以及处理器52通过运行可执行程序代码来进一步执行的步骤,可以参见本发明图1所示实施例的描述,在此不再赘述。
该电子设备以多种形式存在,包括但不限于:
(1)移动通信设备:这类设备的特点是具备移动通信功能,并且以提供话音、数据通信为主要目标。这类终端包括:智能手机(例如iPhone)、多媒体手机、功能性手机,以及低端手机等。
(2)超移动个人计算机设备:这类设备属于个人计算机的范畴,有计算和处理功能,一般也具备移动上网特性。这类终端包括:PDA、MID和UMPC设备等,例如iPad。
(3)便携式娱乐设备:这类设备可以显示和播放多媒体内容。该类设备包括:音频、视频播放器(例如iPod),掌上游戏机,电子书,以及智能玩具和便携式车载导航设备。
(5)服务器:提供计算服务的设备,服务器的构成包括处理器、硬盘、内存、系统总线等,服务器和通用的计算机架构类似,但是由于需要提供高可靠的服务,因此在处理能力、稳定性、可靠性、安全性、可扩展性、可管理性等方面要求较高。
(5)其他具有数据交互功能的电子设备。
本发明的实施例还提供一种计算机可读存储介质,所述计算机可读存储介质存储有一个或者多个程序,所述一个或者多个程序可被一个或者多个处理器执行,以实现前述任一实施例所述的方法。
以上所述,仅为本发明的具体实施方式,但本发明的保护范围并不局限于此,任何熟悉本技术领域的技术人员在本发明揭露的技术范围内,可轻易想到的变化或替换,都应涵盖在本发明的保护范围之内。因此,本发明的保护范围应以权利要求的保护范围为准。
Claims (10)
1.一种在文字周围插入图片的方法,其特征在于,包括:
读取原始图片;
解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;
根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;
显示所述待显示组件,在文字的周围显示所述调整后的图片。
2.根据权利要求1所述的方法,其特征在于,在所述读取原始图片之前,所述方法包括:
在所述布局文件中添加待显示组件对应的自定义类,其中,所述待显示组件包括文字和用于显示于所述文字周围的图片,所述自定义类继承自TextView;
在所述布局文件中所述自定义类对应的属性值文件中设置所述图片目标尺寸。
3.根据权利要求2所述的方法,其特征在于,
所述解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸,包括:
利用所述自定义类的构造函数,解析所述布局文件,以获取所述属性值文件中设置的所述图片目标尺寸。
4.根据权利要求1所述的方法,其特征在于,所述根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片,包括:
获取所述原始图片的初始尺寸;
根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片。
5.根据权利要求4所述的方法,其特征在于,
所述读取原始图片,包括:读取待在文字第一侧显示的原始图片;
所述根据所述图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片,包括:
根据待在文字第一侧显示的图片的图片目标尺寸,调整所述原始图片的初始尺寸,得到调整后的图片;
所述显示所述待显示组件,在文字的周围显示所述调整后的图片,包括:
显示所述待显示组件,其中所述调整后的图片紧贴文字第一侧显示。
6.根据权利要求5所述的方法,其特征在于,所述显示所述待显示组件,在文字的周围显示所述调整后的图片,还包括:
在所述文字的左侧和/或右侧显示所述调整后的图片时,所述调整后的图片的高度相对于所述文字居中显示;
在所述文字的上侧和/或下侧显示所述调整后的图片时,所述调整后的图片的宽度相对于所述文字居中显示。
7.根据权利要求1所述的方法,其特征在于,在读取原始图片之前,所述方法还包括:
监视到预定事件发生时,触发读取原始图片。
8.一种在文字周围插入图片的装置,其特征在于,包括:
图片读取单元,用于读取原始图片;
解析单元,用于解析布局文件,获取所述布局文件中待显示组件中所设置的图片目标尺寸;
尺寸调整单元,用于根据所述图片目标尺寸,调整所述原始图片,得到调整后的图片;所述调整后的图片的尺寸与所述图片目标尺寸相一致;
显示单元,用于显示所述待显示组件,在文字的周围显示所述调整后的图片。
9.一种电子设备,其特征在于,所述电子设备包括:壳体、处理器、存储器、电路板、电源电路,其中,电路板安置在壳体围成的空间内部,处理器和存储器设置在电路板上;电源电路,用于为上述电子设备的各个电路或器件供电;存储器用于存储可执行程序代码;处理器通过读取存储器中存储的可执行程序代码来运行与可执行程序代码对应的程序,用于执行前述1-7任一权利要求所述的方法。
10.一种计算机可读存储介质,存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1~7任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811653694.3A CN109741424A (zh) | 2018-12-29 | 2018-12-29 | 一种在文字周围插入图片的方法、装置及电子设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811653694.3A CN109741424A (zh) | 2018-12-29 | 2018-12-29 | 一种在文字周围插入图片的方法、装置及电子设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN109741424A true CN109741424A (zh) | 2019-05-10 |
Family
ID=66362991
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811653694.3A Pending CN109741424A (zh) | 2018-12-29 | 2018-12-29 | 一种在文字周围插入图片的方法、装置及电子设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109741424A (zh) |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111127543A (zh) * | 2019-12-23 | 2020-05-08 | 北京金山安全软件有限公司 | 图像处理方法、装置、电子设备以及存储介质 |
CN114115777A (zh) * | 2021-11-19 | 2022-03-01 | 武汉虹信技术服务有限责任公司 | 一种基于安卓系统的增强文本显示方法 |
Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102591853A (zh) * | 2011-12-29 | 2012-07-18 | 优视科技有限公司 | 网页重排方法、网页重排装置以及移动终端 |
WO2015096642A1 (en) * | 2013-12-24 | 2015-07-02 | Tencent Technology (Shenzhen) Company Limited | Adaptive webpage adjustment method, device and system for cross-device webpage transfer |
CN105930149A (zh) * | 2016-04-15 | 2016-09-07 | 郑州悉知信息科技股份有限公司 | 一种显示方法及装置 |
CN106933794A (zh) * | 2017-03-14 | 2017-07-07 | 掌阅科技股份有限公司 | 图片排版方法及装置、电子设备、计算机存储介质 |
CN108805960A (zh) * | 2018-05-31 | 2018-11-13 | 北京字节跳动网络技术有限公司 | 图文混排方法、装置、计算机可读存储介质和终端 |
-
2018
- 2018-12-29 CN CN201811653694.3A patent/CN109741424A/zh active Pending
Patent Citations (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102591853A (zh) * | 2011-12-29 | 2012-07-18 | 优视科技有限公司 | 网页重排方法、网页重排装置以及移动终端 |
WO2015096642A1 (en) * | 2013-12-24 | 2015-07-02 | Tencent Technology (Shenzhen) Company Limited | Adaptive webpage adjustment method, device and system for cross-device webpage transfer |
CN105930149A (zh) * | 2016-04-15 | 2016-09-07 | 郑州悉知信息科技股份有限公司 | 一种显示方法及装置 |
CN106933794A (zh) * | 2017-03-14 | 2017-07-07 | 掌阅科技股份有限公司 | 图片排版方法及装置、电子设备、计算机存储介质 |
CN108805960A (zh) * | 2018-05-31 | 2018-11-13 | 北京字节跳动网络技术有限公司 | 图文混排方法、装置、计算机可读存储介质和终端 |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111127543A (zh) * | 2019-12-23 | 2020-05-08 | 北京金山安全软件有限公司 | 图像处理方法、装置、电子设备以及存储介质 |
CN114115777A (zh) * | 2021-11-19 | 2022-03-01 | 武汉虹信技术服务有限责任公司 | 一种基于安卓系统的增强文本显示方法 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN107239287B (zh) | 一种网页显示方法、装置、电子设备及存储介质 | |
US11500513B2 (en) | Method for icon display, terminal, and storage medium | |
CN102414682B (zh) | 用于在图形用户接口中提供零碎网页的方法和设备 | |
CN105847940B (zh) | 一种弹幕显示控制方法及装置 | |
CN105204873B (zh) | 一种终端及应用界面显示方法 | |
US10014030B2 (en) | Method, device and system for playing video | |
CN104820589B (zh) | 一种动态适配网页的方法及其装置 | |
CN109842818A (zh) | 一种视频播放方法、装置、计算机设备及存储介质 | |
CN105208442A (zh) | 一种视频播放应用程序的视频播放方法及装置 | |
CN104915186B (zh) | 一种制作页面的方法和装置 | |
CN104021158A (zh) | 网页中网页元素的调整方法、装置和移动终端 | |
CN109741424A (zh) | 一种在文字周围插入图片的方法、装置及电子设备 | |
CN102346619A (zh) | 一种供用户进行ui定制的网络电视及定制方法 | |
KR20230156127A (ko) | 스크린 캡처 방법, 장치, 전자 장치 및 판독 가능한 저장 매체 | |
CN110516218A (zh) | 表格的生成方法、终端和计算机可读存储介质 | |
CN108924030A (zh) | 电子装置、动态配置消息展示方式的方法及存储介质 | |
CN105807890B (zh) | 一种信息展示方法、装置及电子设备 | |
CN107562324B (zh) | 数据显示控制的方法和终端 | |
CN109640148A (zh) | 一种通过文本框展示文本内容的方法及装置 | |
CN115934230A (zh) | 显示适配方法、装置、计算机可读存储介质及电子设备 | |
CN106648700A (zh) | 兼容不同分辨率的显示方法和装置 | |
CN105893048A (zh) | 浏览器主题更换方法、装置及电子设备 | |
CN109766155A (zh) | 一种弹框生成方法、装置及存储介质 | |
CN110633117B (zh) | 一种数据处理方法、装置、电子设备和可读介质 | |
TW201504818A (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 |