Flipabit
  • Flipabit
  • Getting started
    • Flipabit overview
    • Create project
    • Run on device
    • Build
      • Build for iOS
      • Build for Android
      • Build for Desktop
    • Publish to App Stores
      • Submit to App Store
      • Submit to Google Play
  • Layers
    • Select layer
    • Change order, visibility and name
    • Copy and paste
    • Move layer
    • Resize layer
    • Rotate layer
    • Align layers
    • Arrange layers
    • Navigation layer
      • Display page title
      • Display Tab bar
      • Display Table of contents
      • Display Back button
      • Next/Prev buttons
      • Navigation actions
  • Pages
    • Add or delete page
    • Open page
    • Page background and overlay
  • Widgets
    • Image
    • Video
    • Text
    • PDF
    • Web
    • Diorama
    • Audio
    • Animation
    • Camera
    • YouTube
    • Map
    • Chart
    • Calendar
    • Table
    • Form
    • 3D Model
  • Groups
    • Add group
    • Move and resize group
  • Style
    • Opacity
    • Borders
    • Background
    • Opacity mask
    • Overlay
    • Margins
    • Blur
    • Copy and paste style
  • Interactivity
    • Navigate between pages
    • Maximize widget
    • Drag widget
    • Disable widget
  • Project
    • Resolution
    • Orientation
    • Status Bar
    • Settings
    • Publish settings
  • Animation
    • Page animation
    • Maximize animation
    • Position animation
    • Size animation
    • Size and position animation
    • Rotation animation
    • Opacity animation
    • Color animation
    • Blur animation
  • Actions
    • Actions Editor Overview
    • Add action
    • Suspend actions
    • Arguments
    • Delay action
    • Animation settings
    • Repeat action
  • Data & backend
    • Airtable
    • Google Sheets
  • Networking
  • Tutorials
  • API
    • Project
    • Page
    • Group
    • Widget
      • Image
      • Text
      • Video
      • Diorama
      • Audio
      • Web
      • Animation
      • Camera
      • YouTube
      • Map
      • Chart
      • Calendar
      • Table
      • Form
      • Record
      • 3d model
  • ⭐Updates
  • 🎁Get Flipabit
Powered by GitBook
On this page
  • Add animation
  • Change animation settings
  • Playback panel

Was this helpful?

  1. Widgets

Animation

Sequence of images or animated gif user can play

PreviousAudioNextCamera

Last updated 4 years ago

Was this helpful?

Add animation

To add animation:

  1. Select page

  2. Do one of the following:

    • Select Insert > Widgets > Animation

  3. Select video, multiple images or animated gif

Note: Video will convert to image sequence

Change animation settings

  1. Select Animation widget

  2. Open Widget Inspector

  3. Select Fill mode

  4. Select Frame rate to change playback speed Note: not supported for Animated GIF files

  5. Enable Autoplay to start playing when page is open

  6. Enable Loop to loop playback

Playback panel

  1. Select Animation widget

  2. Open Widget Inspector

  3. Select from Show playback list when to show playback panel:

    • Always: always show playback panel

    • Never: never show playback panel

    • Maximize: show playback panel when widget is maximized

  4. Customize playback panel:

    • Enter panel height in Height field

    • Select Background color Enable Blurred to add blur effect (will work only with translucent background).

    • Select Controls color

    • Select Slider color

Click on Toolbar