Add a Video Player Widget

About this task

Use the Video Player widget to play videos directly within your app. Play your corporate videos or link to videos from other sites such as YouTube or Vimeo.
Note: Things to know about this widget:
  • Android and iOS devices are supported.
  • Only .mp4 and .mov video formats are valid.
  • This widget is recommended in place of the YouTube widget for new apps. Future versions of SOTI Snap may not include the YouTube widget.

Procedure

  1. In the Canvas, open the Widgets tab.
  2. Drag and drop the Video Player widget onto the app canvas.
    Video Player widget in the Widgets tab
  3. In the Video Player Properties panel, enter an ID and Name for the widget, or keep the defaults.
  4. In the Player Thumbnail section, click New Image and select an image to display in the widget before any video starts. The image scales and crops to fit in the widget window. To delete a thumbnail, hover your mouse over the image and click Delete. Supported formats include:
    • .png
    • .pjpeg
    • .jpeg
    • .jpg
  5. In the Playlist section, click Edit next to the first video row in the list and add the Video Name. You can add a local video (Android 9 and earlier only), an online video, or upload a video to your SOTI Snap hosting service:
    OptionDescription
    Local The following steps are only supported on Android 9 and earlier:
    1. You cannot put files on a device until the permissions allow it. Send the following permissions script commands using SOTI MobiControl before you place video files on the device: 
      request_appops_permission WRITE_INTERNAL_STORAGE
request_appops_permission READ_INTERNAL_STORAGE
request_appops_permission MANAGE_EXTERNAL_STORAGE

      This is required only once for the app on the device.

    2. In Path, enter the full path to the online video, starting with file:// and ending with the .mp4 or .mov video file name.

      Sample online video configuration

    3. Click Save.
    Note: Videos can be pushed to the device using SOTI MobiControl File Sync Rules.
    Online
    1. In Path, enter the full path to the online video, starting with http:// or https:// and ending with the .mp4 or .mov video file name.

      Sample online video configuration

    2. Click Save.
    Note: The Video Player supports YouTube and Vimeo paths.
    Hosted
    1. Beside Video Source, click Add. A File Explorer window opens.
    2. Go to the video you wish to upload and click Open. The Video Source reflects your choice.

      Sample uploaded video configuration

    3. Click Save.
    Note: The maximum video upload size is 50 MB.
  6. To add a video to the playlist, click Add. The videos will play in sequence. Use the field handles to arrange the order.
    Note: If you have multiple video widgets on one app page, only one video will play at a time.
  7. Select Loop Playlist to make the videos continuously repeat in order.
  8. In the Player Modes section, configure the following settings:
    OptionDescription
    Default Video Mode Choose between Fullscreen or Windowed playback.
    Note: The Fullscreen option does not play in preview mode, and windowed videos do not have full functionality. Results are best viewed when published on a mobile device.
    Autoplay Select Autoplay to play the video automatically when the widget's page loads.
    Show Controls Select Show Controls to make video controls (for example, play, pause, fast-forward, and fullscreen) available to the user during playback.
    Note: This option does not affect Vimeo videos.
    Landscape Select Landscape to force playback in landscape mode regardless of the device's orientation. This option is only available under the Fullscreen Default Video Mode.
    Lock Size Select Lock Size to force a specified aspect ratio:
    • 16:9
    • 4:3
    • 12:9
    This option is only available under the Windowed Default Video Mode.
  9. Optional: Add a visibility rule to the widget.
    Use visibility rules to control when a widget is visible to the app user. For example, you can create a condition that a widget should only appear after the app user fills in a field or submits a form.
    1. Select Visibility Rule to open the Set Visibility Rule dialog box.
    2. Select whether the visibility rule requires meeting all or any conditions.
    3. Select an app field or variable and an operator from the Field list. Enter the value required for the widget to be visible.
    4. Select Add Condition to add another condition.
    5. Select Save.
  10. Move to the Format tab to customize the widget's appearance.
  11. Select Save in the SOTI Snap banner to apply your changes.
    Save app button

Results

Tip: Click Preview to see how the widget appears in your app. Note the preview limitations mentioned above.