The Draftbit Docs

Welcome to the Draftbit documentation. You'll find comprehensive documentation and information to help you start working with Draftbit as quickly as possible, as well as support if you get stuck. Let's jump right in!

Get Started    

Media

Components that help further define the structure and feel of the screen.

Image

A component for displaying different types of images.

❗️

Make sure the Image file name begins with a letter, not a number!

Configuration

Parameter

Description

Image Source

Select an image that has been uploaded to the builder or upload a new one.

Resize Mode

Set how to resize the image when the dimensions set in the component don't match the actual dimensions of the image. Refer to the Resize Mode table below to learn more about each setting.

Resources

React Native Docs
Expo Docs

Image Background

A component that allows you to set a background image to cover the entire screen.

❗️

Make sure the Image file name begins with a letter, not a number!

Configuration

Parameter

Description

Image Source

Select an image that has been uploaded to the builder.

Overflow

Allows you to set the behavior of the image when it extends beyond the boundaries of the container.

Resize Mode

Set how to resize the image when the dimensions set in the component don't match the actual dimensions of the image. Refer to the Resize Mode table below to learn more about each setting.

Resources

React Native Docs
Expo Docs

Video

A component that displays a video.

❗️

YouTube videos are not currently supported. Please use a video in a .mp4 or .mov format.

Configuration

Parameter

Description

Playback Rate

Set a number between 0 and 32 to control the playback rate of the video.

Video URL

Paste the URL of the video to be loaded into the component.

Volume

Allows you to set a number between 0 (mute) and 1 (maximum) to control the video audio, defaults to .5.

Mute

Enable to mute the video.

Allow Looping

Enable to loop the video.

Use Thumbnail

Enable so that a thumbnail will appear when the video is not playing.

Resize Mode

How the video will be resized when its dimensions set for the component don't match the actual dimensions of the video.

Play on Load

Enable so that the video will play when loaded.

Thumbnail Source

Select an image that has been uploaded to the builder or upload a new one to be used as a thumbnail for the video.

Starting Point

Set the time the video will begin to play.

Use Native Controls

Enable to give users the ability to play/pause the video.

Resources

Expo Docs

Web View

A component that renders a website on the screen in a native view.

Configuration

Parameter

Description

Website url

The url of the page to be loaded in the Web View

Scroll Bounce

Enable so that the page slightly bounces once the user reaches the top or the bottom of the page.

Content Inset

The amount of padding applied to the web content inside the Web View container.

Scrollable

Enable or disable scrolling in the Web View.

Scale Page to Fit

Enable so that the website automatically scales itself down to fit the size of the web view.

Inline Video Playback

When enabled, HTML5 videos will play as they would in a normal browser instead of the native, full-screen mode.

User Controls Media Playback

Enable to allow the user is able to control when video or audio on the screen plays/stops.

Resources

React Native Docs
Expo Docs

Audio Player

A component that allows you to play audio.

Configuration

Parameter

Description

URL

The URL of the audio file to be played.

Updated 3 months ago


Media


Components that help further define the structure and feel of the screen.

Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.