Imgrender - 动态图片渲染

文本

文本

字段名必需类型默认值解释
xYesInt0X坐标
yYesInt0Y坐标
textYesString文本内容
widthYesInt0文本宽度,决定文本的最大展示宽度。当
lineHeightYesInt字体基础高度行高
fontNoStringjiangxizhuokai字体
fontSizeYesInt0文字大小
colorYesHexColor#000文字颜色
textAlignYesStringleft文本对齐方式,可选值:leftcenterright
zIndexYesInt0层级

由于相同大小的不同字体,文本实际渲染效果可能与设计稿有差异,可根据渲染效果进行微调。

定位锚点

Imgrender-字体组件

字体组件属性textAlign会影响文本的定位锚点。

如上图所示,虚线框为文字展示宽与行高。文本奖品:本田-CB650RtextAlign 属性值为left,则锚点在文本的「左上角」。

文本 长按识别二维码,参与抽奖textAlign 属性值为 center,则锚点在文本「中上」位置。

文本 Davinci LitextAlign 属性值为 right,则锚点在文本「右上角」。

字体

目前暂不支持使用自定义字体。Davinci 目前提供以下可免费商用的字体:

👉 若想新增字体,可添加公众号「DebugMe」留言。

font中文名支持语言链接
jiangxizhuokai江西拙楷中文/英文字体发布文章
slideyouran演示悠然小楷中文/英文字体发布文章

示例

{
"x": 320,
"y": 185,
"text": "Davinci Li",
"font": "jiangxizhuokai",
"fontSize": 22,
"color": "#fff",
"width": 320,
"textAlign": "center"
}
Edit this page on GitHub