用户定义变量可变换交付媒体方式

程序员无法想象世界没有变量云形也不能正因如此云化提供图像变换支持用户定义变量.

Cloudinary使用后,你已经可以提供变换图像,包括重排、裁剪、旋转、特效和滤镜大工具箱、文本和图像叠加等,所有都可即时即时交付并优化通过CDN快速交付

有许多场景中,你可能想搭建一套固定变换程序应用到各种媒体资产中,其中一或数项变换取决于拟交付的具体图像或日后判定的其他因素。

通过将自定义变量输入变换中,可分配不同值用于交付文件时特定变换元素举例说,你可:

• 应用重定大小、裁剪和某些特殊效果变换所有图像,但使用变量处理文本叠加元件变换,以便每个图像可按用户名定制

• 依据条件评价计算所需叠加宽度,然后以变量值传递数到应用叠加的变换构件

• 设置网站剖面图像的某些元素,如尺寸、圆形形状、质量等,但允许用户从特效和艺术滤镜中选择应用

等目标只能通过变换API和自身应用代码组合实现现在你可以在变换码内全部实现

用户定义变量可结合使用条件变换.可简化并提升条件变换码的清晰度,根据条件对变量分配不同的值,然后将相关值传递到变换码中链式变换单构件中

可同时应用算术运算符数值参数或用户定义变量表示数值参数令它更趣味的是,用户定义变量甚至可取已知参数值值,该参数值经算术表达式调整举个例子,你可分配文本宽度可变数等于图像宽度减+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++之后可创建文本叠加法,其宽度分配为值文本宽度可变数

用户定义变量工作时更有价值命名变换允许您保留变换码与URL传送码完全分离,并允许您保留变换码与变换码分离

介于可变变量,条件变换,算术表达式函数类命名变换几乎有你需要的一切 视云变API为编程语言

泛泛地说,为在变换中加入自定义变量,你只需指定选择的变量名称前先美联储符号替代静态参数值,并分配变量值与正则参数相似

