-
-
Notifications
You must be signed in to change notification settings - Fork 3.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
add support for video Export usage #30
Comments
Im not sure what it would take to support this but I will add it to our research list! |
Is there any progress in this issue? I am also trying to add Lottie animation to video. |
Try Lottie 2.0! It now more closely follows CAAnimaiton rules. |
I can confirm that it's possible to include Lottie animations when exporting videos with AVFoundation. I'm using version 2.0.5. |
Do you have code that enables this?
…On Mon, Aug 21, 2017 at 4:38 AM jakob svenningsson ***@***.***> wrote:
I can confirm that it's possible to include Lottie animations when
exporting videos with AVFoundation. I'm using version 2.0.5.
—
You are receiving this because you are subscribed to this thread.
Reply to this email directly, view it on GitHub
<#30 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AMwOz-zo6GrgGVxhjvTUMbYQu9syoE1sks5saWw8gaJpZM4L3HTw>
.
|
You just add the layer from the LOTAnimatioView class the same way as if you'd add a normal CALayer to a video using AVFoundation. I can recommend the following tutorial: https://www.raywenderlich.com/30200/avfoundation-tutorial-adding-overlays-and-animations-to-videos. In However there is one difference. I had to call the play method of the LOTAnimationView class before I merged it with the videolayer. |
Thanks. Actually it doesn't quite work well.
However the animation is actually not rendered correctly depending on
device etc.
The animation timespace is not linked to the video timespace so you'll
notice that timing is off.
…On Mon, Aug 21, 2017 at 1:24 PM Jakob svenningsson ***@***.***> wrote:
You just add the layer from the LOTAnimatioView class the same way as if
you'd add a normal CALayer to a video using AVFoundation. I can recommend
the following tutorial:
https://www.raywenderlich.com/30200/avfoundation-tutorial-adding-overlays-and-animations-to-videos.
In However there is one difference. I had to call the play method of the
LOTAnimationView class before I merged it with the videolayer.
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
<#30 (comment)>,
or mute the thread
<https://github.com/notifications/unsubscribe-auth/AMwOzzJ9YnTYINGUyzXjxkzc-THtRrBKks5saeeEgaJpZM4L3HTw>
.
|
You have to change the FPS of the animation to the same FPS as your recording. You also have to set the start frame manually in order to sync the animation with the video. If you save the process of the animation when you start record, you can set the start of the animation like this:
|
@jakobsvenningsson - I did try your method but it's not working at saving time with avexportsession. I made one method to start animation at static time like below
I am adding LOTAnimationView layer in overlay layer. But animation is not working. |
Just tried myself with no luck. The animation is not playing at all. I have called play as well as set the frame and the speed. Are there any special requirements of the After Effects file? Is there an option to not remove on completion in after effects? |
Animation will not work in AVAssetExport session for new Lottie. Use Lottie 1.0. In new one they shifted all animation logic to frame by frame. And this will cause timing issue and slowness of animation at export. @buba447 - Will you please go back to Lottie 1.0 like animation for future versions? Because even in current version if we will have multiple heavy tasks of ARKIT or COREML then this frame by frame animation causing delays. And everything seems to work in Lottie 1.0. But there are so many limitations in it. Even in new Lottie animation stops after pushing to new view controller. OR putting app in background. |
using Lottie v2.1.4 and the animation (using "LottieLogo2") renders and runs following AVAssetExportSession will tinker with it as I literally just added it to my app. |
@amrittrivedir i use lottie-ios 1.0.4, and i found when export custom layer property animation(LOTStrokeShapeLayer), it will not work, the preview is ok, but the other properties are ok(preview&export). |
Could someone provide working code? |
@jakobsvenningsson
|
@hezhk3 I once used animationView like you, add animationView.layer to superLayer, but it didn't now. |
@SamChenzx I was using 2.5.0 and there's no update since then. |
I managed to get the animations to play in the rendered video by adding the LOTAnimationView as a subview to self.view before playing them and attaching the layer to the scene. This only worked on the device and not the simulator. Next I set the framerate of the video using Basically my final blocker is that the framerates of the animations are variable and tied to something other than the framerate of the video itself, has anyone encountered a solution for this yet? |
I successfully exported video |
@syyjay Can you please share your solution? |
Have you solved the whole problem |
CALayer *parentLayer = [CALayer layer];
|
animationStart ,How do you compute this value |
I have the same problem. Have you solved it? |
I have a demo about how to render Lottie in video. |
You can draw the animation image frame by frame to export.
|
Lottie has been completely rewritten in Swift as of 3.0 (#777) I am closing all issues prior to this release to reduce the noise. If you continue to run into this issues or any issue with Lottie 3.0 please open a new ticket For continued support of Lottie Objective-c please point to this branch: https://github.com/airbnb/lottie-ios/tree/lottie/objectiveC |
Lottie 3.0 supports exporting using AVAssetExportSession? |
@ben73 could you provide example code, please? :) |
Can this issue be reopened? Facing the issue with non-uniform animation speed (which might be the reason as we are kind of recording the lottie-animation by adding in to the view and playing before inserting it into the animationTool flow) |
I created demo project with both @lvpengwei uses We need some AVFoundation + CoreAnimation genius here |
I can export video from lottie 3.0+ or 2.5.3; But the animation speed is always wrong in the video. Can someone helps? |
@mayqiyue |
You mean through screen recorder? That’s two slow.
hezhk3 <notifications@github.com>于2019年12月9日 周一20:35写道:
… @mayqiyue <https://github.com/mayqiyue>
That's because lottie animation runs in a different time with export
session.
You should export lottie animation frame by frame, then add to your video.
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#30?email_source=notifications&email_token=ABQZYVYBGUVCLD6L2BSQM6DQXY3RRA5CNFSM4C64OTYKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEGJAPUY#issuecomment-563218387>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ABQZYV6ZF3FEC6EN7BMMM5LQXY3RRANCNFSM4C64OTYA>
.
|
Yes, that's the only way currently. @mayqiyue |
Ok, thx for your reply
hezhk3 <notifications@github.com>于2019年12月9日 周一20:58写道:
… You mean through screen recorder? That’s two slow. hezhk3
***@***.***于2019年12月9日 周一20:35写道:
… <#m_7553585765126834425_>
@mayqiyue <https://github.com/mayqiyue> https://github.com/mayqiyue
That's because lottie animation runs in a different time with export
session. You should export lottie animation frame by frame, then add to
your video. — You are receiving this because you were mentioned. Reply to
this email directly, view it on GitHub <#30
<#30>?email_source=notifications&email_token=ABQZYVYBGUVCLD6L2BSQM6DQXY3RRA5CNFSM4C64OTYKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEGJAPUY#issuecomment-563218387>,
or unsubscribe
https://github.com/notifications/unsubscribe-auth/ABQZYV6ZF3FEC6EN7BMMM5LQXY3RRANCNFSM4C64OTYA
.
Yes, that's the only way currently. @mayqiyue
<https://github.com/mayqiyue>
Or if you are not using any new features, you can try to export with
animation tool at Lottie 1.0.4, according to @lvpengwei
<https://github.com/lvpengwei> . LottieInVideo
<https://github.com/lvpengwei/LottieInVideo>
—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
<#30?email_source=notifications&email_token=ABQZYVZ4OEFORNC4CVHTJZTQXY6I3A5CNFSM4C64OTYKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEGJCSRQ#issuecomment-563226950>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/ABQZYVYS37CECMYCHOXHL3TQXY6I3ANCNFSM4C64OTYA>
.
|
How does animationTool work in AVMutableVideoComposition()? Can anyone describe the inner mechanism of animationTool? Is it responsible for slower exporting? |
Is it possible now, with new CoreAnimation engine? |
Sorry what is the new CoreAnimation engine? Or do you mean if this is possible? |
the new release says a lot about this new engine. So maybe now we can export lottie animations through
I will check later anyway, but maybe it's obvious for maintainers already |
Just curious, what use case do folks have for exporting a Lottie animation to a video file? It seems technically feasible but I'm not sure exactly why you would want / need to do that. |
@calda Designers create beautiful complex compositions in after effects and export them with You can check templates in applications like Bazaart |
Oh wow, that's cool! Very nice. |
example.of.lottie.mp4very simplistic example of an export with lottie from iOS. I think the lack of duration and begin time hold Lottie back in terms of export with the apple frameworks. The only way I know to do this is running it inside a custom compositor because you can run it like a clock using frame time. Then the next bottleneck is in the snapshotting technique. I am not really familiar with the inner workings of lottie as its complexity seemed it must be running on a display link or something |
Yeah, the Main Thread rendering engine basically uses a display link. The new Core Animation engine uses |
Yeah it is possible to export as I did above. I guess the big question to understand how to build this out would be why use the display link if CAAnimations are used? Is it because some of the animations are custom keypaths or are full rerenders used at points in certain animations? I am guessing this is the case as well. If so then exporting running a wall clock type style is the only way. |
The Main Thread rendering engine uses a display link because it doesn't use |
So maybe it's as simple as being able to toggle removedOnCompletion = false and change beginTime to AVCoreAnimationBeginTimeAtZero + beginTime...maybe a global isExporting on the AnimationView |
@damikdk Now, you can try PAG, which is designed for a video editor. and it can run on iOS/Android/Mac/Windows/Linux/Web with the same CPP code. |
@lvpengwei it seems PAG does everything we are asking in this thread if I am not reading their git page wrong. so maybe this is not needed from Lottie? Are there features missing? The bottleneck you mention above is the snapshoting technique and no matter the context you use it will be slow because of main thread rendering. Actually your use of drawHierarchy is partially GPU bound so you are doing it pretty efficient. To be faster the Lottie view would have to not be updated based on time and the native rending of the animation tool would be faster. There is a way to do what you are doing exponentially faster but it is a private framework. I look in release notes often to see if it has made it public but so far it has not. |
@agibson73 PAG is just like Lottie, use an AE plugin to export pag files and render them using libpag sdk on multiple platforms. PAG uses binary serialization which is TLV, so the pag file is smaller than Lottie's JSON file in most cases. If the feature is not supported, you can export the pre-composition as sequence frames that are webp or video. BMP guide The snapshot way before, copy data from GPU to CPU and then send to GPU. PAG uses OpenGL ES just like skottie to render on an arbitrary thread. with iOS, you can use a CVPixelBuffer as the render target, and then combine it with video, The whole process is on the GPU side. pag-ios-demo |
@lvpengwei I know this is a very old thread. Do you know if it is possible for PAG to be added to a CALayer to overlay a video? I asked this question in a libpag discussion as well - Tencent/libpag#2330 |
I want to export this amazing animation into my video file with AVFoundation.
but the animation does not shown in the composed video. I thought the animation begin time is not correct. It should be
AVCoreAnimationBeginTimeAtZero
can you add this feature in this amazing animation library ?
The text was updated successfully, but these errors were encountered: