【技术实现步骤摘要】
圆角方形框的渲染方法及设备、地图渲染方法
[0001]本公开涉及图像
，具体涉及一种圆角方形框的渲染方法及设备、地图渲染方法。
技术介绍
[0002]随着技术的发展，应用软件的种类越来越多，而应用软件界面的可视化效果也越来越受重视。例如，在软件应用中展示文字或者图标时，会通过加上方形背景框来优化视觉效果。而方形背景框可以做各种样式设计，比如纯色填充、图案填充、加描边、圆角等。
[0003]已有技术对于圆角方形背景框的渲染过程，通常是事先准备好圆角背景框的图案(比如由美工人员利用画图软件画好)，并将该图案直接绘制为背景，然后再该图案上添加其他图案，比如文字或图标等。但是这种方案无法控制圆角半径值与背景框尺寸的比例，在圆角方形背景框的长宽被拉伸之后，圆角会变形，也即圆角变形后不再是正圆形的四分之一。
[0004]因此，针对上述技术问题，需要提出一种解决方案，能够灵活更改圆角方形背景框的尺寸、圆角大小等。
技术实现思路
[0005]本公开实施例提供一种圆角方形框的渲染方法及设备、地图渲染方法。...
【技术保护点】
【技术特征摘要】
1.一种圆角方形框的渲染方法，其中，包括：将待渲染的圆角方形框划分成多个区域，所述多个区域包括：圆角边沿区域、四边形边沿区域以及四边形中间区域；所述圆角边沿区域的形状是半径为预设圆半径值的圆的一部分、且小于或等于四分之一圆，所述四边形边沿区域位于两个圆角边沿区域之间，所述四边形中间区域被所述圆角边沿区域和所述四边形边沿区域所包围；对所述多个区域中的每一个区域进行三角剖分，得到剖分后的多个三角形顶点的渲染位置；基于所述三角形顶点距离所述四边形中间区域的边沿的最短距离对所述三角形顶点赋予像素半径值；其中，位于所述圆角方形框的边沿的所述三角形顶点的像素半径值为所述预设圆半径值，而位于所述四边形中间区域的边沿的所述三角形顶点的像素半径值为0；将所述三角形顶点的所述渲染位置以及所述像素半径值传送至GPU，以便所述GPU基于所述三角形顶点的所述渲染位置以及所述像素半径值渲染所述圆角方形框。2.根据权利要求1所述的方法，其中，对所述多个区域中的每一个区域进行三角剖分，得到剖分后的多个三角形顶点的渲染位置，包括：将所述四边形边沿区域和所述四边形中间区域分别剖分成两个直角三角形，得到所述两个直角三角形的三角形顶点的渲染位置；将所述圆角边沿区域剖分成边长为所述预设圆半径值的多个等边三角形，得到所述多个等边三角形的三角形顶点的渲染位置。3.根据权利要求1或2所述的方法，其中，将所述三角形顶点的所述渲染位置以及所述像素半径值传送至GPU，包括：将所述三角形顶点的渲染位置传送至所述GPU的三角形顶点着色器；将所述三角形顶点的像素半径值传送至所述GPU的像素着色器。4.根据权利要求1或2所述的方法，其中，将所述三角形的三角形顶点以及所述像素半径值传送至GPU之后，所述方法还包括：在所述GPU中启动图形优化程序，以使所述图形优化程序基于所述GPU输出的所述圆角方形框中每个像素的像素半径值，对所述圆角方形框边沿的所述像素进行柔性插值染色；所述像素的像素半径值为所述像素至所述四边形中间区域的边沿的最短距离。5.根据权利要求4所述的方法，其中，基于所述GPU输出的所述圆角方形框中每个像素的像素半径值，对所述圆角方形框边沿的所述像素进行柔性插值染色，包括：基于所述像素半径值、内边沿半径值和外边沿半径值确定所述像素为内部像素的概率以及所述像素的透明度系数；所述内边沿半径值和所述外边沿半径值均小于所述像素半径值，所述内边沿半径值小于所述外边沿半径值；基于所述内部像素的概率、所述像素的透明度系数调整渲染所述圆角方形框所使用的全局预设颜色，以便基于调整后的所述全局预设颜色对所述圆角方形框中的所述像素进行着色。6.根据权利要求5所述的方法，其中，基于所述像素半径值、内边沿半径值和外边沿半径值确定所述像素为内部像素的概率以及所述像素的透明度系数，包括：基于所述像素半径值与所述内边沿半径值r1的大小关系确定所述像素为内部像素的概率；所述像素半径值小于或等于r1
‑
delta时，...
【专利技术属性】
技术研发人员：白高成，
申请(专利权)人：阿里巴巴中国有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。