Skip to main content

Video Support

Display videos within HMI pages for cameras, presentations, or media content.

Overview​

Video support lets you embed videos directly into HMI pages. This is useful for:

  • Displaying camera feeds
  • Showing corporate videos
  • Playing instructional content
  • Broadcasting live streams

Supported Video Types​

TypeDescriptionBest for
MP4Standard video filesPre-recorded content, uploaded videos
YouTubeYouTube hosted videosEasy sharing, no hosting needed
note

HLS and RTSP streaming formats are available for advanced use cases.

Adding Videos to HMI Pages​

Videos are added in xDraw and configured through Video Settings:

In xDraw (Designer)​

  1. Open your HMI page in xDraw
  2. Add a Video element to the page
  3. Set the VideoSourceCode to match your Video Settings entry
  4. Position and resize as needed
  5. Save the .drwx file

In XReports (Settings)​

  1. Go to Settings → Video Settings
  2. Create a video source with the matching Code
  3. Configure the URL, playback options, and display settings

The Code in Video Settings must match the VideoSourceCode in your .drwx file.

Video Fit Modes​

Control how videos appear when their size doesn't match the container:

Cover Mode (Default)​

  • Fills the entire container
  • May crop edges if aspect ratios differ
  • Best for: Background videos, full-screen displays

Contain Mode​

  • Shows the complete video
  • Adds black bars if needed (letterboxing)
  • Best for: Camera feeds, content where edges matter

How to Change​

  1. Go to Settings → Video Settings
  2. Select the video source
  3. Change the Video Fit dropdown
  4. Click Save

Playback Options​

Configure how videos play:

OptionWhat it does
Auto PlayStarts playing automatically when the page loads
LoopRepeats the video when it ends
MutedPlays without sound
Show ControlsDisplays play, pause, and volume buttons

Lobby/Public Display:

  • Auto Play: On
  • Loop: On
  • Muted: On
  • Show Controls: Off

Control Room Camera:

  • Auto Play: On
  • Loop: Off (live feed)
  • Muted: On
  • Show Controls: Off

Training/Presentation:

  • Auto Play: Off
  • Loop: Off
  • Muted: Off
  • Show Controls: On

Thumbnail Images​

You can set a thumbnail (poster) image that shows before the video plays:

  1. Go to Settings → Video Settings
  2. Edit the video source
  3. Set the Thumbnail URL to an image file
  4. Save

The thumbnail displays:

  • Before the video starts playing
  • If the video fails to load (as a fallback)

When Videos Don't Play​

If a video cannot play (wrong URL, network issue, etc.), XReports shows a fallback display:

  • The thumbnail image (if set)
  • A placeholder graphic
  • An error message

This ensures your HMI page still looks presentable even if video fails.

Troubleshooting​

Video shows placeholder instead of playing​

  1. Check the video URL in Video Settings
  2. Test the URL directly in a browser
  3. Verify the video file exists and is accessible
  4. Check that the video source is enabled

Video is cropped (can't see edges)​

  1. Go to Video Settings
  2. Change Video Fit from "Cover" to "Contain"
  3. Save and refresh the page

Video has black bars​

This is normal in "Contain" mode when aspect ratios don't match. If you prefer full-screen:

  1. Change Video Fit to "Cover"
  2. Note: Some edges may be cropped

YouTube video not working​

  • Check the URL format (should be full URL like https://www.youtube.com/watch?v=...)
  • Some videos may block embedding
  • Check your internet connection

Video plays in HMI but not in Public Presentation​

Both use the same Video Settings. Check:

  1. The video source is enabled
  2. The Code matches between settings and .drwx file
  3. Refresh the presentation page

Tips​

For Best Performance​

  • Use MP4 format with H.264 encoding
  • Keep video files under 200MB
  • Use YouTube for large files to reduce server load

For Public Displays​

  • Always enable Auto Play and Loop
  • Enable Muted (sound can be startling)
  • Disable Show Controls (no one can click them)
  • Set an attractive Thumbnail for the loading state

For Camera Feeds​

  • Use Contain mode to see the full frame
  • Disable Loop (not applicable for live feeds)
  • Consider using HLS format for live streams