Gradient cannot be exported correctly. #1201

Danjuanlab · 2018-08-19T08:18:55Z

In a recent project, I tried to export the gradient layer with bodymovin, but found that the exported always black and white gradients. I have search several similar questions and answers. According to the prompt, I tried to save the AE file before exporting, and rename the gradient layer in English. But the result always fail.So I decided to start researching where the encoding problem caused the gradient export to fail.

Software version and system information:
Bodymovin version 5.2.1
OS: Win10

Test project 1: AE language Chinese, OS language Chinese. Result => black and white gradient (failure)
Test project 2: AE language English, OS language Chinese. Results => black and white gradient (failure)
Test project 3: AE language English, OS language English. Results => black and white gradient (failure)

When I tested project 3, I felt very strange when both languages had switched to English. Why did the result still fail? After several searches, I found out that the setting "non-unicode programming language" is still Chinese. So I set it in English, after restarting, AE can correctly export the gradient effect.

Test item 4: AE language English, OS language Chinese, non-unicode programming language

English.Results =>colorful gradient (success).
After the above test, I found that the reason for the failure is that the non-unicode programming language is not English. The following version of the bug fix can be tested in this direction.

yamsoil · 2018-08-22T02:40:36Z

牛逼！我总算找到答案了，老帅了！！！

mariondon · 2018-08-27T06:41:26Z

thanks a lot, found the answer

mariondon · 2018-08-27T06:44:22Z

就按照楼主写的操作绝对没问题简单的说就是把AE插件更新到最新版，把系统编码语言设置成英语，然后把AE语言设置成英语就行了

richiepu · 2018-08-27T13:05:03Z

@Danjuanlab Thanks a lot~!
按楼主的方法成功了感谢楼主 T_T
我的设备信息：Win10 X64 中文版，AE2018CC 中文版本
方法：
Step1、修改系统区域（系统需要重启）

Step2、修改AE语言为英语 en_US
按以上步骤操作后即可正常导出shape图层渐变数据

Danjuanlab · 2018-09-03T23:55:12Z

我没有mac环境,无法得知mac如何操作.不过BUG出现的原理上应该是相同的.尝试切换系统语言,和AE语言.

…

________________________________ 蛋卷电子商务

