CN115239850A - 一种适配开发的线性图标管理方法和装置 - Google Patents
一种适配开发的线性图标管理方法和装置 Download PDFInfo
- Publication number
- CN115239850A CN115239850A CN202210906996.7A CN202210906996A CN115239850A CN 115239850 A CN115239850 A CN 115239850A CN 202210906996 A CN202210906996 A CN 202210906996A CN 115239850 A CN115239850 A CN 115239850A
- Authority
- CN
- China
- Prior art keywords
- icon
- linear
- svg
- track
- icons
- 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
Images
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/60—Editing figures and text; Combining figures or text
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/50—Information retrieval; Database structures therefor; File system structures therefor of still image data
- G06F16/51—Indexing; Data structures therefor; Storage structures
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
- G06F16/50—Information retrieval; Database structures therefor; File system structures therefor of still image data
- G06F16/55—Clustering; Classification
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/001—Texturing; Colouring; Generation of texture or colour
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Databases & Information Systems (AREA)
- General Engineering & Computer Science (AREA)
- Software Systems (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明提供了一种适配开发的线性图标管理方法和装置,属于大数据,该方法包括:上传线性svg图标,对线性svg图标进行打标签,构成图标库;确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;根据输出图标的标签,向用户提供引用路径。本发明提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格。
Description
技术领域
本发明涉及大数据技术领域,尤其涉及一种适配开发的线性图标管理方法和装置。
背景技术
本部分旨在为权利要求书中陈述的本发明的实施方式提供背景或上下文。此处的描述不因为包括在本部分中就承认是现有技术。
软件中应用了大量的图标,开发者通常用线上图标库来管理软件中使用到的图标,如果同一图标需要应用在不同地方,可通过引用图标库的方式,此种多处引用同一图标的方式节约了存储空间,也方便图标修改后实现多处统一替换;但如果遇到形状完全相同但颜色或粗细、大小不同的图标,则需要引用、存储多个图标,不但需要大量存储空间,也会占用大量的流量资源,甚至导致图标加载失败影响体验,大量的图标也不利于开发者图标的管理。
另一方面,在界面设计中,对于通用性很高的基础图标,设计师会在图标库内搜索进行下载,应用在界面设计中。但现阶段的图标库仅能对图标的大小、颜色进行改变,无法对线性图标的粗细进行调整,需要单个下载源文件后通过设计软件逐个调整,最后形成统一风格的图标,再导出给开发者上传至图标库,每次改动需要耗费大量的工作成本。
因此,如何提供一种新的方案,其能够解决上述技术问题是本领域亟待解决的技术难题。
发明内容
本发明实施例提供一种适配开发的线性图标管理方法,提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格,该方法包括:
上传线性svg图标,对线性svg图标进行打标签,构成图标库;
确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
根据输出图标的标签,向用户提供引用路径。
本发明实施例还提供一种适配开发的线性图标管理装置,包括:
打标签模块,用于上传线性svg图标,对线性svg图标进行打标签,构成图标库;
线性svg图标的轨迹确定模块,用于确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
初始化模块,用于将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
输出图标确定模块,用于响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
引用模块,用于根据输出图标的标签,向用户提供引用路径。
本发明实施例还提供一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,所述处理器执行所述计算机程序时实现上述一种适配开发的线性图标管理方法。
本发明实施例还提供一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现上述一种适配开发的线性图标管理方法。
本发明实施例还提供一种计算机程序产品,所述计算机程序产品包括计算机程序,所述计算机程序被处理器执行时实现上述一种适配开发的线性图标管理方法。
本发明实施例提供的一种适配开发的线性图标管理方法和装置,包括:上传线性svg图标,对线性svg图标进行打标签,构成图标库;确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;根据输出图标的标签,向用户提供引用路径。提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格。解决了线性图标风格的批量管理与引用的问题,使用上更加灵活。可统一图标风格为成套图标,可修改线性图标的风格:在颜色、大小、格式的基础上增加了图标粗细的修改,无需通过设计软件进行重绘;打破了现在图标库既定样式需要设计软件修改风格的现状,不仅可对图标的颜色、大小进行修改,还可进行粗细的自由变化,有助于形成统一风格。
附图说明
为了更清楚地说明本发明实施例或现有技术中的技术方案,下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。在附图中:
图1为本发明实施例一种适配开发的线性图标管理方法示意图。
图2为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图。
图3为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图。
图4为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图。
图5为运行本发明实施的一种适配开发的线性图标管理方法的计算机设备示意图。
图6为本发明实施例一种适配开发的线性图标管理装置示意图。
具体实施方式
为使本发明实施例的目的、技术方案和优点更加清楚明白,下面结合附图对本发明实施例做进一步详细说明。在此,本发明的示意性实施例及其说明用于解释本发明,但并不作为对本发明的限定。
图1为本发明实施例一种适配开发的线性图标管理方法示意图,如图1所示,本发明实施例提供一种适配开发的线性图标管理方法,提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格,该方法包括:
步骤101:上传线性svg图标,对线性svg图标进行打标签,构成图标库;
步骤102:确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
步骤103:将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
步骤104:响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
步骤105:根据输出图标的标签,向用户提供引用路径。
本发明实施例提供的一种适配开发的线性图标管理方法,包括:上传线性svg图标,对线性svg图标进行打标签,构成图标库;确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;根据输出图标的标签,向用户提供引用路径。提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格。解决了线性图标风格的批量管理与引用的问题,使用上更加灵活。可统一图标风格为成套图标,可修改线性图标的风格:在颜色、大小、格式的基础上增加了图标粗细的修改,无需通过设计软件进行重绘;打破了现在图标库既定样式需要设计软件修改风格的现状,不仅可对图标的颜色、大小进行修改,还可进行粗细的自由变化,有助于形成统一风格。
在本发明实施例中,涉及的专业词汇如下:
线性图标:是一种以线条构成的图标样式。
svg:一种图形格式,即可缩放矢量图形(Scalable Vector Graphics),是一种XML应用,用简洁、可移植的形式表示图形信息。
当前的图标库种类繁多,例如iconfinder,easyicon,Font Awesome,应用较多是iconfont,仅能改变图标的大小、颜色,以及下载格式。但是,对于开发者来说,不能直接引用,需要设计师提供切图,或开发者制作成字体图标,开发者上传至产品自己的图标库进行管理;对于设计师来说,仅能下载单一颜色和尺寸的图标,无法对图标的粗细进行调整,也不能批量下载。
现有图标库无法调整线性图标的粗细,不能对多个图标统一风格形成成套图标并进行批量管理。
修改图标粗细需要单独下载图标的源文件,设计师通过设计软件进行修改,成本较高,有些图标因为图形内部的嵌套关系,无法直接修改,需要用设计软件重新绘制,工作量大。成套的图标通常情况下颜色、大小、粗细一致,但现有的图标库,需要一一下载,再进行修改、重绘,效率低。
具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,包括:
上传线性svg图标,对线性svg图标进行打标签,构成图标库;
确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
根据输出图标的标签,向用户提供引用路径。
本发明实施例解决了线性图标风格的批量管理与引用的问题,使用上更加灵活。可统一图标风格为成套图标,可修改线性图标的风格:在颜色、大小、格式的基础上增加了图标粗细的修改,无需通过设计软件进行重绘;打破了现在图标库既定样式需要设计软件修改风格的现状,不仅可对图标的颜色、大小进行修改,还可进行粗细的自由变化,有助于形成统一风格。
图2为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图,如图2所示,具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,上传线性svg图标,对线性svg图标进行打标签,构成图标库,包括:
步骤201:响应于用户对线性svg图标的上传,得到线性svg图标;
步骤202:线性svg图标通过title元素的内容定义svg标签,通过xmlns属性定义svg的文件名的命名空间以作为鼠标指针指向图标时的提示,完成对线性svg图标进行打标签;
步骤203:将完成打标签的线性svg图标按照文件名归类,构成图标库。
实施例中,往云端服务器上传线性svg图标,为上传的svg图标进行打标签,通过<title>元素的内容定义svg标签,同时作为鼠标指针指向图像时的提示,通过xmlns属性定义了SVG的命名空间。1.为svg图标打标签,实现上传svg图标后文件名归类,构成图标库。
图3为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图,如图3所示,具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹,包括:
步骤301:对线性svg图标的线段进行轨迹描摹,获取轨迹的断点坐标,确定线性svg图标的线段轨迹坐标;
步骤302:根据线性svg图标的线段轨迹坐标,进行矢量连线,确定线性svg图标的轨迹。
实施例中,对上传线性svg图标的线段进行描摹,掌握轨迹的断点坐标,根据线性svg图标的线段轨迹坐标,进行矢量连线,确定线性svg图标的轨迹。
具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化,包括:
通过stroke-width设置线性svg图标的轨迹的粗细值的初始值为1px;
在style属性中将线性svg图标的颜色初始值设置为黑色;
以像素为单位,将线性svg图标的尺寸大小的初始值设置成长度和宽度为32*32px。
实施例中,统一svg图形轨迹:对svg轨迹描摹,对其进行默认参数调整,即颜色为黑色,尺寸大小为32*32px,轨迹粗细值为1px。
图4为本发明实施例一种适配开发的线性图标管理方法的一个实施例示意图,如图4所示,具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标,包括:
步骤401:响应于用户输入的对线性svg图标的风格要求,对用户输入的对线性svg图标的风格要求拆解为轨迹的粗细值要求、颜色要求和尺寸大小要求;
步骤402:调整线性svg图标的轨迹的粗细值的初始值与轨迹的粗细值要求匹配;
步骤403:调整线性svg图标的颜色初始值与颜色要求匹配;
步骤404:调整线性svg图标的尺寸大小的初始值与尺寸大小要求匹配;
步骤405:根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标。
实施例中,响应于用户输入的对线性svg图标的风格要求,对用户输入的对线性svg图标的风格要求拆解为轨迹的粗细值要求、颜色要求和尺寸大小要求;匹配颜色:在style属性中,默认颜色为stroke:black,可根据自定义要求任意指定颜色色值。匹配尺寸大小:svg以像素为单位定义了整个图标的width和height,通常情况图标为正方形即长款相等。匹配粗细:通过stroke-width设置线段的粗细,也是以像素为单位,可选择已设置好的常用默认值,即常规(1px),中粗(1.5px),粗(2px),也可根据图片尺寸与风格需求可设置任意值。
具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标,包括:
若用户输入的对线性svg图标的风格要求中还包括填充底图要求,则根据填充底图要求进行底图填充,设定填充底图的颜色和尺寸大小,确定输出填充底图;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,结合输出填充底图,确定面性输出图标;
若用户输入的对线性svg图标的风格要求中不包括填充底图要求,则根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定线性输出图标。
具体实施本发明实施例提供的一种适配开发的线性图标管理方法时,在一个实施例中,还包括:对初始化的线性svg图标进行批量选择,对批量选择的线性svg图标进行轨迹的粗细值、颜色和尺寸大小的统一修改。
实施例中,用户输入的对线性svg图标的风格要求中还可以包括填充底图要求,若用户输入的对线性svg图标的风格要求中还包括填充底图要求,则根据填充底图要求进行底图填充,设定填充底图的颜色和尺寸大小,确定输出填充底图;根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,结合输出填充底图,确定面性输出图标。
若用户输入的对线性svg图标的风格要求中不包括填充底图要求,则根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定线性输出图标。
具体的,还可以设置填充底图:可选择矩形rect、圆形ellipse、环形circle进行底图填充,可对底图的颜色、大小进行设置。如仅需线性图标,则无底图直接显示第三步的线性图标,即为fill:none,此步骤忽略。可对所需图标进行勾选,对其颜色color、大小width/height、粗细stoke-width的值进行改变。如需要简单的面性图标,则可选圆形或方形(基础图形)进行底图填充,可分别设置线性图标与底图的大小、颜色,以及线性图标的粗细。
可统一图标风格为成套图标,可进行简单的面性图标生成,批量引用和下载。批量管理和引用,批量勾选多个所需图标进行统一的颜色、大小、粗细修改,提高了多个图标组成成套图标的效率;同时引用成套图标,只需一处配置,即可实现多个图标外观风格的修改。易于扩展,不仅仅适用于线性图标,也可增加背景基础图自由组合为面性图标,对多个图标可一次性统一风格样式,成套导出引用,可兼顾多种视觉设计效果。也可生成简单的面性图标并进行图形粗细的调整,并且方便成套图标的引用和下载,使用上更加灵活。
实施例中,根据输出图标的标签,向用户提供引用路径,可以是将设置好的输出图标转化为字体图标,可进行引用和下载;通过标签<title>元素进行引用。
本发明实施例图标风格的改变包括统一线性图标的粗细、颜色、大小,可增加底图成为面性图标。多图标成套引用包括对多个图标的勾线,可自行搭配成套,通过对风格的配置以标签导出的方式进行引用。
下面结合具体场景,对本发明实施例提供的一种适配开发的线性图标管理方法进行简要描述:
在一个实例中,往云端服务器上传线性svg图标,形成图标库,通过打标签的方式实现文件名归类。对上传线性svg图标的线段进行描摹,掌握轨迹的断点坐标,轨迹的粗细均统一为1px。可对所需图标进行勾选,对其颜色color、大小width/height、粗细stoke-width的值进行改变。如需要简单的面性图标,则可选圆形或方形(基础图形)进行底图填充,可分别设置线性图标与底图的大小、颜色,以及线性图标的粗细。将设置好的图标转化为字体图标,可进行引用和下载。
在一个实例中,为svg图标打标签,实现上传svg图标后文件名归类。标记Svg图标线段轨迹坐标,实现图标粗细值的统一。任意修改图标线条粗细值,以及颜色、尺寸大小,实现图标风格自由修改。可设置填充底图,在以上线性图标的基础上选择增加填充图形,如方形圆形,可修改填充底图的颜色、尺寸大小,实现面性填充图标。对多个图标统一修改和引用,实现以上步骤的图标与填充底图的任意调整。
在一个实例中,打标签:为上传的svg图标进行打标签,通过<title>元素的内容定义svg标签,同时作为鼠标指针指向图像时的提示,通过xmlns属性定义了SVG的命名空间。统一svg图形轨迹:对svg轨迹描摹,对其进行默认参数调整,即颜色为黑色,尺寸为32*32px,轨迹为1px。定义线性图标的风格:定义颜色:在style属性中,默认颜色为stroke:black,可根据自定义要求任意指定颜色色值。定义大小:svg以像素为单位定义了整个图标的width和height,通常情况图标为正方形即长款相等。定义粗细:通过stroke-width设置线段的粗细,也是以像素为单位,可选择已设置好的常用默认值,即常规(1px),中粗(1.5px),粗(2px),也可根据图片尺寸与风格需求可设置任意值。定义面性图标:对上一步进行调整后,设置填充底图:可选择矩形rect、圆形ellipse、环形circle进行底图填充,可对底图的颜色、大小进行设置。如仅需线性图标,则无底图直接显示第三步的线性图标,即为fill:none,此步骤忽略。多图标统一修改:选择多图标后对其颜色、大小、粗细、底图进行统一修改。引用:通过标签<title>元素进行引用。
图5为运行本发明实施的一种适配开发的线性图标管理方法的计算机设备示意图,如图5所示,本发明实施例还提供一种计算机设备500,包括存储器510、处理器520及存储在存储器上并可在处理器上运行的计算机程序530,所述处理器执行所述计算机程序时实现上述一种适配开发的线性图标管理方法。
本发明实施例还提供一种计算机可读存储介质,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现上述一种适配开发的线性图标管理方法。
本发明实施例还提供一种计算机程序产品,所述计算机程序产品包括计算机程序,所述计算机程序被处理器执行时实现上述一种适配开发的线性图标管理方法。
本发明实施例中还提供了一种适配开发的线性图标管理装置,如下面的实施例所述。由于该装置解决问题的原理与一种适配开发的线性图标管理方法相似,因此该装置的实施可以参见一种适配开发的线性图标管理方法的实施,重复之处不再赘述。
图6为本发明实施例一种适配开发的线性图标管理装置示意图,如图6所示,本发明实施例还提供一种适配开发的线性图标管理装置。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,包括:
打标签模块601,用于上传线性svg图标,对线性svg图标进行打标签,构成图标库;
线性svg图标的轨迹确定模块602,用于确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
初始化模块603,用于将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
输出图标确定模块604,用于响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
引用模块605,用于根据输出图标的标签,向用户提供引用路径。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,打标签模块,具体用于:
响应于用户对线性svg图标的上传,得到线性svg图标;
线性svg图标通过title元素的内容定义svg标签,通过xmlns属性定义svg的文件名的命名空间以作为鼠标指针指向图标时的提示,完成对线性svg图标进行打标签;
将完成打标签的线性svg图标按照文件名归类,构成图标库。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,线性svg图标的轨迹确定模块,具体用于:
对线性svg图标的线段进行轨迹描摹,获取轨迹的断点坐标,确定线性svg图标的线段轨迹坐标;
根据线性svg图标的线段轨迹坐标,进行矢量连线,确定线性svg图标的轨迹。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,初始化模块,具体用于:
通过stroke-width设置线性svg图标的轨迹的粗细值的初始值为1px;
在style属性中将线性svg图标的颜色初始值设置为黑色;
以像素为单位,将线性svg图标的尺寸大小的初始值设置成长度和宽度为32*32px。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,输出图标确定模块,用于:
响应于用户输入的对线性svg图标的风格要求,对用户输入的对线性svg图标的风格要求拆解为轨迹的粗细值要求、颜色要求和尺寸大小要求;
调整线性svg图标的轨迹的粗细值的初始值与轨迹的粗细值要求匹配;
调整线性svg图标的颜色初始值与颜色要求匹配;
调整线性svg图标的尺寸大小的初始值与尺寸大小要求匹配;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,输出图标确定模块,还用于:
若用户输入的对线性svg图标的风格要求中还包括填充底图要求,则根据填充底图要求进行底图填充,设定填充底图的颜色和尺寸大小,确定输出填充底图;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,结合输出填充底图,确定面性输出图标;
若用户输入的对线性svg图标的风格要求中不包括填充底图要求,则根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定线性输出图标。
具体实施本发明实施例提供的一种适配开发的线性图标管理装置时,在一个实施例中,还包括批量修改模块,用于:对初始化的线性svg图标进行批量选择,对批量选择的线性svg图标进行轨迹的粗细值、颜色和尺寸大小的统一修改。
综上,本发明实施例提供的一种适配开发的线性图标管理方法,包括:上传线性svg图标,对线性svg图标进行打标签,构成图标库;确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;根据输出图标的标签,向用户提供引用路径。提高图标库的管理、复用效率,在可任意调整图标的颜色、大小的基础上,针对线性图标进行粗细调整,可以快速改变图标风格。解决了线性图标风格的批量管理与引用的问题,使用上更加灵活。可统一图标风格为成套图标,可修改线性图标的风格:在颜色、大小、格式的基础上增加了图标粗细的修改,无需通过设计软件进行重绘;打破了现在图标库既定样式需要设计软件修改风格的现状,不仅可对图标的颜色、大小进行修改,还可进行粗细的自由变化,有助于形成统一风格。
本发明实施例可统一图标风格为成套图标,可进行简单的面性图标生成,批量引用和下载。批量管理和引用,批量勾选多个所需图标进行统一的颜色、大小、粗细修改,提高了多个图标组成成套图标的效率;同时引用成套图标,只需一处配置,即可实现多个图标外观风格的修改。易于扩展,不仅仅适用于线性图标,也可增加背景基础图自由组合为面性图标,对多个图标可一次性统一风格样式,成套导出引用,可兼顾多种视觉设计效果。也可生成简单的面性图标并进行图形粗细的调整,并且方便成套图标的引用和下载,使用上更加灵活。
本申请技术方案中对数据的获取、存储、使用、处理等均符合国家法律法规的相关规定,本申请获取的个人、客户和人群等相关的个人身份数据、操作数据、行为数据等多种类型的数据,均已获得授权。
本领域内的技术人员应明白,本发明的实施例可提供为方法、系统、或计算机程序产品。因此,本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且,本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
以上所述的具体实施例,对本发明的目的、技术方案和有益效果进行了进一步详细说明,所应理解的是,以上所述仅为本发明的具体实施例而已,并不用于限定本发明的保护范围,凡在本发明的精神和原则之内,所做的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (17)
1.一种适配开发的线性图标管理方法,其特征在于,包括:
上传线性svg图标,对线性svg图标进行打标签,构成图标库;
确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
根据输出图标的标签,向用户提供引用路径。
2.如权利要求1所述的方法,其特征在于,上传线性svg图标,对线性svg图标进行打标签,构成图标库,包括:
响应于用户对线性svg图标的上传,得到线性svg图标;
线性svg图标通过title元素的内容定义svg标签,通过xmlns属性定义svg的文件名的命名空间以作为鼠标指针指向图标时的提示,完成对线性svg图标进行打标签;
将完成打标签的线性svg图标按照文件名归类,构成图标库。
3.如权利要求1所述的方法,其特征在于,确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹,包括:
对线性svg图标的线段进行轨迹描摹,获取轨迹的断点坐标,确定线性svg图标的线段轨迹坐标;
根据线性svg图标的线段轨迹坐标,进行矢量连线,确定线性svg图标的轨迹。
4.如权利要求1所述的方法,其特征在于,将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化,包括:
通过stroke-width设置线性svg图标的轨迹的粗细值的初始值为1px;
在style属性中将线性svg图标的颜色初始值设置为黑色;
以像素为单位,将线性svg图标的尺寸大小的初始值设置成长度和宽度为32*32px。
5.如权利要求4所述的方法,其特征在于,响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标,包括:
响应于用户输入的对线性svg图标的风格要求,对用户输入的对线性svg图标的风格要求拆解为轨迹的粗细值要求、颜色要求和尺寸大小要求;
调整线性svg图标的轨迹的粗细值的初始值与轨迹的粗细值要求匹配;
调整线性svg图标的颜色初始值与颜色要求匹配;
调整线性svg图标的尺寸大小的初始值与尺寸大小要求匹配;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标。
6.如权利要求5所述的方法,其特征在于,根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标,包括:
若用户输入的对线性svg图标的风格要求中还包括填充底图要求,则根据填充底图要求进行底图填充,设定填充底图的颜色和尺寸大小,确定输出填充底图;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,结合输出填充底图,确定面性输出图标;
若用户输入的对线性svg图标的风格要求中不包括填充底图要求,则根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定线性输出图标。
7.如权利要求1所述的方法,其特征在于,还包括:对初始化的线性svg图标进行批量选择,对批量选择的线性svg图标进行轨迹的粗细值、颜色和尺寸大小的统一修改。
8.一种适配开发的线性图标管理装置,其特征在于,包括:
打标签模块,用于上传线性svg图标,对线性svg图标进行打标签,构成图标库;
线性svg图标的轨迹确定模块,用于确定线性svg图标的线段轨迹坐标,得到线性svg图标的轨迹;
初始化模块,用于将线性svg图标的轨迹的粗细值、颜色和尺寸大小进行初始化;
输出图标确定模块,用于响应于用户输入的对线性svg图标的风格要求,对初始化的线性svg图标的轨迹的粗细值、颜色和尺寸大小进行匹配,确定输出图标;
引用模块,用于根据输出图标的标签,向用户提供引用路径。
9.如权利要求8所述的装置,其特征在于,打标签模块,具体用于:
响应于用户对线性svg图标的上传,得到线性svg图标;
线性svg图标通过title元素的内容定义svg标签,通过xmlns属性定义svg的文件名的命名空间以作为鼠标指针指向图标时的提示,完成对线性svg图标进行打标签;
将完成打标签的线性svg图标按照文件名归类,构成图标库。
10.如权利要求8所述的装置,其特征在于,线性svg图标的轨迹确定模块,具体用于:
对线性svg图标的线段进行轨迹描摹,获取轨迹的断点坐标,确定线性svg图标的线段轨迹坐标;
根据线性svg图标的线段轨迹坐标,进行矢量连线,确定线性svg图标的轨迹。
11.如权利要求8所述的装置,其特征在于,初始化模块,具体用于:
通过stroke-width设置线性svg图标的轨迹的粗细值的初始值为1px;
在style属性中将线性svg图标的颜色初始值设置为黑色;
以像素为单位,将线性svg图标的尺寸大小的初始值设置成长度和宽度为32*32px。
12.如权利要求11所述的装置,其特征在于,输出图标确定模块,用于:
响应于用户输入的对线性svg图标的风格要求,对用户输入的对线性svg图标的风格要求拆解为轨迹的粗细值要求、颜色要求和尺寸大小要求;
调整线性svg图标的轨迹的粗细值的初始值与轨迹的粗细值要求匹配;
调整线性svg图标的颜色初始值与颜色要求匹配;
调整线性svg图标的尺寸大小的初始值与尺寸大小要求匹配;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定输出图标。
13.如权利要求12所述的装置,其特征在于,输出图标确定模块,还用于:
若用户输入的对线性svg图标的风格要求中还包括填充底图要求,则根据填充底图要求进行底图填充,设定填充底图的颜色和尺寸大小,确定输出填充底图;
根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,结合输出填充底图,确定面性输出图标;
若用户输入的对线性svg图标的风格要求中不包括填充底图要求,则根据调整后线性svg图标的轨迹的粗细值、颜色和尺寸大小,确定线性输出图标。
14.如权利要求8所述的装置,其特征在于,还包括批量修改模块,用于:对初始化的线性svg图标进行批量选择,对批量选择的线性svg图标进行轨迹的粗细值、颜色和尺寸大小的统一修改。
15.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至7任一所述方法。
16.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质存储有计算机程序,所述计算机程序被处理器执行时实现权利要求1至7任一所述方法。
17.一种计算机程序产品,其特征在于,所述计算机程序产品包括计算机程序,所述计算机程序被处理器执行时实现权利要求1至7任一所述方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210906996.7A CN115239850A (zh) | 2022-07-29 | 2022-07-29 | 一种适配开发的线性图标管理方法和装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202210906996.7A CN115239850A (zh) | 2022-07-29 | 2022-07-29 | 一种适配开发的线性图标管理方法和装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN115239850A true CN115239850A (zh) | 2022-10-25 |
Family
ID=83676809
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202210906996.7A Pending CN115239850A (zh) | 2022-07-29 | 2022-07-29 | 一种适配开发的线性图标管理方法和装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN115239850A (zh) |
Cited By (1)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116679852A (zh) * | 2023-08-03 | 2023-09-01 | 民航成都信息技术有限公司 | 一种项目图标的引用方法、装置、电子设备及介质 |
-
2022
- 2022-07-29 CN CN202210906996.7A patent/CN115239850A/zh active Pending
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN116679852A (zh) * | 2023-08-03 | 2023-09-01 | 民航成都信息技术有限公司 | 一种项目图标的引用方法、装置、电子设备及介质 |
CN116679852B (zh) * | 2023-08-03 | 2023-10-27 | 民航成都信息技术有限公司 | 一种项目图标的引用方法、装置、电子设备及介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
EP3433732B1 (en) | Converting visual diagrams into code | |
CN106507686B (zh) | 设计不同技术领域的复杂信息物理系统的具有其各种软件工件的软件架构的方法和系统 | |
CN102646038B (zh) | 控件内容展现方法、控件内容展现装置以及移动终端 | |
CN110489116A (zh) | 一种页面的渲染方法、装置及计算机存储介质 | |
Demetrescu et al. | Specifying algorithm visualizations: Interesting events or state mapping? | |
US20140310681A1 (en) | Assisted creation of control event | |
CN102930580A (zh) | 数据帧动画 | |
Beeley et al. | Web Application Development with R Using Shiny: Build stunning graphics and interactive data visualizations to deliver cutting-edge analytics | |
US20240160410A1 (en) | Application Development Platform, Micro-program Generation Method, and Device and Storage Medium | |
CN113535165A (zh) | 界面生成方法、装置、电子设备及计算机可读存储介质 | |
CN115239850A (zh) | 一种适配开发的线性图标管理方法和装置 | |
Walczak et al. | Semantic modeling of virtual reality training scenarios | |
CN113448678A (zh) | 应用信息生成方法、部署方法及装置、系统、存储介质 | |
CN113268235B (zh) | 一种智能手表的云端表盘设计方法 | |
CN108845857A (zh) | 一种基于云平台的图标管理方法和装置 | |
CN115618838A (zh) | 报告生成方法及设备 | |
McGreggor | Mastering matplotlib | |
Körner | Data Visualization with D3 and AngularJS | |
CN114089999A (zh) | 一种前端页面生成方法及系统 | |
Milovanovic et al. | Python Data Visualization Cookbook | |
Diehl | Past, present, and future of and in software visualization | |
Korner | Learning Responsive Data Visualization | |
US20240153172A1 (en) | Automatically generating axes for data visualizations including data bound objects | |
EP4030282A1 (en) | Computing system and method for software architecture planning | |
Chen et al. | iARVis: Mobile AR Based Declarative Information Visualization Authoring, Exploring and Sharing |
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 |