Movement’s media controls give creators control over how they build their apps with images, video and audio. Creators have options to loop video, loop audio, hide controls, set video as a background without any interruption.
​

To access the media control’s for a block that contains image, video, or audio, simply click on the block and a media controls sidebar will slide in on the right of the admin. The media controls sidebar will vary slightly depending on what type of block you’re editing.

The sidebar with the media controls will look like the picture below for an image block:

At the top, you will see the image that is currently occupying the block, and the option to crop, edit or replace it.
​
You will also see the option to choose what image Fit you would like. You can choose between Cover or Contain.

Check out the short video below that demonstrates the difference between cover and contain as the block height is adjusted.

Other options in the image formatting sidebar include the ability to Add Video & Audio to the block, and define ‘On Tap‘ which will allow you define a specific URL, content item, purchase trigger, form or popup when members click the image.

You will also see a Display section where you can specify the image’s height in px or %. If the image height is in ‘px’ you will see three distinct options to fine-tune the image presentation across different screen sizes.: Fixed, Adapt and Retain. For more information on how these scaling options work, check out our Image Scaling guide.
​

💡 Note: Images with a height of ‘# px’ will be set to ‘Adapt’ by default. These scaling options are not applicable to images with a height of ‘# %’, as % is relative to the viewport height, and therefore already scales.
​

Under the display section you will also see ‘Radius’ and ‘Opacity’ sliders that you can adjust as needed. The higher the Radius value, the more rounded the corners of the image will be. The lower the Opacity value is, the more transparent the image will be. So if an image is given an opacity of 0 , it would be invisible.
​

You will also see Spacing sliders that you can play around with to adjust the spacing of the block relative to blocks above and below it, and also the horizontal spacing.

Expanding the Background dropdown allows you to choose the background color for the block. Click on the color to expand the Colors window as shown below. You can choose from a list of options including the brand color that you specify in your global app settings.
​

The formatting sidebar for audio blocks is exactly the same as the one for image blocks (as discussed above you can also add audio or video to an existing image block), except you will see the Video & Audio dropdown populated with an audio file that you can choose to replace with whatever you want. You will also have the ability to Loop the audio file, which will replay it infinitely.
​

The formatting sidebar for video blocks is largely the same as the one for image & audio blocks. You will see the Video & Audio dropdown populated with a video file that you can choose to replace with whatever you want. You will see two additional expandable sections underneath the video file, ‘Video Settings’ and ‘On Finish’.

The Video Settings section offers some powerful features such as the ability to loop, autoplay and show or hide the video controls to whoever is viewing the video.
​
These settings are really useful if want to use background videos for your homepage or anywhere within your app.
​
You can also change the Fit (cover or contain) and Orientation of the video (Landscape or Portrait) from this menu.
​
The On Finish dropdown menu allows you to define a form or product to be triggered when the user completes the video.
​

💡 Note: Autoplay videos will always be muted by default so they aren’t distracting if used for a background video, for example.