圆角矩形

veImageX 支持您通过配置圆角矩形参数，选择圆角为正圆或椭圆后将 veImageX 中存储矩形图片的 4 个角切成圆角。本文介绍使用圆角矩形裁剪图片时的注意事项、使用方法和案例讲解。

注意事项

• 仅支持静图格式图像处理。
• 控制台支持通过 URL 动态输入圆角半径。
• 如果圆角半径大于原图最大内切圆的半径，则按照原图最大内切圆的半径设置圆角（即 r = 原图最小边 ÷ 2）。
• 图片圆角外的区域填充方式：
  • 如果图片的最终输出格式是 png、webp 等支持透明通道的图片，那么图片圆角外的区域将会以透明填充。
  • 如果图片的最终输出格式是 jpeg，那么图片圆角外的区域以白色进行填充。
• 圆角矩形为 veImageX 的基础图片处理功能，其计费详情请参见后付费-按量计费。

使用方法

使用控制台

Step 1：创建模板

您可以通过登录 veImageX 控制台创建模板，具体操作详情请参考新建模板。

Step 2：获取结果图访问地址

如果您已在控制台创建好模板，则在控制台获取您的结果图访问地址的具体操作请参考获取结果图 URL。

使用 OpenAPI

Step 1：创建模板

您可以通过调用 CreateImageTemplate创建您的模板，veImageX 也支持在该接口与其他功能进行组合配置创建模板。

Step 2：获取结果图访问地址

在创建模板后，您可以通过调用 GetResourceURL获取经模板处理后的结果图访问地址。

案例讲解

正圆

下图为您展示了圆角为正圆时的结果图参数介绍。

正圆圆角示例图访问地址如下所示，您可在网站输入该地址并自定义正圆圆角半径，查看多种图片效果：

http://p3-mofang.byteimg.com/tos-cn-i-x9vch4xmek/example.jfif~tplv-x9vch4xmek-round-corner-zy-1:400.image

在调用 CreateImageTemplate 接口创建模板时，您需要设置Filters组合参数配置您的图片处理功能配置，具体的参数配置请参考图片编辑数据结构。

• Name取值为round-corner：即圆角矩形功能名称；
• Param为具体的操作参数：Key为圆角矩形各参数名称，Value为相应参数设置。

上图案例配置的部分关键参数如下所示：

"Filters":[
      {
         "Name":"round-corner",
         "Param":{
            "radius":400,           //正圆圆角半径为400px
            "type":"circle"         //圆角为正圆
            }
       }
  ]

椭圆

下图为您展示了圆角为椭圆时的结果图参数介绍。

椭圆圆角示例图访问地址如下所示，您可在网站输入该地址并自定义椭圆双边圆角半径，查看多种图片效果：

http://p3-mofang.byteimg.com/tos-cn-i-x9vch4xmek/example.jfif~tplv-x9vch4xmek-round-corner-ty-1:450:300.image

在调用 CreateImageTemplate 接口创建模板时，您需要设置Filters组合参数配置您的图片处理功能配置，具体的参数配置请参考图片编辑数据结构。

• Name取值为round-corner：即圆角矩形功能名称；
• Param为具体的操作参数：Key为圆角矩形各参数名称，Value为相应参数设置。

上图案例配置的部分关键参数如下所示：

"Filters":[
      {
         "Name":"round-corner",
         "Param":{
            "radius_x":450,           //椭圆圆角水平半径为450px
            "radius_y":300,           //椭圆圆角垂直半径为300px
            "type":"ellipse"          //圆角为椭圆
            }
       }
  ]