Built-in Rive Functions
These rive functions are available as a part of fastn and can be used in any fastn document. Checkout built-in functions to know more about other functions available in fastn.
Functions for Rive Timeline
These functions are applied to rive timeline.
ftd.toggle-play-rive(rive: string, input: string)
Return type: void
It plays an animation, if the animation is not playing, or else pauses it.
It takesrive which is the id provided while declaring a rive component. It also takes input which is the timeline name.Sample code using
ftd.toggle-play-rive(...)Input
-- ftd.rive: id: vehicle src: https://cdn.rive.app/animations/vehicles.riv autoplay: false artboard: Jeep width.fixed.px: 600 -- ftd.text: Idle/Run $on-click$: $ftd.toggle-play-rive(rive = vehicle, input = idle) align-self: center
Lang:
ftd
Output
Idle/Run
ftd.play-rive(rive: string, input: string)
Return type: void
It plays an animation.
It takesrive which is the id provided while declaring a rive component. It also takes input which is the timeline name.ftd.pause-rive(rive: string, input: string)
Return type: void
It pauses an animation.
It takesrive which is the id provided while declaring a rive component. It also takes input which is the timeline name.Sample code using
ftd.play-rive(...) and ftd.pause-rive(...)Input
-- ftd.rive: id: bell src: $fastn-assets.files.assets.bell-icon.riv autoplay: false width.fixed.px: 200 $on-mouse-enter$: $ftd.play-rive(rive = bell, input = Hover) $on-mouse-leave$: $ftd.pause-rive(rive = bell, input = Hover)
Lang:
ftd
Output
Functions for Rive State Machine
These functions are applied to rive state machine.
ftd.fire-rive(rive: string, input: string)
Return type: void
It fires trigger identify by input.
rive which is the id provided while declaring a rive component. It also takes input which is the trigger type input in state machine.Sample code using
ftd.fire-rive(...)Input
-- ftd.rive: id: van src: https://cdn.rive.app/animations/vehicles.riv width.fixed.px: 400 state-machine: bumpy $on-click$: $ftd.fire-rive(rive = van, input = bump)
Lang:
ftd
Output
ftd.set-rive-integer(rive: string, input: string, value: integer)
Return type: void
It take the number type input and sets the value
It takesrive which is the id provided while declaring a rive component, input which is the number type and value which is set to the input.Sample code using
ftd.set-rive-integer(...)Input
-- ftd.rive: id: helix-loader src: $fastn-assets.files.assets.helix-loader.riv width.fixed.px: 400 state-machine: State Machine $on-click$: $ftd.set-rive-integer(rive = helix-loader, input = Load Percentage, value = 50)
Lang:
ftd
Output
ftd.toggle-rive-boolean(rive: string, input: string)
Return type: void
It take the number type input and sets the value
It takesrive which is the id provided while declaring a rive component and input which is the boolean type.Sample code using
ftd.toggle-rive-boolean(...)Input
-- ftd.rive: id: toggle src: $fastn-assets.files.assets.toggleufbot.riv state-machine: StateMachine width.fixed.px: 400 -- ftd.text: Click me $on-click$: $ftd.toggle-rive-boolean(rive = toggle, input = Toggle)
Lang:
ftd
Output
Click me
ftd.set-rive-boolean(rive: string, input: string, value: boolean)
Return type: void
It take the number type input and sets the value
It takesrive which is the id provided while declaring a rive component, input which is the boolean type and value which is set to the input.Sample code using
ftd.set-rive-boolean(...)Input
-- ftd.rive: id: mousetoggle src: $fastn-assets.files.assets.toggleufbot.riv state-machine: StateMachine width.fixed.px: 400 $on-mouse-enter$: $ftd.set-rive-boolean(rive = mousetoggle, input = Toggle, value = true) $on-mouse-leave$: $ftd.set-rive-boolean(rive = mousetoggle, input = Toggle, value = false)
Lang:
ftd
Output
Getting Help
Have a question or need help?
Visit our GitHub Q&A discussion to get answers and subscribe to it to stay tuned.
Join our Discord channel and share your thoughts, suggestion, question etc.
Connect with our community!Found an issue?
If you find some issue, please visit our GitHub issues to tell us about it.
Quick links:
Join us
We welcome you to join our Discord community today.
We are trying to create the language for human beings and we do not believe it would be possible without your support. We would love to hear from you.
Copyright © 2023 - FifthTry.com