仅此需要为数值参数创建用户定义基本变量

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","codeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","codeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","codeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('apple_size.jpg', {transformation: [ {variables: [[\"$imgwidth\", \"270\"]]}, {width: \"$imgwidth\", crop: \"scale\"} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('apple_size.jpg', {transformation: [\n {variables: [[\"$imgwidth\", \"270\"]]},\n {width: \"$imgwidth\", crop: \"scale\"}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"apple_size.jpg\").image(transformation=[ {'variables': [[\"$imgwidth\", \"270\"]]}, {'width': \"$imgwidth\", 'crop': \"scale\"} ])","codeSnippet":"CloudinaryImage(\"apple_size.jpg\").image(transformation=[\n {'variables': [[\"$imgwidth\", \"270\"]]},\n {'width': \"$imgwidth\", 'crop': \"scale\"}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('apple_size.jpg'))\n\t->addVariable(Variable::set(\"imgwidth\",270))\n\t->resize(Resize::scale()->width(\"$imgwidth\"));","codeSnippet":"(new ImageTag('apple_size.jpg'))\n\t->addVariable(Variable::set(\"imgwidth\",270))\n\t->resize(Resize::scale()->width(\"$imgwidth\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"apple_size.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$imgwidth\", \"270\"))), array(\"width\"=>\"$imgwidth\", \"crop\"=>\"scale\") )))","codeSnippet":"cl_image_tag(\"apple_size.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$imgwidth\", \"270\"))),\n array(\"width\"=>\"$imgwidth\", \"crop\"=>\"scale\")\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$imgwidth\",\"270\")).chain() .width(\"$imgwidth\").crop(\"scale\")).imageTag(\"apple_size.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$imgwidth\",\"270\")).chain()\n .width(\"$imgwidth\").crop(\"scale\")).imageTag(\"apple_size.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"apple_size.jpg\", :transformation=>[ {:variables=>[[\"$imgwidth\", \"270\"]]}, {:width=>\"$imgwidth\", :crop=>\"scale\"} ])","codeSnippet":"cl_image_tag(\"apple_size.jpg\", :transformation=>[\n {:variables=>[[\"$imgwidth\", \"270\"]]},\n {:width=>\"$imgwidth\", :crop=>\"scale\"}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$imgwidth\", 270).Chain() .Width(\"$imgwidth\").Crop(\"scale\")).BuildImageTag(\"apple_size.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$imgwidth\", 270).Chain()\n .Width(\"$imgwidth\").Crop(\"scale\")).BuildImageTag(\"apple_size.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('apple_size.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"imgwidth\",270))\n\t.resize(Resize.scale().width(\"$imgwidth\")));","codeSnippet":"cloudinary.image('apple_size.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"imgwidth\",270))\n\t.resize(Resize.scale().width(\"$imgwidth\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setWidth(\"$imgwidth\").setCrop(\"scale\")).generate(\"apple_size.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setWidth(\"$imgwidth\").setCrop(\"scale\")).generate(\"apple_size.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$imgwidth\",\"270\")).chain() .width(\"$imgwidth\").crop(\"scale\")).generate(\"apple_size.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$imgwidth\",\"270\")).chain()\n .width(\"$imgwidth\").crop(\"scale\")).generate(\"apple_size.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('apple_size.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"imgwidth\",270))\n\t.resize(Resize.scale().width(\"$imgwidth\")));","codeSnippet":"cloudinary.image('apple_size.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"imgwidth\",270))\n\t.resize(Resize.scale().width(\"$imgwidth\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"apple_size.jpg\")\n\t addVariable(Variable.set(\"imgwidth\",270))\n\t resize(Resize.scale() { width(\"\\$imgwidth\") }) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"apple_size.jpg\")\n\t addVariable(Variable.set(\"imgwidth\",270))\n\t resize(Resize.scale() { width(\"\\$imgwidth\") }) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"apple_size.jpg\", {transformation: [ {variables: [[\"$imgwidth\", \"270\"]]}, {width: \"$imgwidth\", crop: \"scale\"} ]})","codeSnippet":"$.cloudinary.image(\"apple_size.jpg\", {transformation: [\n {variables: [[\"$imgwidth\", \"270\"]]},\n {width: \"$imgwidth\", crop: \"scale\"}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","codeSnippet":"new CloudinaryImage(\"apple_size.jpg\")\n .addVariable(set(\"imgwidth\", 270))\n .resize(scale().width(\"$imgwidth\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$imgwidth_270\/w_$imgwidth\/apple_size.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$imgwidth":"270"},{"width":"$imgwidth"}],"transformation_string":"$imgwidth_270\/w_$imgwidth","url_suffix":"","version":"","secure":true,"public_id":"apple_size.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

从此简化示例中可以看到,我们创建了一个用户定义变量命名伊格维特初始化值270后再分配伊格维特变量对宽度参数化

以相似方式使用变量字符串参数,但用字符串值绑定脱机脱机字符分配,例如myStringvalue! 我的Stringvalue! 我的Stringvalue!.

举个例子 看一篮子字符串多变数,但效果值在每种情况下都取不同字符串值,受变量控制:

显示右侧Sepia图像:我们分配塞皮亚市字符串对$特效变量,然后我们设置效果学变换参数使用值$特效参数 :

<\/Image>","codeSnippet":" \n\t \n\t \n\t \n\t \n<\/Image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","codeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n\t \n\t \n<\/cld-image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","codeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","codeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('strings.jpg', {transformation: [ {width: 1000, crop: \"scale\"}, {variables: [[\"$effect\", \"!sepia!\"]]}, {effect: \"$effect\"}, {border: \"20px_solid_white\"} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('strings.jpg', {transformation: [\n {width: 1000, crop: \"scale\"},\n {variables: [[\"$effect\", \"!sepia!\"]]},\n {effect: \"$effect\"},\n {border: \"20px_solid_white\"}\n ]}).toHtml();","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"strings.jpg\").image(transformation=[ {'width': 1000, 'crop': \"scale\"}, {'variables': [[\"$effect\", \"!sepia!\"]]}, {'effect': \"$effect\"}, {'border': \"20px_solid_white\"} ])","codeSnippet":"CloudinaryImage(\"strings.jpg\").image(transformation=[\n {'width': 1000, 'crop': \"scale\"},\n {'variables': [[\"$effect\", \"!sepia!\"]]},\n {'effect': \"$effect\"},\n {'border': \"20px_solid_white\"}\n ])","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('strings.jpg'))\n\t->addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\");","codeSnippet":"(new ImageTag('strings.jpg'))\n\t->addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\");","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"strings.jpg\", array(\"transformation\"=>array( array(\"width\"=>1000, \"crop\"=>\"scale\"), array(\"variables\"=>array(array(\"$effect\", \"!sepia!\"))), array(\"effect\"=>\"$effect\"), array(\"border\"=>\"20px_solid_white\") )))","codeSnippet":"cl_image_tag(\"strings.jpg\", array(\"transformation\"=>array(\n array(\"width\"=>1000, \"crop\"=>\"scale\"),\n array(\"variables\"=>array(array(\"$effect\", \"!sepia!\"))),\n array(\"effect\"=>\"$effect\"),\n array(\"border\"=>\"20px_solid_white\")\n )))","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().width(1000).crop(\"scale\").chain() .variables(variable(\"$effect\",\"!sepia!\")).chain() .effect(\"$effect\").chain() .border(\"20px_solid_white\")).imageTag(\"strings.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .width(1000).crop(\"scale\").chain()\n .variables(variable(\"$effect\",\"!sepia!\")).chain()\n .effect(\"$effect\").chain()\n .border(\"20px_solid_white\")).imageTag(\"strings.jpg\");","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"strings.jpg\", :transformation=>[ {:width=>1000, :crop=>\"scale\"}, {:variables=>[[\"$effect\", \"!sepia!\"]]}, {:effect=>\"$effect\"}, {:border=>\"20px_solid_white\"} ])","codeSnippet":"cl_image_tag(\"strings.jpg\", :transformation=>[\n {:width=>1000, :crop=>\"scale\"},\n {:variables=>[[\"$effect\", \"!sepia!\"]]},\n {:effect=>\"$effect\"},\n {:border=>\"20px_solid_white\"}\n ])","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Width(1000).Crop(\"scale\").Chain() .Variables(\"$effect\", !sepia!).Chain() .Effect(\"$effect\").Chain() .Border(\"20px_solid_white\")).BuildImageTag(\"strings.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Width(1000).Crop(\"scale\").Chain()\n .Variables(\"$effect\", !sepia!).Chain()\n .Effect(\"$effect\").Chain()\n .Border(\"20px_solid_white\")).BuildImageTag(\"strings.jpg\")","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('strings.jpg').transformation(Transformation()\n\t.addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"));","codeSnippet":"cloudinary.image('strings.jpg').transformation(Transformation()\n\t.addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"));","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().setWidth(1000).setCrop(\"scale\").chain() .chain() .setEffect(\"$effect\").chain() .setBorder(\"20px_solid_white\")).generate(\"strings.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .setWidth(1000).setCrop(\"scale\").chain()\n .chain()\n .setEffect(\"$effect\").chain()\n .setBorder(\"20px_solid_white\")).generate(\"strings.jpg\")!, cloudinary: cloudinary)","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().width(1000).crop(\"scale\").chain() .variables(variable(\"$effect\",\"!sepia!\")).chain() .effect(\"$effect\").chain() .border(\"20px_solid_white\")).generate(\"strings.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .width(1000).crop(\"scale\").chain()\n .variables(variable(\"$effect\",\"!sepia!\")).chain()\n .effect(\"$effect\").chain()\n .border(\"20px_solid_white\")).generate(\"strings.jpg\");","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('strings.jpg').transformation(Transformation()\n\t.addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"));","codeSnippet":"cloudinary.image('strings.jpg').transformation(Transformation()\n\t.addTransformation(\"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"));","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"strings.jpg\")\n\t addTransformation(\"w_1000,c_scale\/\\$effect_!sepia!\/e_\\$effect\/bo_20px_solid_white\") \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"strings.jpg\")\n\t addTransformation(\"w_1000,c_scale\/\\$effect_!sepia!\/e_\\$effect\/bo_20px_solid_white\") \n}.generate()","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"strings.jpg\", {transformation: [ {width: 1000, crop: \"scale\"}, {variables: [[\"$effect\", \"!sepia!\"]]}, {effect: \"$effect\"}, {border: \"20px_solid_white\"} ]})","codeSnippet":"$.cloudinary.image(\"strings.jpg\", {transformation: [\n {width: 1000, crop: \"scale\"},\n {variables: [[\"$effect\", \"!sepia!\"]]},\n {effect: \"$effect\"},\n {border: \"20px_solid_white\"}\n ]})","status":51,"statusText":"Ruby code_generator_failed_unexpectedly","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","codeSnippet":"new CloudinaryImage(\"strings.jpg\").addTransformation(\n \"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\"\n);","status":50,"statusText":"Ruby action_generator_failed_unexpectedly","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white\/strings.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"width":"1000","crop_mode":"scale"},{"$effect":"!sepia!"},{"effect":"$effect"},{"border":"20px_solid_white"}],"transformation_string":"w_1000,c_scale\/$effect_!sepia!\/e_$effect\/bo_20px_solid_white","url_suffix":"","version":"","secure":true,"public_id":"strings.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image","error":{}}" with-url="true" > 加载代码示例

文本叠加中也可以使用字符串变量或甚至部分文本要区分变量与文本叠加中文本其余部分, 需要特殊变量语法 :$(变量名).下方文本叠加固定文本©后继变量名称使用语法$(name).

<\/Image>","codeSnippet":" \n\t \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","codeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","codeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","codeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('canyons.jpg', {transformation: [ {variables: [[\"$name\", \"!Jane Smith!\"]]}, {width: 1080, crop: \"scale\"}, {overlay: new cloudinary.TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\"), gravity: \"south_east\", x: 10, y: 10, background: \"#e7e5e5\", opacity: 75, radius: 15} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('canyons.jpg', {transformation: [\n {variables: [[\"$name\", \"!Jane Smith!\"]]},\n {width: 1080, crop: \"scale\"},\n {overlay: new cloudinary.TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\"), gravity: \"south_east\", x: 10, y: 10, background: \"#e7e5e5\", opacity: 75, radius: 15}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"canyons.jpg\").image(transformation=[ {'variables': [[\"$name\", \"!Jane Smith!\"]]}, {'width': 1080, 'crop': \"scale\"}, {'overlay': {'font_family': \"MS\", 'font_size': 36, 'text': \"%20%C2%A9%24%28name%29%20\"}, 'gravity': \"south_east\", 'x': 10, 'y': 10, 'background': \"#e7e5e5\", 'opacity': 75, 'radius': 15} ])","codeSnippet":"CloudinaryImage(\"canyons.jpg\").image(transformation=[\n {'variables': [[\"$name\", \"!Jane Smith!\"]]},\n {'width': 1080, 'crop': \"scale\"},\n {'overlay': {'font_family': \"MS\", 'font_size': 36, 'text': \"%20%C2%A9%24%28name%29%20\"}, 'gravity': \"south_east\", 'x': 10, 'y': 10, 'background': \"#e7e5e5\", 'opacity': 75, 'radius': 15}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('canyons.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jane Smith\"))\n\t->resize(Resize::scale()->width(1080))\n\t->overlay(Overlay::source(\n\tSource::text(\" \u00a9$(name) \",(new TextStyle(\"Comic Sans MS\",36)))\n\t->backgroundColor(Color::rgb(\"e7e5e5\"))\n\t->transformation((new Transformation())\n\t->roundCorners(RoundCorners::byRadius(15))\n\t->adjust(Adjust::opacity(75)))\n\t)\n\t->position((new Position())\n\t->gravity(\n\tGravity::compass(\n\tCompass::southEast()))\n->offsetX(10)\n->offsetY(10))\n\t);","codeSnippet":"(new ImageTag('canyons.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jane Smith\"))\n\t->resize(Resize::scale()->width(1080))\n\t->overlay(Overlay::source(\n\tSource::text(\" \u00a9$(name) \",(new TextStyle(\"Comic Sans MS\",36)))\n\t->backgroundColor(Color::rgb(\"e7e5e5\"))\n\t->transformation((new Transformation())\n\t->roundCorners(RoundCorners::byRadius(15))\n\t->adjust(Adjust::opacity(75)))\n\t)\n\t->position((new Position())\n\t->gravity(\n\tGravity::compass(\n\tCompass::southEast()))\n->offsetX(10)\n->offsetY(10))\n\t);","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"canyons.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$name\", \"!Jane Smith!\"))), array(\"width\"=>1080, \"crop\"=>\"scale\"), array(\"overlay\"=>array(\"font_family\"=>\"MS\", \"font_size\"=>36, \"text\"=>\"%20%C2%A9%24%28name%29%20\"), \"gravity\"=>\"south_east\", \"x\"=>10, \"y\"=>10, \"background\"=>\"#e7e5e5\", \"opacity\"=>75, \"radius\"=>15) )))","codeSnippet":"cl_image_tag(\"canyons.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$name\", \"!Jane Smith!\"))),\n array(\"width\"=>1080, \"crop\"=>\"scale\"),\n array(\"overlay\"=>array(\"font_family\"=>\"MS\", \"font_size\"=>36, \"text\"=>\"%20%C2%A9%24%28name%29%20\"), \"gravity\"=>\"south_east\", \"x\"=>10, \"y\"=>10, \"background\"=>\"#e7e5e5\", \"opacity\"=>75, \"radius\"=>15)\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$name\",\"!Jane Smith!\")).chain() .width(1080).crop(\"scale\").chain() .overlay(new TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\")).gravity(\"south_east\").x(10).y(10).background(\"#e7e5e5\").opacity(75).radius(15)).imageTag(\"canyons.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jane Smith!\")).chain()\n .width(1080).crop(\"scale\").chain()\n .overlay(new TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\")).gravity(\"south_east\").x(10).y(10).background(\"#e7e5e5\").opacity(75).radius(15)).imageTag(\"canyons.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"canyons.jpg\", :transformation=>[ {:variables=>[[\"$name\", \"!Jane Smith!\"]]}, {:width=>1080, :crop=>\"scale\"}, {:overlay=>{:font_family=>\"MS\", :font_size=>36, :text=>\"%20%C2%A9%24%28name%29%20\"}, :gravity=>\"south_east\", :x=>10, :y=>10, :background=>\"#e7e5e5\", :opacity=>75, :radius=>15} ])","codeSnippet":"cl_image_tag(\"canyons.jpg\", :transformation=>[\n {:variables=>[[\"$name\", \"!Jane Smith!\"]]},\n {:width=>1080, :crop=>\"scale\"},\n {:overlay=>{:font_family=>\"MS\", :font_size=>36, :text=>\"%20%C2%A9%24%28name%29%20\"}, :gravity=>\"south_east\", :x=>10, :y=>10, :background=>\"#e7e5e5\", :opacity=>75, :radius=>15}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$name\", !Jane Smith!).Chain() .Width(1080).Crop(\"scale\").Chain() .Overlay(new TextLayer().FontFamily(\"MS\").FontSize(36).Text(\"%20%C2%A9%24%28name%29%20\")).Gravity(\"south_east\").X(10).Y(10).Background(\"#e7e5e5\").Opacity(75).Radius(15)).BuildImageTag(\"canyons.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$name\", !Jane Smith!).Chain()\n .Width(1080).Crop(\"scale\").Chain()\n .Overlay(new TextLayer().FontFamily(\"MS\").FontSize(36).Text(\"%20%C2%A9%24%28name%29%20\")).Gravity(\"south_east\").X(10).Y(10).Background(\"#e7e5e5\").Opacity(75).Radius(15)).BuildImageTag(\"canyons.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('canyons.jpg').transformation(Transformation()\n\t.addTransformation(\"$name_!Jane Smith!\/w_1080\/l_text:Comic Sans MS_36: \u00a9$(name) ,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15\"));","codeSnippet":"cloudinary.image('canyons.jpg').transformation(Transformation()\n\t.addTransformation(\"$name_!Jane Smith!\/w_1080\/l_text:Comic Sans MS_36: \u00a9$(name) ,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15\"));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setWidth(1080).setCrop(\"scale\").chain() .setOverlay(\"text:Comic%20Sans%20MS_36:%20%C2%A9%24%28name%29%20\").setGravity(\"south_east\").setX(10).setY(10).setBackground(\"#e7e5e5\").setOpacity(75).setRadius(15)).generate(\"canyons.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setWidth(1080).setCrop(\"scale\").chain()\n .setOverlay(\"text:Comic%20Sans%20MS_36:%20%C2%A9%24%28name%29%20\").setGravity(\"south_east\").setX(10).setY(10).setBackground(\"#e7e5e5\").setOpacity(75).setRadius(15)).generate(\"canyons.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$name\",\"!Jane Smith!\")).chain() .width(1080).crop(\"scale\").chain() .overlay(new TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\")).gravity(\"south_east\").x(10).y(10).background(\"#e7e5e5\").opacity(75).radius(15)).generate(\"canyons.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jane Smith!\")).chain()\n .width(1080).crop(\"scale\").chain()\n .overlay(new TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\")).gravity(\"south_east\").x(10).y(10).background(\"#e7e5e5\").opacity(75).radius(15)).generate(\"canyons.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('canyons.jpg').transformation(Transformation()\n\t.addTransformation(\"$name_!Jane Smith!\/w_1080\/l_text:Comic Sans MS_36: \u00a9$(name) ,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15\"));","codeSnippet":"cloudinary.image('canyons.jpg').transformation(Transformation()\n\t.addTransformation(\"$name_!Jane Smith!\/w_1080\/l_text:Comic Sans MS_36: \u00a9$(name) ,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15\"));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"canyons.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jane Smith\"))\n\t resize(Resize.scale() { width(1080) })\n\t overlay(Overlay.source(\n\tSource.text(\" \u00a9\\$(name) \",TextStyle(\"Comic Sans MS\",36)) {\n\t backgroundColor(Color.rgb(\"e7e5e5\"))\n\t transformation(Transformation {\n\t roundCorners(RoundCorners.byRadius(15))\n\t adjust(Adjust.opacity(75)) })\n\t }) {\n\t position(Position() {\n\t gravity(\n\tGravity.compass(\n\tCompass.southEast()))\n offsetX(10)\n offsetY(10) })\n\t }) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"canyons.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jane Smith\"))\n\t resize(Resize.scale() { width(1080) })\n\t overlay(Overlay.source(\n\tSource.text(\" \u00a9\\$(name) \",TextStyle(\"Comic Sans MS\",36)) {\n\t backgroundColor(Color.rgb(\"e7e5e5\"))\n\t transformation(Transformation {\n\t roundCorners(RoundCorners.byRadius(15))\n\t adjust(Adjust.opacity(75)) })\n\t }) {\n\t position(Position() {\n\t gravity(\n\tGravity.compass(\n\tCompass.southEast()))\n offsetX(10)\n offsetY(10) })\n\t }) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"canyons.jpg\", {transformation: [ {variables: [[\"$name\", \"!Jane Smith!\"]]}, {width: 1080, crop: \"scale\"}, {overlay: new cloudinary.TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\"), gravity: \"south_east\", x: 10, y: 10, background: \"#e7e5e5\", opacity: 75, radius: 15} ]})","codeSnippet":"$.cloudinary.image(\"canyons.jpg\", {transformation: [\n {variables: [[\"$name\", \"!Jane Smith!\"]]},\n {width: 1080, crop: \"scale\"},\n {overlay: new cloudinary.TextLayer().fontFamily(\"MS\").fontSize(36).text(\"%20%C2%A9%24%28name%29%20\"), gravity: \"south_east\", x: 10, y: 10, background: \"#e7e5e5\", opacity: 75, radius: 15}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","codeSnippet":"new CloudinaryImage(\"canyons.jpg\")\n .addVariable(set(\"name\", \"Jane Smith\"))\n .resize(scale().width(1080))\n .overlay(\n source(\n text(\" \u00a9$(name) \", new TextStyle(\"Comic Sans MS\", 36))\n .backgroundColor(\"#e7e5e5\")\n .transformation(\n new Transformation().roundCorners(byRadius(15)).adjust(opacity(75))\n )\n ).position(\n new Position()\n .gravity(compass(\"south_east\"))\n .offsetX(10)\n .offsetY(10)\n )\n );","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$name_!Jane%20Smith!\/w_1080\/l_text:Comic%20Sans%20MS_36:%20%C2%A9$(name)%20,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15\/canyons.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$name":"!Jane Smith!"},{"width":"1080"},{"overlay":"text:Comic Sans MS_36: \u00a9$(name) ","gravity":"south_east","x":"10","y":"10","background":"rgb:e7e5e5","opacity":"75","radius":"15"}],"transformation_string":"$name_!Jane Smith!\/w_1080\/l_text:Comic Sans MS_36: \u00a9$(name) ,g_south_east,x_10,y_10,b_rgb:e7e5e5,o_75,r_15","url_suffix":"","version":"","secure":true,"public_id":"canyons.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

注解:用用户定义变量替代单值数字变换参数和字符串变换参数参考文档精确链表.)

为了简化上例,我们演示变量分配并使用变换内变量,并用同送URL

然而,在大多数现实假想中,你可能使用变量变换命名变换.A级命名变换排序像变换函数 从任意变换 URL中可调用但直到现在,你无法传递外部值到命名变换并用用户定义变量

用户定义变量允许完全分离变换值设计内容逻辑与技术逻辑分离

分离取名转换全新层次,使多图像重用常用变换大易易度,即使根据具体图像、显示图像位置或其他依存性对变换必须作某些特定调整

举个例子,我们保存了一个相似变换 上峡谷照片使用,签名photos.命名变换设置字体类型和大小、文本叠加位置、参数定义半透明后台并包括摄影师名变量和照片最后宽度变量

签名photos变换:c_scale,w_1080/b_rgb:e7e5e5,g_south_east,l_text:Comic Sans MS_30: © $(name)%20,o_60,r_15,x_10,y_10/c_scale,w_$finalwidth

使用命名变换后, 通过分配相关摄影师名和生成图像最终宽度交付图像, 并指定命名变换和公开标识

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","codeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","codeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","codeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('greece_seaport.jpg', {transformation: [ {variables: [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]}, {transformation: [\"signed_photos\"]} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('greece_seaport.jpg', {transformation: [\n {variables: [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]},\n {transformation: [\"signed_photos\"]}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"greece_seaport.jpg\").image(transformation=[ {'variables': [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]}, {'transformation': [\"signed_photos\"]} ])","codeSnippet":"CloudinaryImage(\"greece_seaport.jpg\").image(transformation=[\n {'variables': [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]},\n {'transformation': [\"signed_photos\"]}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('greece_seaport.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jack Ross\"))\n\t->addVariable(Variable::set(\"finalwidth\",600))\n\t->namedTransformation(NamedTransformation::name(\"signed_photos\"));","codeSnippet":"(new ImageTag('greece_seaport.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jack Ross\"))\n\t->addVariable(Variable::set(\"finalwidth\",600))\n\t->namedTransformation(NamedTransformation::name(\"signed_photos\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"greece_seaport.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$name\", \"!Jack Ross!\"), array(\"$finalwidth\", \"600\"))), array(\"transformation\"=>array(\"signed_photos\")) )))","codeSnippet":"cl_image_tag(\"greece_seaport.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$name\", \"!Jack Ross!\"), array(\"$finalwidth\", \"600\"))),\n array(\"transformation\"=>array(\"signed_photos\"))\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$name\",\"!Jack Ross!\"),variable(\"$finalwidth\",\"600\")).chain() .named(\"signed_photos\")).imageTag(\"greece_seaport.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jack Ross!\"),variable(\"$finalwidth\",\"600\")).chain()\n .named(\"signed_photos\")).imageTag(\"greece_seaport.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"greece_seaport.jpg\", :transformation=>[ {:variables=>[[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]}, {:transformation=>[\"signed_photos\"]} ])","codeSnippet":"cl_image_tag(\"greece_seaport.jpg\", :transformation=>[\n {:variables=>[[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]},\n {:transformation=>[\"signed_photos\"]}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$name\", !Jack Ross!).Chain() .Named(\"signed_photos\")).BuildImageTag(\"greece_seaport.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$name\", !Jack Ross!).Chain()\n .Named(\"signed_photos\")).BuildImageTag(\"greece_seaport.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('greece_seaport.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t.addVariable(Variable.set(\"finalwidth\",600))\n\t.namedTransformation(NamedTransformation.name(\"signed_photos\")));","codeSnippet":"cloudinary.image('greece_seaport.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t.addVariable(Variable.set(\"finalwidth\",600))\n\t.namedTransformation(NamedTransformation.name(\"signed_photos\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setNamed(\"signed_photos\")).generate(\"greece_seaport.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setNamed(\"signed_photos\")).generate(\"greece_seaport.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$name\",\"!Jack Ross!\"),variable(\"$finalwidth\",\"600\")).chain() .named(\"signed_photos\")).generate(\"greece_seaport.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jack Ross!\"),variable(\"$finalwidth\",\"600\")).chain()\n .named(\"signed_photos\")).generate(\"greece_seaport.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('greece_seaport.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t.addVariable(Variable.set(\"finalwidth\",600))\n\t.namedTransformation(NamedTransformation.name(\"signed_photos\")));","codeSnippet":"cloudinary.image('greece_seaport.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t.addVariable(Variable.set(\"finalwidth\",600))\n\t.namedTransformation(NamedTransformation.name(\"signed_photos\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"greece_seaport.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t addVariable(Variable.set(\"finalwidth\",600))\n\t namedTransformation(NamedTransformation.name(\"signed_photos\")) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"greece_seaport.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jack Ross\"))\n\t addVariable(Variable.set(\"finalwidth\",600))\n\t namedTransformation(NamedTransformation.name(\"signed_photos\")) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"greece_seaport.jpg\", {transformation: [ {variables: [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]}, {transformation: [\"signed_photos\"]} ]})","codeSnippet":"$.cloudinary.image(\"greece_seaport.jpg\", {transformation: [\n {variables: [[\"$name\", \"!Jack Ross!\"], [\"$finalwidth\", \"600\"]]},\n {transformation: [\"signed_photos\"]}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","codeSnippet":"new CloudinaryImage(\"greece_seaport.jpg\")\n .addVariable(set(\"name\", \"Jack Ross\"))\n .addVariable(set(\"finalwidth\", 600))\n .namedTransformation(name(\"signed_photos\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$name_!Jack%20Ross!,$finalwidth_600\/t_signed_photos\/greece_seaport.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$name":"!Jack Ross!","$finalwidth":"600"},{"transformation":"signed_photos"}],"transformation_string":"$name_!Jack Ross!,$finalwidth_600\/t_signed_photos","url_suffix":"","version":"","secure":true,"public_id":"greece_seaport.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

现在你有了点子,让我们来看看一些更酷的东西 用变量可以实现

假设你有一个新闻网站 总是显示两个最新新闻 形式为大平方缩图链接 220x220像素下方老新闻显示小平方图像链路(100x100),

可创建命名变换程序,规定质量、作物类型、重力和其他图像改进程序,并额外将宽度和高度都定为a美元规模变量外部定义举例说t_newsquare命名变换可定义为:c_fill,e_improve,g_auto:faces,z_0.7,q_auto,w_$size,h_$size,

大图像缩略图交付 URLs设置美元规模可变值220

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('group.jpg', {transformation: [ {variables: [[\"$size\", \"220\"]]}, {transformation: [\"news_square\"]} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('group.jpg', {transformation: [\n {variables: [[\"$size\", \"220\"]]},\n {transformation: [\"news_square\"]}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"group.jpg\").image(transformation=[ {'variables': [[\"$size\", \"220\"]]}, {'transformation': [\"news_square\"]} ])","codeSnippet":"CloudinaryImage(\"group.jpg\").image(transformation=[\n {'variables': [[\"$size\", \"220\"]]},\n {'transformation': [\"news_square\"]}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('group.jpg'))\n\t->addVariable(Variable::set(\"size\",220))\n\t->namedTransformation(NamedTransformation::name(\"news_square\"));","codeSnippet":"(new ImageTag('group.jpg'))\n\t->addVariable(Variable::set(\"size\",220))\n\t->namedTransformation(NamedTransformation::name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"group.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$size\", \"220\"))), array(\"transformation\"=>array(\"news_square\")) )))","codeSnippet":"cl_image_tag(\"group.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$size\", \"220\"))),\n array(\"transformation\"=>array(\"news_square\"))\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$size\",\"220\")).chain() .named(\"news_square\")).imageTag(\"group.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$size\",\"220\")).chain()\n .named(\"news_square\")).imageTag(\"group.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"group.jpg\", :transformation=>[ {:variables=>[[\"$size\", \"220\"]]}, {:transformation=>[\"news_square\"]} ])","codeSnippet":"cl_image_tag(\"group.jpg\", :transformation=>[\n {:variables=>[[\"$size\", \"220\"]]},\n {:transformation=>[\"news_square\"]}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$size\", 220).Chain() .Named(\"news_square\")).BuildImageTag(\"group.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$size\", 220).Chain()\n .Named(\"news_square\")).BuildImageTag(\"group.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('group.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",220))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","codeSnippet":"cloudinary.image('group.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",220))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setNamed(\"news_square\")).generate(\"group.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setNamed(\"news_square\")).generate(\"group.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$size\",\"220\")).chain() .named(\"news_square\")).generate(\"group.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$size\",\"220\")).chain()\n .named(\"news_square\")).generate(\"group.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('group.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",220))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","codeSnippet":"cloudinary.image('group.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",220))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"group.jpg\")\n\t addVariable(Variable.set(\"size\",220))\n\t namedTransformation(NamedTransformation.name(\"news_square\")) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"group.jpg\")\n\t addVariable(Variable.set(\"size\",220))\n\t namedTransformation(NamedTransformation.name(\"news_square\")) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"group.jpg\", {transformation: [ {variables: [[\"$size\", \"220\"]]}, {transformation: [\"news_square\"]} ]})","codeSnippet":"$.cloudinary.image(\"group.jpg\", {transformation: [\n {variables: [[\"$size\", \"220\"]]},\n {transformation: [\"news_square\"]}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"group.jpg\")\n .addVariable(set(\"size\", 220))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$size_220\/t_news_square\/group.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$size":"220"},{"transformation":"news_square"}],"transformation_string":"$size_220\/t_news_square","url_suffix":"","version":"","secure":true,"public_id":"group.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

小图像变换引用同名变换,但大小值为100

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('partners_table.jpg', {transformation: [ {variables: [[\"$size\", \"100\"]]}, {transformation: [\"news_square\"]} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('partners_table.jpg', {transformation: [\n {variables: [[\"$size\", \"100\"]]},\n {transformation: [\"news_square\"]}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"partners_table.jpg\").image(transformation=[ {'variables': [[\"$size\", \"100\"]]}, {'transformation': [\"news_square\"]} ])","codeSnippet":"CloudinaryImage(\"partners_table.jpg\").image(transformation=[\n {'variables': [[\"$size\", \"100\"]]},\n {'transformation': [\"news_square\"]}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('partners_table.jpg'))\n\t->addVariable(Variable::set(\"size\",100))\n\t->namedTransformation(NamedTransformation::name(\"news_square\"));","codeSnippet":"(new ImageTag('partners_table.jpg'))\n\t->addVariable(Variable::set(\"size\",100))\n\t->namedTransformation(NamedTransformation::name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"partners_table.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$size\", \"100\"))), array(\"transformation\"=>array(\"news_square\")) )))","codeSnippet":"cl_image_tag(\"partners_table.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$size\", \"100\"))),\n array(\"transformation\"=>array(\"news_square\"))\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$size\",\"100\")).chain() .named(\"news_square\")).imageTag(\"partners_table.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$size\",\"100\")).chain()\n .named(\"news_square\")).imageTag(\"partners_table.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"partners_table.jpg\", :transformation=>[ {:variables=>[[\"$size\", \"100\"]]}, {:transformation=>[\"news_square\"]} ])","codeSnippet":"cl_image_tag(\"partners_table.jpg\", :transformation=>[\n {:variables=>[[\"$size\", \"100\"]]},\n {:transformation=>[\"news_square\"]}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$size\", 100).Chain() .Named(\"news_square\")).BuildImageTag(\"partners_table.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$size\", 100).Chain()\n .Named(\"news_square\")).BuildImageTag(\"partners_table.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('partners_table.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",100))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","codeSnippet":"cloudinary.image('partners_table.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",100))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setNamed(\"news_square\")).generate(\"partners_table.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setNamed(\"news_square\")).generate(\"partners_table.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$size\",\"100\")).chain() .named(\"news_square\")).generate(\"partners_table.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$size\",\"100\")).chain()\n .named(\"news_square\")).generate(\"partners_table.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('partners_table.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",100))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","codeSnippet":"cloudinary.image('partners_table.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"size\",100))\n\t.namedTransformation(NamedTransformation.name(\"news_square\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"partners_table.jpg\")\n\t addVariable(Variable.set(\"size\",100))\n\t namedTransformation(NamedTransformation.name(\"news_square\")) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"partners_table.jpg\")\n\t addVariable(Variable.set(\"size\",100))\n\t namedTransformation(NamedTransformation.name(\"news_square\")) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"partners_table.jpg\", {transformation: [ {variables: [[\"$size\", \"100\"]]}, {transformation: [\"news_square\"]} ]})","codeSnippet":"$.cloudinary.image(\"partners_table.jpg\", {transformation: [\n {variables: [[\"$size\", \"100\"]]},\n {transformation: [\"news_square\"]}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","codeSnippet":"new CloudinaryImage(\"partners_table.jpg\")\n .addVariable(set(\"size\", 100))\n .namedTransformation(name(\"news_square\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$size_100\/t_news_square\/partners_table.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$size":"100"},{"transformation":"news_square"}],"transformation_string":"$size_100\/t_news_square","url_suffix":"","version":"","secure":true,"public_id":"partners_table.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

试想一下用户上传剖面照片到社交媒体应用上,你需要将相片显示到他们的剖面页面上,像面向画的矩形和圆角,像平方站到主页上,像聊天页上小圆形聊天头孔缩放每张照片应该根据图像大小和形状调整当然你也知道,随着网站设计在未来的改变,这些值可能会改变。

不论上述调整方式如何,你总想对所有照片使用相同质量、格式和面部识别设置

带变量简单创建命名变换剖面图_pic并静态设置永久元素和变量大小(方位比和最终宽度)和半径(轮廓):

上头剖面图_pic命名变换像此 :
$zoom_$aratio_sub_0.4/
ar_$aratio,c_thumb,f_auto,g_face,q_auto,r_$rounding,w_$width,z_$zoom

命名变换利用算术运算符实现缩放随侧比变化1:1图像归结为近缩放,取头照,但非太近,而画像图像(剖分比 < 1)则小缩放,显示更多整体

右侧显示圆聊天头像时会交付值1.0美联储75元宽度和20四舍五入:

<\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","codeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","codeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","codeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('standing_woman.jpg', {transformation: [ {variables: [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]}, {transformation: [\"profile_pic\"]} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('standing_woman.jpg', {transformation: [\n {variables: [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]},\n {transformation: [\"profile_pic\"]}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"standing_woman.jpg\").image(transformation=[ {'variables': [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]}, {'transformation': [\"profile_pic\"]} ])","codeSnippet":"CloudinaryImage(\"standing_woman.jpg\").image(transformation=[\n {'variables': [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]},\n {'transformation': [\"profile_pic\"]}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('standing_woman.jpg'))\n\t->addVariable(Variable::set(\"aratio\",1.0))\n\t->addVariable(Variable::set(\"width\",75))\n\t->addVariable(Variable::set(\"rounding\",200))\n\t->namedTransformation(NamedTransformation::name(\"profile_pic\"));","codeSnippet":"(new ImageTag('standing_woman.jpg'))\n\t->addVariable(Variable::set(\"aratio\",1.0))\n\t->addVariable(Variable::set(\"width\",75))\n\t->addVariable(Variable::set(\"rounding\",200))\n\t->namedTransformation(NamedTransformation::name(\"profile_pic\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"standing_woman.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$aratio\", \"1.0\"), array(\"$width\", \"75\"), array(\"$rounding\", \"200\"))), array(\"transformation\"=>array(\"profile_pic\")) )))","codeSnippet":"cl_image_tag(\"standing_woman.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$aratio\", \"1.0\"), array(\"$width\", \"75\"), array(\"$rounding\", \"200\"))),\n array(\"transformation\"=>array(\"profile_pic\"))\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$aratio\",\"1.0\"),variable(\"$width\",\"75\"),variable(\"$rounding\",\"200\")).chain() .named(\"profile_pic\")).imageTag(\"standing_woman.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$aratio\",\"1.0\"),variable(\"$width\",\"75\"),variable(\"$rounding\",\"200\")).chain()\n .named(\"profile_pic\")).imageTag(\"standing_woman.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"standing_woman.jpg\", :transformation=>[ {:variables=>[[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]}, {:transformation=>[\"profile_pic\"]} ])","codeSnippet":"cl_image_tag(\"standing_woman.jpg\", :transformation=>[\n {:variables=>[[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]},\n {:transformation=>[\"profile_pic\"]}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$aratio\", 1.0).Chain() .Named(\"profile_pic\")).BuildImageTag(\"standing_woman.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$aratio\", 1.0).Chain()\n .Named(\"profile_pic\")).BuildImageTag(\"standing_woman.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('standing_woman.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"aratio\",'1.0'))\n\t.addVariable(Variable.set(\"width\",75))\n\t.addVariable(Variable.set(\"rounding\",200))\n\t.namedTransformation(NamedTransformation.name(\"profile_pic\")));","codeSnippet":"cloudinary.image('standing_woman.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"aratio\",'1.0'))\n\t.addVariable(Variable.set(\"width\",75))\n\t.addVariable(Variable.set(\"rounding\",200))\n\t.namedTransformation(NamedTransformation.name(\"profile_pic\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setNamed(\"profile_pic\")).generate(\"standing_woman.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setNamed(\"profile_pic\")).generate(\"standing_woman.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$aratio\",\"1.0\"),variable(\"$width\",\"75\"),variable(\"$rounding\",\"200\")).chain() .named(\"profile_pic\")).generate(\"standing_woman.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$aratio\",\"1.0\"),variable(\"$width\",\"75\"),variable(\"$rounding\",\"200\")).chain()\n .named(\"profile_pic\")).generate(\"standing_woman.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('standing_woman.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"aratio\",'1.0'))\n\t.addVariable(Variable.set(\"width\",75))\n\t.addVariable(Variable.set(\"rounding\",200))\n\t.namedTransformation(NamedTransformation.name(\"profile_pic\")));","codeSnippet":"cloudinary.image('standing_woman.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"aratio\",'1.0'))\n\t.addVariable(Variable.set(\"width\",75))\n\t.addVariable(Variable.set(\"rounding\",200))\n\t.namedTransformation(NamedTransformation.name(\"profile_pic\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"standing_woman.jpg\")\n\t addVariable(Variable.set(\"aratio\",1.0F))\n\t addVariable(Variable.set(\"width\",75))\n\t addVariable(Variable.set(\"rounding\",200))\n\t namedTransformation(NamedTransformation.name(\"profile_pic\")) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"standing_woman.jpg\")\n\t addVariable(Variable.set(\"aratio\",1.0F))\n\t addVariable(Variable.set(\"width\",75))\n\t addVariable(Variable.set(\"rounding\",200))\n\t namedTransformation(NamedTransformation.name(\"profile_pic\")) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"standing_woman.jpg\", {transformation: [ {variables: [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]}, {transformation: [\"profile_pic\"]} ]})","codeSnippet":"$.cloudinary.image(\"standing_woman.jpg\", {transformation: [\n {variables: [[\"$aratio\", \"1.0\"], [\"$width\", \"75\"], [\"$rounding\", \"200\"]]},\n {transformation: [\"profile_pic\"]}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","codeSnippet":"new CloudinaryImage(\"standing_woman.jpg\")\n .addVariable(set(\"aratio\", \"1.0\"))\n .addVariable(set(\"width\", 75))\n .addVariable(set(\"rounding\", 200))\n .namedTransformation(name(\"profile_pic\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$aratio_1.0,$width_75,$rounding_200\/t_profile_pic\/standing_woman.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$aratio":"1.0","$width":"75","$rounding":"200"},{"transformation":"profile_pic"}],"transformation_string":"$aratio_1.0,$width_75,$rounding_200\/t_profile_pic","url_suffix":"","version":"","secure":true,"public_id":"standing_woman.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

比方说你想发布 优胜相竞取胜照片以横幅图形叠加方式交付,显示胜者姓名和胜者胜出之地所有照片均按原创大小发布,但横幅叠加宽度和文本全宽度(无论优胜者名字长度)都必须与照片大小相对应。

例举 :

通过创建用户定义变量实现这一点,所有变量都与算术运算符和相对值并存举个例子,我们希望标语宽度达90% 高度达15%文本完全匹配横幅约45%图像宽度,但文本与图像底部的距离必须与重标幅高度相对当然,我们希望优胜者名和位置也变量化

实现所有这一切的变换比较复杂,但没关系我们只需要解决一次 并把它放进命名变换

投送每张获奖相片

举例说,所有我们需要做交付 第一图片设置元名变量改用Jen Fine华府变量优先级 <\/Image>","codeSnippet":" \n\t \n\t \n<\/Image>","status":0,"statusText":"Ok","displayName":"React","packageName":"cloudinary-react","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue_2","framework":"vue_2","language":"vue","rawCodeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","codeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"@cloudinary\/vue","packageStatus":"","packageVersion":"1.x"},{"sdkId":"vue","framework":"vue","language":"vue","rawCodeSnippet":" <\/cld-image>","codeSnippet":" \n\t \n\t \n<\/cld-image>","status":0,"statusText":"Ok","displayName":"Vue.js","packageName":"cloudinary-vue","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"angular_2","framework":"angular_2","language":"angular","rawCodeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","codeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/ng","packageStatus":"","packageVersion":"1.x"},{"sdkId":"angular","framework":"angular","language":"angular","rawCodeSnippet":" <\/cl-transformation> <\/cl-transformation> <\/cl-image>","codeSnippet":" \n\t \n\t<\/cl-transformation>\n\t \n\t<\/cl-transformation>\n<\/cl-image>","status":0,"statusText":"Ok","displayName":"Angular","packageName":"@cloudinary\/angular-5.x","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"js_2","framework":"js_2","language":"js","rawCodeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","codeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","status":0,"statusText":"Ok","displayName":"JS","packageName":"@cloudinary\/url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"js","framework":"js","language":"js","rawCodeSnippet":"cloudinary.imageTag('girl_camera.jpg', {transformation: [ {variables: [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]}, {transformation: [\"photo_contest\"]} ]}).toHtml();","codeSnippet":"cloudinary.imageTag('girl_camera.jpg', {transformation: [\n {variables: [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]},\n {transformation: [\"photo_contest\"]}\n ]}).toHtml();","status":0,"statusText":"Ok","displayName":"JS","packageName":"cloudinary-core","packageStatus":"legacy","packageVersion":"2.x"},{"sdkId":"python","framework":"python","language":"python","rawCodeSnippet":"CloudinaryImage(\"girl_camera.jpg\").image(transformation=[ {'variables': [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]}, {'transformation': [\"photo_contest\"]} ])","codeSnippet":"CloudinaryImage(\"girl_camera.jpg\").image(transformation=[\n {'variables': [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]},\n {'transformation': [\"photo_contest\"]}\n ])","status":0,"statusText":"Ok","displayName":"Python","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"php_2","framework":"php_2","language":"php","rawCodeSnippet":"(new ImageTag('girl_camera.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jen Fine\"))\n\t->addVariable(Variable::set(\"award\",\"First\"))\n\t->namedTransformation(NamedTransformation::name(\"photo_contest\"));","codeSnippet":"(new ImageTag('girl_camera.jpg'))\n\t->addVariable(Variable::set(\"name\",\"Jen Fine\"))\n\t->addVariable(Variable::set(\"award\",\"First\"))\n\t->namedTransformation(NamedTransformation::name(\"photo_contest\"));","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"","packageVersion":"2.x"},{"sdkId":"php","framework":"php","language":"php","rawCodeSnippet":"cl_image_tag(\"girl_camera.jpg\", array(\"transformation\"=>array( array(\"variables\"=>array(array(\"$name\", \"!Jen Fine!\"), array(\"$award\", \"!First!\"))), array(\"transformation\"=>array(\"photo_contest\")) )))","codeSnippet":"cl_image_tag(\"girl_camera.jpg\", array(\"transformation\"=>array(\n array(\"variables\"=>array(array(\"$name\", \"!Jen Fine!\"), array(\"$award\", \"!First!\"))),\n array(\"transformation\"=>array(\"photo_contest\"))\n )))","status":0,"statusText":"Ok","displayName":"PHP","packageName":"cloudinary_php","packageStatus":"legacy","packageVersion":"1.x"},{"sdkId":"java","framework":"java","language":"java","rawCodeSnippet":"cloudinary.url().transformation(new Transformation().variables(variable(\"$name\",\"!Jen Fine!\"),variable(\"$award\",\"!First!\")).chain() .named(\"photo_contest\")).imageTag(\"girl_camera.jpg\");","codeSnippet":"cloudinary.url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jen Fine!\"),variable(\"$award\",\"!First!\")).chain()\n .named(\"photo_contest\")).imageTag(\"girl_camera.jpg\");","status":0,"statusText":"Ok","displayName":"Java","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"ruby","framework":"ruby","language":"ruby","rawCodeSnippet":"cl_image_tag(\"girl_camera.jpg\", :transformation=>[ {:variables=>[[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]}, {:transformation=>[\"photo_contest\"]} ])","codeSnippet":"cl_image_tag(\"girl_camera.jpg\", :transformation=>[\n {:variables=>[[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]},\n {:transformation=>[\"photo_contest\"]}\n ])","status":0,"statusText":"Ok","displayName":"Ruby","packageName":"cloudinary","packageStatus":"","packageVersion":"1.x"},{"sdkId":"csharp","framework":"csharp","language":"csharp","rawCodeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation().Variables(\"$name\", !Jen Fine!).Chain() .Named(\"photo_contest\")).BuildImageTag(\"girl_camera.jpg\")","codeSnippet":"cloudinary.Api.UrlImgUp.Transform(new Transformation()\n .Variables(\"$name\", !Jen Fine!).Chain()\n .Named(\"photo_contest\")).BuildImageTag(\"girl_camera.jpg\")","status":0,"statusText":"Ok","displayName":".NET","packageName":"CloudinaryDotNet","packageStatus":"","packageVersion":"1.x"},{"sdkId":"dart","framework":"dart","language":"dart","rawCodeSnippet":"cloudinary.image('girl_camera.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t.addVariable(Variable.set(\"award\",\"First\"))\n\t.namedTransformation(NamedTransformation.name(\"photo_contest\")));","codeSnippet":"cloudinary.image('girl_camera.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t.addVariable(Variable.set(\"award\",\"First\"))\n\t.namedTransformation(NamedTransformation.name(\"photo_contest\")));","status":0,"statusText":"Ok","displayName":"Dart","packageName":"cloudinary_dart","packageStatus":"","packageVersion":"0.x"},{"sdkId":"swift","framework":"swift","language":"swift","rawCodeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation().chain() .setNamed(\"photo_contest\")).generate(\"girl_camera.jpg\")!, cloudinary: cloudinary)","codeSnippet":"imageView.cldSetImage(cloudinary.createUrl().setTransformation(CLDTransformation()\n .chain()\n .setNamed(\"photo_contest\")).generate(\"girl_camera.jpg\")!, cloudinary: cloudinary)","status":0,"statusText":"Ok","displayName":"iOS","packageName":"cloudinary","packageStatus":"","packageVersion":"3.x"},{"sdkId":"android","framework":"android","language":"android","rawCodeSnippet":"MediaManager.get().url().transformation(new Transformation().variables(variable(\"$name\",\"!Jen Fine!\"),variable(\"$award\",\"!First!\")).chain() .named(\"photo_contest\")).generate(\"girl_camera.jpg\");","codeSnippet":"MediaManager.get().url().transformation(new Transformation()\n .variables(variable(\"$name\",\"!Jen Fine!\"),variable(\"$award\",\"!First!\")).chain()\n .named(\"photo_contest\")).generate(\"girl_camera.jpg\");","status":0,"statusText":"Ok","displayName":"Android","packageName":"cloudinary-android","packageStatus":"","packageVersion":"1.x"},{"sdkId":"flutter","framework":"flutter","language":"flutter","rawCodeSnippet":"cloudinary.image('girl_camera.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t.addVariable(Variable.set(\"award\",\"First\"))\n\t.namedTransformation(NamedTransformation.name(\"photo_contest\")));","codeSnippet":"cloudinary.image('girl_camera.jpg').transformation(Transformation()\n\t.addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t.addVariable(Variable.set(\"award\",\"First\"))\n\t.namedTransformation(NamedTransformation.name(\"photo_contest\")));","status":0,"statusText":"Ok","displayName":"Flutter","packageName":"cloudinary_flutter","packageStatus":"","packageVersion":"0.x"},{"sdkId":"kotlin","framework":"kotlin","language":"kotlin","rawCodeSnippet":"cloudinary.image {\n\tpublicId(\"girl_camera.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t addVariable(Variable.set(\"award\",\"First\"))\n\t namedTransformation(NamedTransformation.name(\"photo_contest\")) \n}.generate()","codeSnippet":"cloudinary.image {\n\tpublicId(\"girl_camera.jpg\")\n\t addVariable(Variable.set(\"name\",\"Jen Fine\"))\n\t addVariable(Variable.set(\"award\",\"First\"))\n\t namedTransformation(NamedTransformation.name(\"photo_contest\")) \n}.generate()","status":0,"statusText":"Ok","displayName":"Kotlin","packageName":"kotlin-url-gen","packageStatus":"","packageVersion":"1.x"},{"sdkId":"jquery","framework":"jquery","language":"jquery","rawCodeSnippet":"$.cloudinary.image(\"girl_camera.jpg\", {transformation: [ {variables: [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]}, {transformation: [\"photo_contest\"]} ]})","codeSnippet":"$.cloudinary.image(\"girl_camera.jpg\", {transformation: [\n {variables: [[\"$name\", \"!Jen Fine!\"], [\"$award\", \"!First!\"]]},\n {transformation: [\"photo_contest\"]}\n ]})","status":0,"statusText":"Ok","displayName":"jQuery","packageName":"cloudinary-jquery","packageStatus":"","packageVersion":"2.x"},{"sdkId":"react_native","framework":"react_native","language":"react_native","rawCodeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","codeSnippet":"new CloudinaryImage(\"girl_camera.jpg\")\n .addVariable(set(\"name\", \"Jen Fine\"))\n .addVariable(set(\"award\", \"First\"))\n .namedTransformation(name(\"photo_contest\"));","status":0,"statusText":"Ok","displayName":"React Native","packageName":"cloudinary-react-native","packageStatus":"","packageVersion":"0.x"}]" parsed-url="{"url":"https:\/\/res.www.aaaalireno.com\/demo\/image\/upload\/$name_!Jen%20Fine!,$award_!First!\/t_photo_contest\/girl_camera.jpg","cloud_name":"demo","host":"res.www.aaaalireno.com","type":"upload","resource_type":"image","transformation":[{"$name":"!Jen Fine!","$award":"!First!"},{"transformation":"photo_contest"}],"transformation_string":"$name_!Jen Fine!,$award_!First!\/t_photo_contest","url_suffix":"","version":"","secure":true,"public_id":"girl_camera.jpg","extension":"jpg","format":"jpg","format_code":true,"signature":"","private_cdn":false,"result_asset_type":"image"}" with-url="true" > 加载代码示例

变换是唯一常数2500多年前希腊哲学家创建的短语, 但它从未比今天更真实超声波技术开发 和不间断改进 和UI设计新方向

静态值不再需要权衡图像变换码利用命名变换中的用户定义变量快速灵活调整,同时在各种媒体资产中实现最大值代码复用和一致性

文章展示出一连串思想启动自定义变量变换,但天空是极限用户定义变量支持所有云式计划,包括免费计划,所以,如果你尚没有云式账号,花几秒到获取免费账号并显示你有什么