Camera Widget

Category: Widgets
Subcategory: Images


Use the native camera without the use of Phonegap


Demo url


This camera widget makes use of HTML5 "getUserMedia". This widget doesn't need phonegap to run.

Typical usage scenario

You can use this widget to take pictures with your iphone camera, android device camera or laptop webcam.

Features and limitations

Features: Take pictures with your device camera and save them as a FileDocument in your Mendix database.

Limitations: This code doesn't work on older iphones and possibly android devices too.

Tested On: The code was tested on Windows 10 (FF and Chrome), on a Samsung S7 and iPhone 6. Please contact me if you find any devices that don't work correctly.


  • Mendix 7.19.0
  • CommunityCommons.Base64DecodeToFile if you want to convert the image to a FileDocument in the return microflow.

Getting started

  1. Create an entity with an unlimited length String variable called "Base64Image". (Or add "Base64Image" to an existing entity.
  2. Have a relation with a (generalization of) "System.Image" entity
  3. Place the widget in an Edit page of the chosen entity.
  4. Add a microflow to the widget by double clicking it.
  5. Make sure that the Parameter of the microflow is the same type as your enitity.
  6. Use the "CommunityCommons.Base64DecodeToFile" to convert your "Base64Image" String to your generalization of "System.Image".

Domain Model

Domain model example


Microflow example


Version: 1.0.1
Framework Version: 7.19.0
Release Notes: Rear/Front camera parameter added by Eric Pendergrass. Defaults to Rear camera.
Version: 1.0.0
Framework Version: 7.19.0
Release Notes: Styling on the buttons. + disabling camera button when it's running.