CN116861849A - 一种富文本设置多倍行距的方法及其系统 - Google Patents
一种富文本设置多倍行距的方法及其系统 Download PDFInfo
- Publication number
- CN116861849A CN116861849A CN202310712513.4A CN202310712513A CN116861849A CN 116861849 A CN116861849 A CN 116861849A CN 202310712513 A CN202310712513 A CN 202310712513A CN 116861849 A CN116861849 A CN 116861849A
- Authority
- CN
- China
- Prior art keywords
- text
- height
- line
- rich
- 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
- 238000000034 method Methods 0.000 title claims abstract description 25
- 238000001514 detection method Methods 0.000 claims abstract description 28
- 238000003491 array Methods 0.000 claims description 14
- 230000000694 effects Effects 0.000 description 5
- 230000003993 interaction Effects 0.000 description 2
- 238000012800 visualization Methods 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000010586 diagram Methods 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/103—Formatting, i.e. changing of presentation of documents
- G06F40/109—Font handling; Temporal or kinetic typography
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Health & Medical Sciences (AREA)
- Artificial Intelligence (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Document Processing Apparatus (AREA)
Abstract
本发明提供了一种富文本设置多倍行距的方法及其系统,该方法为:步骤S1、将纯文本组件和图片组件组成的富文本添加到界面上;步骤S2、比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;步骤S3、根据纯文本的字体类型,获取每一行的纯文本位置;步骤S4、根据设置的行距倍数和图片确定富文本实际每一行的高度;步骤S5、将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;步骤S6、根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠;避免富文本内容遮挡的情况。
Description
技术领域
本发明涉及计算机中文本编辑技术领域,特别是一种富文本设置多倍行距的方法及其系统。
背景技术
富文本指的是在文本中含有格式和样式等丰富的信息。与纯文本相比,富文本可以包含各种字体、颜色、大小、粗细、斜体、下划线、超链接、插图、表格等元素,从而使文本更加生动、多样化,并能够提供更好的可读性和可视化效果。使用富文本可以帮助用户更好地理解和处理信息,也可以增强文档或网页的呈现效果,提高交互效果和用户体验。常见的应用场景包括文字编辑器、邮件客户端、博客、社交媒体、网页等。
在富文本编辑器中,可以通过设置行距来调整文本的垂直间距,让文本更加美观和易读。一般而言,行距是指一行文字的底部到下一行文字的顶部之间的距离。在富文本中,可以通过设置图片和字体的上下边距来调整它们与周围文本的行间距。但是对于同时存在图片和字体的富文本,如果想要设置多倍行距,既要考虑到图片与多倍文本高度的差异性,又要避免不同行富文本内容的遮挡情况,使用调整上下边距并不能很好地处理这个问题,所以需要有一种支持富文本设置多倍行距的方法来处理这种情况。
现有技术主要是通过设置图片和字体的上下边距来调整他们与周围文本的行间距,但是对于同时存在图片和字体的富文本,就需要对图片进行单独进行处理,比如在文本中插入特殊的标记来设置图片和字体的行间距,或者通过样式表来进行设置。但是对于设置多倍文本行距,又能保持文字和图片通用的情况,并且避免富文本内容遮挡的情况,并不能很有效地进行处理。
发明内容
为克服上述问题,本发明的目的是提供一种富文本设置多倍行距的方法,能调整富文本中的上下边距,避免富文本内容遮挡的情况。
本发明采用以下方案实现:一种富文本设置多倍行距的方法,所述方法包括如下步骤:
步骤S1、将纯文本组件和图片组件组成的富文本添加到界面上;
步骤S2、比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
步骤S3、根据纯文本的字体类型,获取每一行的纯文本位置;
步骤S4、根据设置的行距倍数和图片确定富文本实际每一行的高度;
步骤S5、将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
步骤S6、根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
进一步的,所述步骤S1具体为:将纯文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应纯文本的字体类型;通过纯文本的字体类型,能获取到纯文本时的富文本高度。
进一步的,所述步骤S2具体为:获取当前富文本的字体类型,根据字体类型得出纯文本组件的高度;接着,获取图片组件中所有图片的高度;将所有图片的高度进行比较,获取最高的图片高度;将最高的图片高度,与纯文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认高度。
进一步的,所述步骤S3具体为:由于多倍行距是以纯文本的字体类型的高度作为标准的,则要根据字体类型,来确定每一行的纯文本位置,该纯文本位置作为一个基本参照位置值;下一行的位置为上一行纯文本的位置加上上一行文本的高度;以此类推能获得每一行的纯文本位置。
进一步的,所述步骤S4具体为:根据设置的行距倍数来确定实际每一行的高度;如果只是纯文本组件,不存在图片组件的话,则直接将文本高度乘以行距倍数,得出实际每一行的高度;如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度;然后将最高的图片高度,与乘以行距倍数的文本组件高度进行对比;如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度;如果是一倍行距,则直接由所述默认高度作为实际每一行的高度。
进一步的,所述步骤S5具体为:确定完每一行的高度后,接着通过碰撞检测方式来避免行重叠,确定实际每一行的位置,该碰撞检测方式主要采用逐像素比较的方式来进行碰撞检测,使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据所述纯文本位置和步骤S4中得出的实际每一行的高度,行的宽度形成一个文本矩形;并保存该文本矩形的像素占用信息;所述行的宽度的值设置为当前行的最大宽度值,当前行的最大宽度值通过获取文本行的宽度来获得;在确定纯文本位置时,将纯文本的像素占用信息与界面中对应位置的像素信息做对比,遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试,经过多次尝试后直到两者像素数组都不存在相同点,则此时根据具体的行距高度即能确定实际每一行的位置;在确定完文本位置后,更新界面对应位置的像素占用信息。
本发明还提供了一种富文本设置多倍行距的系统,所述系统包括:富文本添加模块、默认高度获取模块、纯文本位置获取模块、行实际高度获取模块、重叠处理模块、以及放置处理模块;
所述富文本添加模块,将纯文本组件和图片组件组成的富文本添加到界面上;
所述默认高度获取模块,比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
所述纯文本位置获取模块,根据纯文本的字体类型,获取每一行的纯文本位置;
所述行实际高度获取模块,根据设置的行距倍数和图片确定富文本实际每一行的高度;
所述重叠处理模块,将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
所述放置处理模块,根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
所述富文本添加模块具体为:将纯文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应纯文本的字体类型;通过纯文本的字体类型,能获取到纯文本时的富文本高度。
所述默认高度获取模块具体为:获取当前富文本的字体类型,根据字体类型得出纯文本组件的高度;接着,获取图片组件中所有图片的高度;将所有图片的高度进行比较,获取最高的图片高度;将最高的图片高度,与纯文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认高度。
所述纯文本位置获取模块具体为:由于多倍行距是以纯文本的字体类型的高度作为标准的,则要根据字体类型,来确定每一行的纯文本位置,该纯文本位置作为一个基本参照位置值;下一行的位置为上一行纯文本的位置加上上一行文本的高度;以此类推能获得每一行的纯文本位置。
所述行实际高度获取模块具体为:根据设置的行距倍数来确定实际每一行的高度;如果只是纯文本组件,不存在图片组件的话,则直接将文本高度乘以行距倍数,得出实际每一行的高度;如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度;然后将最高的图片高度,与乘以行距倍数的文本组件高度进行对比;如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度;如果是一倍行距,则直接由所述默认高度作为实际每一行的高度。
所述重叠处理模块具体为:确定完每一行的高度后,接着通过碰撞检测方式来避免行重叠,确定实际每一行的位置,该碰撞检测方式主要采用逐像素比较的方式来进行碰撞检测,使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据所述纯文本位置和行实际高度获取模块中得出的实际每一行的高度,行的宽度形成一个文本矩形;并保存该文本矩形的像素占用信息;所述行的宽度的值设置为当前行的最大宽度值,当前行的最大宽度值通过获取文本行的宽度来获得;在确定纯文本位置时,将纯文本的像素占用信息与界面中对应位置的像素信息做对比,遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试,经过多次尝试后直到两者像素数组都不存在相同点,则此时根据具体的行距高度即能确定实际每一行的位置;在确定完文本位置后,更新界面对应位置的像素占用信息。
本发明的有益效果在于:本发明主要是通过获取纯文本字体的多倍文本高度和图片的高度进行比对,获取到实际行需要的高度。再将每一行的富文本内容根据位置和宽高,形成富文本矩形,跟下一行的富文本矩形进行碰撞检测,采用逐像素比较的方法,确定下一行富文本矩形的实际位置;最后将所有行的富文本的位置按照实际位置进行不重叠地放置,实现富文本多倍行距的功能。本发明可以调整富文本内容的垂直间距,让富文本内容更加美观和易读,提供更好的可读性和可视化效果,帮助用户更好地理解和处理信息,也可以增强文档的呈现效果,提高交互效果和用户体验。
附图说明
图1是本发明的方法流程示意图。
图2是本发明的系统框架原理图。
具体实施方式
下面结合附图对本发明做进一步说明。
请参阅图1所示,本发明的一种富文本设置多倍行距的方法,所述方法包括如下步骤:
步骤S1、将纯文本组件和图片组件组成的富文本添加到界面上;
步骤S2、比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
步骤S3、根据纯文本的字体类型,获取每一行的纯文本位置;
步骤S4、根据设置的行距倍数和图片确定富文本实际每一行的高度;
步骤S5、将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
步骤S6、根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
下面结合一具体实施例对本发明做进一步说明:
本发明的一种富文本设置多倍行距的方法,该方法为:1.将文本组件和图片组件组成的富文本添加到界面上;
首先,将文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应文本的字体类型。通过文本的字体类型,可以获取到纯文本时的富文本高度。
2.比较富文本中文本组件和图片组件的高度,获取每一行的默认高度;
获取当前富文本的字体类型,根据字体类型计算出文本组件的高度。接着,获取图片组件中所有图片的高度。将所有图片的高度进行比较,获取最高的图片高度。将最高的图片高度,与文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认行高。
3.根据纯文本的字体类型,获取每一行的纯文本位置;
由于多倍行距是以文本的字体类型的高度作为标准的,所以需要根据字体类型,来确定每一行的纯文本位置,作为一个基本参照位置值。下一行的位置为上一行文本的位置加上上一行文本的高度。就比如字体Font12的高度是20px(px为像素),则一倍行距是20px,两倍行距为40px。第一行文本的默认位置为0,第二行的文本位置为第一行文本的高度加上0,第三行的位置为第二行的位置加上第二行的行高,以此类推可以计算出每一行的纯文本位置。
4.根据设置的行距倍数和图片确定实际每一行的高度;
根据设置的行距倍数来确定实际每一行的高度。如果只是纯文本组件,不存在图片组件的话,则可以直接将文本高度乘以行距倍数,得出实际行的高度。如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度。然后将最高的图片高度,与乘以行距倍数的文本组件高度(这里使用多倍文本组件高度来表示)进行对比。如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度。如果是一倍行距(默认行距),则直接由第2步的即可确定实际行的高度。
5.将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
确定完每一行的高度后,接着需要通过碰撞检测算法来避免行重叠,确定实际每一行的位置。就比如文本高度为10px,图片高度为30px。如果当前设置两倍行距则为20px,但是图片高度超过了这个两倍行距。如果第一行高度为20px,第二行位置应该为20px的位置,但是图片高度为30px,超过了20px的位置,为了避免富文本内容重叠,实际的行位置需要向下偏移,实际的位置需要为30px。
本发明主要采用逐像素比较的方式来进行碰撞检测。使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据第3步计算出的纯文本位置和以及第4步得出的实际每一行的高度,行的宽度;所述行的宽度的值设置为当前行的最大宽度值,因为是设置行距,需要在宽度为固定基准的情况下去比较行的高度值,行的最大宽度值可以直接获取文本行的宽度获得。形成一个文本矩形(通过位置和宽高可以组成一个矩形)。并保存该文本矩形的像素占用信息。在确定文本位置时,将文本的像素占用信息与界面中对应位置的像素信息做对比。遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试。经过多次尝试后直到两者像素数组都不存在相同点,就可以根据具体的行距高度来确定实际每一行的位置。在确定完文本位置后,更新界面对应位置的像素占用信息。
6.根据计算的实际每一行的位置,将富文本内容进行放置;
最后,根据计算的实际每一行的位置,将富文本内容进行放置,最后可以保证富文本内容不重叠的情况实现多倍行距的功能。
请参阅图2所示,本发明还提供了一种富文本设置多倍行距的系统,所述系统包括:富文本添加模块、默认高度获取模块、纯文本位置获取模块、行实际高度获取模块、重叠处理模块、以及放置处理模块;
所述富文本添加模块,将纯文本组件和图片组件组成的富文本添加到界面上;
所述默认高度获取模块,比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
所述纯文本位置获取模块,根据纯文本的字体类型,获取每一行的纯文本位置;
所述行实际高度获取模块,根据设置的行距倍数和图片确定富文本实际每一行的高度;
所述重叠处理模块,将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
所述放置处理模块,根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
所述富文本添加模块具体为:将纯文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应纯文本的字体类型;通过纯文本的字体类型,能获取到纯文本时的富文本高度。
所述默认高度获取模块具体为:获取当前富文本的字体类型,根据字体类型得出纯文本组件的高度;接着,获取图片组件中所有图片的高度;将所有图片的高度进行比较,获取最高的图片高度;将最高的图片高度,与纯文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认高度。
所述纯文本位置获取模块具体为:由于多倍行距是以纯文本的字体类型的高度作为标准的,则要根据字体类型,来确定每一行的纯文本位置,该纯文本位置作为一个基本参照位置值;下一行的位置为上一行纯文本的位置加上上一行文本的高度;以此类推能获得每一行的纯文本位置。
所述行实际高度获取模块具体为:根据设置的行距倍数来确定实际每一行的高度;如果只是纯文本组件,不存在图片组件的话,则直接将文本高度乘以行距倍数,得出实际每一行的高度;如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度;然后将最高的图片高度,与乘以行距倍数的文本组件高度进行对比;如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度;如果是一倍行距,则直接由所述默认高度作为实际每一行的高度。
所述重叠处理模块具体为:确定完每一行的高度后,接着通过碰撞检测方式来避免行重叠,确定实际每一行的位置,该碰撞检测方式主要采用逐像素比较的方式来进行碰撞检测,使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据所述纯文本位置和行实际高度获取模块中得出的实际每一行的高度,行的宽度形成一个文本矩形;并保存该文本矩形的像素占用信息;所述行的宽度的值设置为当前行的最大宽度值,因为是设置行距,需要在宽度为固定基准的情况下去比较行的高度值,行的最大宽度值可以直接获取文本行的宽度获得。在确定纯文本位置时,将纯文本的像素占用信息与界面中对应位置的像素信息做对比,遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试,经过多次尝试后直到两者像素数组都不存在相同点,则此时根据具体的行距高度即能确定实际每一行的位置;在确定完文本位置后,更新界面对应位置的像素占用信息。
下面结合一应用场景对本发明做进一步说明:
本发明的一种富文本设置多倍行距的系统,在设置富文本内容时,经常需要同时设置文本和图片。首先,将文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应文本的字体类型。通过文本的字体类型,可以获取到纯文本时的富文本高度。就比如字体Font12的高度是20px,Font16的高度为40px。
接着,需要获取每一行的默认高度。对于纯文本字体,高度即为其文本字体的高度;而对于文本和图片同时存在的富文本,则取决于两者中的最高高度。就比如这一行有文本和两张图片,使用的字体Font12的高度为20px,第一张图片的高度是16px,第二张图片的高度为26px,则最后该行的高度为最高的高度26px。
由于多倍行距是以文本的字体类型的高度作为标准的,所以需要根据字体类型,来确定每一行的纯文本位置,作为一个基本参照位置值。下一行的位置为上一行文本的位置加上上一行文本的高度。就比如字体Font12的高度是20px,则一倍行距是20px,两倍行距为40px。如果设置两倍行距,第一行文本的默认位置为0,第二行的文本位置为第一行文本的高度加上0,即第二行的位置值为40px,第三行的位置为第二行的位置加上第二行的行高,即第三行的位置值为80px,以此类推,可以计算出每一行的纯文本位置。
然后,根据设置的行距倍数来确定实际每一行的高度。如果只是纯文本组件,不存在图片组件的话,则可以直接将文本高度乘以行距倍数,得出实际行的高度。如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度。然后将最高的图片高度,与乘以行距倍数的文本组件高度(这里使用多倍文本组件高度来表示)进行对比。如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度。比如设置两倍行距的高度为40px,图片高度为20px,则取40px作为行高,若图片高度为50px,则取50px作为行高。
确定完每一行的高度以及纯文本位置后,接着需要通过碰撞检测算法来避免行重叠,确定实际每一行的位置。就比如文本高度为10px,图片高度为30px。如果当前设置两倍行距则为20px,但是图片高度超过了这个两倍行距。如果第一行高度为20px,第二行位置应该为20px的位置,但是图片高度为30px,超过了20px的位置,为了避免富文本内容重叠,实际的行位置需要向下偏移,实际的位置需要为30px。
主要采用逐像素比较的方式来进行碰撞检测。使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据前面计算出的纯文本位置和以及第4步得出的实际每一行的高度,行的宽度;所述行的宽度的值设置为当前行的最大宽度值,因为是设置行距,需要在宽度为固定基准的情况下去比较行的高度值,行的最大宽度值可以直接获取文本行的宽度获得。形成一个文本矩形(通过位置和宽高可以组成一个矩形)。并保存该文本矩形的像素占用信息。在确定文本位置时,将文本的像素占用信息与界面中对应位置的像素信息做对比。遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试。经过多次尝试后直到两者像素数组都不存在相同点,就可以根据具体的行距高度来确定实际每一行的位置。在确定完文本位置后,更新界面对应位置的像素占用信息。
最后,根据计算的实际每一行的位置,将对应文本和图片进行放置,最后可以保证富文本内容不重叠的情况实现多倍行距的功能。
以上所述仅为本发明的较佳实施例,凡依本发明申请专利范围所做的均等变化与修饰,皆应属本发明的涵盖范围。
Claims (12)
1.一种富文本设置多倍行距的方法,其特征在于:所述方法包括如下步骤:
步骤S1、将纯文本组件和图片组件组成的富文本添加到界面上;
步骤S2、比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
步骤S3、根据纯文本的字体类型,获取每一行的纯文本位置;
步骤S4、根据设置的行距倍数和图片确定富文本实际每一行的高度;
步骤S5、将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
步骤S6、根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
2.根据权利要求1所述的一种富文本设置多倍行距的方法,其特征在于:所述步骤S1具体为:将纯文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应纯文本的字体类型;通过纯文本的字体类型,能获取到纯文本时的富文本高度。
3.根据权利要求1所述的一种富文本设置多倍行距的方法,其特征在于:所述步骤S2具体为:获取当前富文本的字体类型,根据字体类型得出纯文本组件的高度;接着,获取图片组件中所有图片的高度;将所有图片的高度进行比较,获取最高的图片高度;将最高的图片高度,与纯文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认高度。
4.根据权利要求1所述的一种富文本设置多倍行距的方法,其特征在于:所述步骤S3具体为:由于多倍行距是以纯文本的字体类型的高度作为标准的,则要根据字体类型,来确定每一行的纯文本位置,该纯文本位置作为一个基本参照位置值;下一行的位置为上一行纯文本的位置加上上一行文本的高度;以此类推能获得每一行的纯文本位置。
5.根据权利要求1所述的一种富文本设置多倍行距的方法,其特征在于:所述步骤S4具体为:根据设置的行距倍数来确定实际每一行的高度;如果只是纯文本组件,不存在图片组件的话,则直接将文本高度乘以行距倍数,得出实际每一行的高度;如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度;然后将最高的图片高度,与乘以行距倍数的文本组件高度进行对比;如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度;如果是一倍行距,则直接由所述默认高度作为实际每一行的高度。
6.根据权利要求1所述的一种富文本设置多倍行距的方法,其特征在于:所述步骤S5具体为:确定完每一行的高度后,接着通过碰撞检测方式来避免行重叠,确定实际每一行的位置,该碰撞检测方式主要采用逐像素比较的方式来进行碰撞检测,使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据所述纯文本位置和步骤S4中得出的实际每一行的高度,行的宽度形成一个文本矩形;并保存该文本矩形的像素占用信息;所述行的宽度的值设置为当前行的最大宽度值,当前行的最大宽度值通过获取文本行的宽度来获得;在确定纯文本位置时,将纯文本的像素占用信息与界面中对应位置的像素信息做对比,遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试,经过多次尝试后直到两者像素数组都不存在相同点,则此时根据具体的行距高度即能确定实际每一行的位置;在确定完文本位置后,更新界面对应位置的像素占用信息。
7.一种富文本设置多倍行距的系统,其特征在于:所述系统包括:富文本添加模块、默认高度获取模块、纯文本位置获取模块、行实际高度获取模块、重叠处理模块、以及放置处理模块;
所述富文本添加模块,将纯文本组件和图片组件组成的富文本添加到界面上;
所述默认高度获取模块,比较界面内富文本中纯文本组件和图片组件的高度,获取富文本每一行的默认高度;
所述纯文本位置获取模块,根据纯文本的字体类型,获取每一行的纯文本位置;
所述行实际高度获取模块,根据设置的行距倍数和图片确定富文本实际每一行的高度;
所述重叠处理模块,将每一行的富文本内容的纯文本位置、实际每一行的高度、以及行的宽度,形成富文本矩形,将富文本矩形通过碰撞检测方式来避免富文本的行重叠,重新获取富文本实际每一行的位置;
所述放置处理模块,根据富文本实际每一行的位置,将富文本内容进行放置,保证富文本内容不重叠从而实现设置多倍行距的功能。
8.根据权利要求7所述的一种富文本设置多倍行距的系统,其特征在于:所述富文本添加模块具体为:将纯文本组件和图片组件组成的富文本添加到界面上,在界面上按行进行一行行排列,并设置对应纯文本的字体类型;通过纯文本的字体类型,能获取到纯文本时的富文本高度。
9.根据权利要求7所述的一种富文本设置多倍行距的系统,其特征在于:所述默认高度获取模块具体为:获取当前富文本的字体类型,根据字体类型得出纯文本组件的高度;接着,获取图片组件中所有图片的高度;将所有图片的高度进行比较,获取最高的图片高度;将最高的图片高度,与纯文本组件高度进行对比,比较出两者最高的高度,最高的高度则为当前行的默认高度。
10.根据权利要求7所述的一种富文本设置多倍行距的系统,其特征在于:所述纯文本位置获取模块具体为:由于多倍行距是以纯文本的字体类型的高度作为标准的,则要根据字体类型,来确定每一行的纯文本位置,该纯文本位置作为一个基本参照位置值;下一行的位置为上一行纯文本的位置加上上一行文本的高度;以此类推能获得每一行的纯文本位置。
11.根据权利要求7所述的一种富文本设置多倍行距的系统,其特征在于:所述行实际高度获取模块具体为:根据设置的行距倍数来确定实际每一行的高度;如果只是纯文本组件,不存在图片组件的话,则直接将文本高度乘以行距倍数,得出实际每一行的高度;如果同时设置文本组件和图片组件,需要获取图片组件中所有图片的高度,通过比较高度,获取最高的图片高度;然后将最高的图片高度,与乘以行距倍数的文本组件高度进行对比;如果多倍文本组件高度高于图片组件高度,则实际行的高度为多倍文本组件高度,如果图片高度高于多倍文本组件高度,则实际行的高度为图片组件高度;如果是一倍行距,则直接由所述默认高度作为实际每一行的高度。
12.根据权利要求7所述的一种富文本设置多倍行距的系统,其特征在于:所述重叠处理模块具体为:确定完每一行的高度后,接着通过碰撞检测方式来避免行重叠,确定实际每一行的位置,该碰撞检测方式主要采用逐像素比较的方式来进行碰撞检测,使用一个数组来记录整个界面中每个像素点的占用情况,每一行富文本内容则根据所述纯文本位置和行实际高度获取模块中得出的实际每一行的高度,行的宽度形成一个文本矩形;并保存该文本矩形的像素占用信息;所述行的宽度的值设置为当前行的最大宽度值,当前行的最大宽度值通过获取文本行的宽度来获得;在确定纯文本位置时,将纯文本的像素占用信息与界面中对应位置的像素信息做对比,遍历两者像素数组,如果两者像素存在相同点,则存在重叠情况,需要将文本矩形向下偏移,寻找下一个放置点尝试,经过多次尝试后直到两者像素数组都不存在相同点,则此时根据具体的行距高度即能确定实际每一行的位置;在确定完文本位置后,更新界面对应位置的像素占用信息。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310712513.4A CN116861849A (zh) | 2023-06-15 | 2023-06-15 | 一种富文本设置多倍行距的方法及其系统 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202310712513.4A CN116861849A (zh) | 2023-06-15 | 2023-06-15 | 一种富文本设置多倍行距的方法及其系统 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN116861849A true CN116861849A (zh) | 2023-10-10 |
Family
ID=88233114
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202310712513.4A Pending CN116861849A (zh) | 2023-06-15 | 2023-06-15 | 一种富文本设置多倍行距的方法及其系统 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN116861849A (zh) |
-
2023
- 2023-06-15 CN CN202310712513.4A patent/CN116861849A/zh active Pending
Similar Documents
Publication | Publication Date | Title |
---|---|---|
US20200151444A1 (en) | Table Layout Determination Using A Machine Learning System | |
US7676744B2 (en) | Automated markup language layout | |
US9563630B2 (en) | Dimensional conversion in presentations | |
CN101246550B (zh) | 图像文字识别方法及装置 | |
US9489757B2 (en) | Resizable text backing shapes for digital images | |
US20150103092A1 (en) | Continuous Image Optimization for Responsive Pages | |
US9734132B1 (en) | Alignment and reflow of displayed character images | |
CN110598140A (zh) | 页面调整方法、装置及服务器 | |
US20220172501A1 (en) | Asides detection in documents | |
CN115237522A (zh) | 页面自适应展示方法及装置 | |
CN105389308B (zh) | 网页的显示处理方法及装置 | |
US9256592B1 (en) | System for detecting and correcting broken words | |
CN112416340B (zh) | 基于草图的网页生成方法和系统 | |
CN113762235A (zh) | 检测页面叠加区域的方法和装置 | |
CN104424174A (zh) | 文档处理系统和文档处理方法 | |
CN116861849A (zh) | 一种富文本设置多倍行距的方法及其系统 | |
CN103136185B (zh) | 块式排版的方法和装置 | |
CN111310082B (zh) | 一种页面显示方法和装置 | |
CN106558019B (zh) | 图片排列方法及装置 | |
US7532216B2 (en) | Method of scaling a graphic character | |
US8988423B2 (en) | Electronic album generating apparatus, stereoscopic image pasting apparatus, and methods and programs for controlling operation of same | |
JP4040905B2 (ja) | 縮小画像表示装置、方法、プログラムおよびプログラムを記録した記録媒体 | |
JP6152633B2 (ja) | 表示制御装置及びプログラム | |
CN106488314A (zh) | 一种弹幕渲染方法 | |
CN113190147A (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 |