________________________________ 发件人: suhehe <notifications@github.com> 发送时间: 2018年8月29日 16:13:53 收件人: airbnb/lottie-web 抄送: Danjuanlab; Mention 主题: Re: [airbnb/lottie-web] Gradient cannot be exported correctly. (#1201) 请问mac要怎么操作？ ― You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub<#1201 (comment)>, or mute the thread<https://github.com/notifications/unsubscribe-auth/AoilZVS1dlS54S5ZLp6J8hNs16s1i2wbks5uVk1BgaJpZM4WC4J8>.

jljsj33 · 2018-10-11T09:44:05Z

mac 环境下更简单，只需将填充的中文名称改成英文.
留坑，免得后面用 mac 的人来找方案，点到你这还去改系统语言。。。。

#651 (comment)

richiepu · 2018-10-12T01:52:03Z

@bodymovin can bodymovin fixed the bug in self ？

RichardFu123 · 2018-10-17T09:50:49Z

666

unwantted · 2018-10-19T06:43:35Z

emmm我是按照以上把AE转化成英文，电脑系统语言改为英文，为什么导出还是黑白？

unwantted · 2018-10-19T06:44:37Z

unwantted · 2018-10-19T07:07:41Z

纯色可以渐变就不行。。

Danjuanlab · 2018-10-19T07:10:09Z

纯色可以渐变就不行。。

请仔细看看如何设置语言,一共有3个地方,一个是系统语言,一个是AE语言,一个是系统非unicode编码语言.

unwantted · 2018-10-19T09:30:35Z

谢谢！！可以了

jicheng0126 · 2018-11-26T07:35:26Z

My computer is mac,I cannot find "non-unicode programming language" .What should I do?

Danjuanlab · 2018-11-26T07:46:29Z

My computer is mac,I cannot find "non-unicode programming language" .What should I do?

The easiest solution is to change the language of AE to English, and then ensure that the name of the color fill is English, save the file before exporting with bodymovin!

jicheng0126 · 2018-11-26T12:39:01Z

My computer is mac,I cannot find "non-unicode programming language" .What should I do?

The easiest solution is to change the language of AE to English, and then ensure that the name of the color fill is English, save the file before exporting with bodymovin!

I changed the language of AE to English,and I ensured that the name of the color fill is English. But it still does't work. So, I want to change the non-unicode programming language to English, but in Mac I cannot find the place.

Danjuanlab · 2018-11-27T01:37:18Z

My computer is mac,I cannot find "non-unicode programming language" .What should I do?

The easiest solution is to change the language of AE to English, and then ensure that the name of the color fill is English, save the file before exporting with bodymovin!

I changed the language of AE to English,and I ensured that the name of the color fill is English. But it still does't work. So, I want to change the non-unicode programming language to English, but in Mac I cannot find the place.

Can you share your project screenshots and aep files?

jicheng0126 · 2018-11-27T03:51:33Z

My computer is mac,I cannot find "non-unicode programming language" .What should I do?

The easiest solution is to change the language of AE to English, and then ensure that the name of the color fill is English, save the file before exporting with bodymovin!

I changed the language of AE to English,and I ensured that the name of the color fill is English. But it still does't work. So, I want to change the non-unicode programming language to English, but in Mac I cannot find the place.

Can you share your project screenshots and aep files?

Thanks a lot! I already solve this problem. I just changed another computer and changed the language of AE to English, and then it worked! The language of my computer system is still Chinese. It's amazing.

hhzx · 2018-12-29T16:49:10Z

有没有办法不修改Unicode也能正常输出，因为改了Unicode会有很多意想不到的其他连锁反应很多其他软件都乱码了很不方便

jicheng0126 · 2018-12-29T16:52:13Z

我换了一台笔记本，没有改unicode，其他按照要求做，然后就正常输出了。

hhzx · 2018-12-29T16:52:20Z

Is there any way to output normally without modifying Unicode, because changing Unicode will have many unexpected chain reactions, modifying Unicode will cause a lot of software chaos, which will cause great inconvenience.

hhzx · 2018-12-29T17:05:00Z

我换了一台笔记本，没有改unicode，其他按照要求做，然后就正常输出了。

同样我也换了一台电脑，并安装所有操作执行，唯独没有修改Unicode 还是无法正常导出。只能靠修改Unicode后才能正常导出。真心希望获得插件大大的继续优化与支持。感恩

pepper213 · 2019-01-17T13:04:38Z

Success!我已经改成功啦！！我是IMAC装的2017版、2018版的AE软件，研究了楼上好几位朋友的方法。 1:把系统语言改成英文的，2：AE软件语言改成英文版本的，3:X我找不到Unicode在哪里修改。后来机缘巧合还之下，解决啦！打开HD（你的系统盘）——资源库——Application Support—Adobe—找的Adobe After Effects CC 2018（这里也适用于其他CC版本的AE）——AMT，5.点右键用文本打开application.xml这个文件，6.打开以后，不要被它一堆的字母所打败，你只要细心找到你要的就好。查找zh_CN,然后把zh_CN替换为en_US就OK啦

jicheng0126 · 2019-01-17T17:13:22Z

Success!我已经改成功啦！！我是IMAC装的2017版、2018版的AE软件，研究了楼上好几位朋友的方法。 1:把系统语言改成英文的，2：AE软件语言改成英文版本的，3:X我找不到Unicode在哪里修改。后来机缘巧合还之下，解决啦！打开HD（你的系统盘）——资源库——Application Support—Adobe—找的Adobe After Effects CC 2018（这里也适用于其他CC版本的AE）——AMT，5.点右键用文本打开application.xml这个文件，6.打开以后，不要被它一堆的字母所打败，你只要细心找到你要的就好。查找zh_CN,然后把zh_CN替换为en_US就OK啦

人多力量大！

jicheng0126 · 2019-01-17T17:14:59Z

我换了一台笔记本，没有改unicode，其他按照要求做，然后就正常输出了。

同样我也换了一台电脑，并安装所有操作执行，唯独没有修改Unicode 还是无法正常导出。只能靠修改Unicode后才能正常导出。真心希望获得插件大大的继续优化与支持。感恩

国内外语言环境不同，这个真的是一些插件的bug。

VeiZhang · 2019-02-25T08:24:11Z

Perfect 💖💖

wyfang · 2019-05-05T08:33:18Z

请求macOS系统如何解决？

wyfang · 2019-05-05T08:34:52Z

希望官方可以解决这个问题，因为旧版本就不会有这个问题。是突然某个版本更新后才有这个问题的。

wyfang · 2019-11-20T07:55:42Z

mac 环境下更简单，只需将填充的中文名称改成英文.
留坑，免得后面用 mac 的人来找方案，点到你这还去改系统语言。。。。

#651 (comment)

我修改了名称也不行啊？！

Danjuanlab · 2019-11-20T08:09:12Z

mac 环境下更简单，只需将填充的中文名称改成英文.
留坑，免得后面用 mac 的人来找方案，点到你这还去改系统语言。。。。

#651 (comment)

我修改了名称也不行啊？！

图层的各个层级都要改成英语，比如contents -1 -Gradient fill1，推荐用英文版AE。

Yeoneuik · 2019-12-19T14:31:58Z

My God Thank you!! I was struggling with this problem for a month!!! A MONTH!! And just before the moment I was going to send an e-mail to Bodymovin Team, I found your solution and it worked!! This is the first time I saw a gradient in my project... Thank you so much again!

BirdFish · 2020-09-27T11:08:52Z

确认：如果更换语言什么都试了还有问题了，那么动画中肯定用到渐变，可以去掉渐变图层（让UI找替代方案），就可以正常导出文件了！

destiny5420 · 2020-11-13T05:28:16Z

我已經將AE、OS及non-unicode的語言都修正為英文, 結果在reander時卻無法正確執行，有人遇過相同的狀況嗎?
I have set the language of AE, OS and non-unicode to English, but it cannot be executed correctly when reander. Has anyone encountered the same situation?

如果我將non-unicode改為中文，輸出即可正常
If I change non-unicode to Chinese, the output will be normal

Danjuanlab · 2020-11-26T08:43:28Z

我已經將AE、OS及non-unicode的語言都修正為英文, 結果在reander時卻無法正確執行，有人遇過相同的狀況嗎?
I have set the language of AE, OS and non-unicode to English, but it cannot be executed correctly when reander. Has anyone encountered the same situation?

如果我將non-unicode改為中文，輸出即可正常
If I change non-unicode to Chinese, the output will be normal

下午测试了下，并没有发现你说的在修改完语言后无法导出的问题，我在AE19和20版本都测试，均可以正常导出渐变

destiny5420 · 2020-11-26T09:08:07Z

@Danjuanlab 謝謝你的測試, 我再持續查找是否為電腦其餘設定錯誤問題

Gorialis · 2021-07-02T16:24:43Z

I have figured out the cause of this issue and would like to patch it, but it seems only the web player (and not the extension) is open source.

When scanning for gradient data, the bodymovin extension actually opens and reads the AE file directly and extracts substrings out of it to find the gradient points (this explains why saving your file is a necessary part of any workaround).

Adobe ExtendScript automatically opens files in your system encoding, which often means for non-English locales it results in an encoding mess that it can't traverse through.

In bodymovin.zxp/jsx/utils/ProjectParser.jsx, there exists this linespan:

    function getProjectData(){
        var proj = app.project;
        var ff = proj.file;
        if(!ff) {
            fileString = '<no file>';
        } else {
            var demoFile = new File(ff.absoluteURI);
            demoFile.open('r', 'TEXT', '????');
            //demoFile.encoding = 'UTF-8';
            fileString = demoFile.read(demoFile.length);
        }
    }

It appears some effort was made to address this at some point, but reverted for an unknown reason? Changing this to the following fixed the issue for me on all locales I tried:

    function getProjectData(){
        var proj = app.project;
        var ff = proj.file;
        if(!ff) {
            fileString = '<no file>';
        } else {
            var demoFile = new File(ff.absoluteURI);
            demoFile.encoding = 'BINARY';
            demoFile.open('r', 'TEXT', '????');
            fileString = demoFile.read(demoFile.length);
        }
    }

Here is a pre-patched bodymovin 5.7.11 with this fix in place. This should allow gradients to be exported even on non-English locales: bodymovin.zxp

Hopefully at some point we will see this fix (or a better one) implemented officially. This is a big annoyance for non-English users.

bodymovin · 2021-07-10T23:11:47Z

@Gorialis hi, the extension is available here:
https://github.com/bodymovin/bodymovin-extension
but from my tests in the past, using the binary encoding didn't solve it. willing to give it another try though.

zhangbenber · 2021-12-17T12:05:31Z

Digged a bit more thanks to @Gorialis's solution, which solves the problem due to system locale settings, but not due to Chinese layer names. I tried to encode the navigation strings into binary byte strings too, so it can now run correctly without any changes for CJK users!

See PR.

JSRM1018 · 2023-12-08T03:15:18Z

太神了我終於解開了~~
改了語系也不行，原來是在
系統管理語言設定 > 非 Unicode > English (U.S)

hhzx mentioned this issue Dec 29, 2018

Gradient cannot be exported correctly.Follow-up issues on this issue. #1436

Closed

bodymovin mentioned this issue Jan 17, 2019

Export color error and html can't be displayed #1465

Closed

VeiZhang mentioned this issue Feb 25, 2019

Bodymovin not rendering gradients correct #1495

Closed

Danjuanlab mentioned this issue Jun 15, 2019

Gradient renders black and white in after effects #1675

Open

bodymovin mentioned this issue Apr 11, 2020

The gradation appears in black and white. #2082

Closed

bodymovin mentioned this issue Oct 20, 2020

B&W Gradient problems - not related to AE Language bodymovin/bodymovin-extension#56

Closed

Danjuanlab mentioned this issue Dec 6, 2020

Gradient not working #2384

Closed

ebelair mentioned this issue Jan 8, 2021

Trim Path on Gradient Stroke is stretched and jittery on iOS airbnb/lottie-ios#1194

Closed

4 tasks

shiloharbi mentioned this issue Mar 14, 2021

gradient turns black and white while exporting json file #2494

Open

zhangbenber mentioned this issue Dec 17, 2021

Support non-ascii gradient data bodymovin/bodymovin-extension#104

Open

Gradient cannot be exported correctly. #1201

Gradient cannot be exported correctly. #1201

Comments

Danjuanlab commented Aug 19, 2018

yamsoil commented Aug 22, 2018

mariondon commented Aug 27, 2018

mariondon commented Aug 27, 2018

richiepu commented Aug 27, 2018 • edited

Danjuanlab commented Sep 3, 2018 via email

jljsj33 commented Oct 11, 2018 • edited

richiepu commented Oct 12, 2018

RichardFu123 commented Oct 17, 2018

unwantted commented Oct 19, 2018

unwantted commented Oct 19, 2018

unwantted commented Oct 19, 2018

Danjuanlab commented Oct 19, 2018

unwantted commented Oct 19, 2018

jicheng0126 commented Nov 26, 2018

Danjuanlab commented Nov 26, 2018

jicheng0126 commented Nov 26, 2018

Danjuanlab commented Nov 27, 2018

jicheng0126 commented Nov 27, 2018

hhzx commented Dec 29, 2018

jicheng0126 commented Dec 29, 2018

hhzx commented Dec 29, 2018

hhzx commented Dec 29, 2018 • edited

pepper213 commented Jan 17, 2019 • edited

jicheng0126 commented Jan 17, 2019

jicheng0126 commented Jan 17, 2019

VeiZhang commented Feb 25, 2019

wyfang commented May 5, 2019

wyfang commented May 5, 2019

wyfang commented Nov 20, 2019 • edited

Danjuanlab commented Nov 20, 2019

Yeoneuik commented Dec 19, 2019

BirdFish commented Sep 27, 2020

destiny5420 commented Nov 13, 2020

Danjuanlab commented Nov 26, 2020 • edited

destiny5420 commented Nov 26, 2020 • edited

Gorialis commented Jul 2, 2021

bodymovin commented Jul 10, 2021

zhangbenber commented Dec 17, 2021

JSRM1018 commented Dec 8, 2023

richiepu commented Aug 27, 2018 •

edited

jljsj33 commented Oct 11, 2018 •

edited

hhzx commented Dec 29, 2018 •

edited

pepper213 commented Jan 17, 2019 •

edited

wyfang commented Nov 20, 2019 •

edited

Danjuanlab commented Nov 26, 2020 •

edited

destiny5420 commented Nov 26, 2020 •

edited