Beta 6.2.0
Hey all, great to be with you all. This is actually around my 6 month anniversary with Themeco as well. What a wild ride and it’s about to get even wilder with this new release. Would love your thoughts on this beta.
Also it was a request last beta to do this. But the zip file will use the folder “pro-6.2.0-beta1” so you can run this side by side with the branch that has auto updates. CS and X work the same too.
What’s new?
- The Lottie Element
- Tabs have a new tab element type which can accept child elements. Tabs also have looper support. Tabs had a slight rework to support with loopers. Accordions were already setup for it
- Accordions have a new tab element type which can accept child elements. Accordions also have looper support.
- Both Tabs and Accordions now default to this new type and auto adds a text element inside it to mock the behaviour of before
Unreleased in 6.1 branch
There are a few changes in this beta that will be in the next 6.1 release. We are planning to have this beta around for a couple of weeks and we will also probably always running a beta the next one being the two new stacks. If it drags on a little, I’ll update 6.2 to have any change 6.1 has if we do another round of beta testing.
- Sliders in Marquee mode works differently. It no longer lets you enter a transition and all marquees are forced into “Linear 0ms” mode. This was the workaround for getting marquee to work and since it will force this, the workaround is no longer needed. Transition was never really valid here as marquee is a contious speed.
- fix to scroll events which makes them more performant, and more passive listeners
- Audit and cleanup up of some state based performance issues in the App.
- When a modal opens, it sends a window resize event so canvas elements inside it resize themselves properly. To support a Lottie element inside a modal.
- Parameter groups have the same processing as a single parameter. If you used a global font inside a group it would return you our ID (like a global color ID) instead of the actual parameter value.
Lottie
An animation file created by AirBNB that let’s you use SVG animations in the browser. You can also render as a canvas or pure HTML.
Trigger types
These control when the animation should play
- Autoplay
- Play when visible
- Hover
- Click
- Scroll
How Lottie Element Scroll Works
I’ll explain this because it might not be obvious at first.
This is based on where the Element is in the viewport. Frame 1 would be where the top of the element is finally in the screen, and the final frame would be when the bottom of the element is finally off the screen. The viewport offset adds (or removes) to this so you can start the animation before it enters the screen or the animation starts after a certain percentage scrolled past.
Everything else is a little more obvious, and we’ll get a docs page on Lottie as well.