Overview

Content Craft Pro is an advanced all-in-one content editor widget designed for Mendix applications. It combines rich text editing, media handling, drawing tools, and file management capabilities into a single professional component.

The widget allows users to create and manage formatted content with support for:

• Rich text editing

• Bold, Italic and Underline formatting

• Bullet and numbered lists

• Text alignment controls

• Image upload from file manager

• Drawing and sketch support

• Content saving functionality

• Media management integration

• Professional editor interface

• React Client compatibility

Content Craft Pro is suitable for applications such as digital reports, task management systems, documentation portals, project tracking solutions, educational platforms, inspection forms, note systems, and enterprise content management applications.

This component provides a modern editing experience while maintaining easy integration inside Mendix projects.

Documentation

Typical usage scenario

Content Craft Pro is designed for applications that require rich text editing, drawing support, image handling, and content storage in Mendix applications.

Users can:

• Enter formatted text content

• Add remarks, notes, descriptions, and reports

• Draw sketches, annotations, signatures, and visual comments

• Upload one or multiple images

• Save text and image content together

During save operation, uploaded or drawn images are converted into Base64 format and returned as a JSON array.

Example:

[

{

"name":"image1.png",

"base64":"data:image/png;base64,..."

}

]

Users can use Import Mapping to parse the JSON response and create objects automatically.

Typical use cases:

• Digital Report Systems

• Task Allocation Applications

• Inspection Reports

• Quality Management Systems

• Employee Remarks

• Site Visit Notes

• Educational Annotation Tools

• Document Management

• Maintenance Reports

• Drawing Based Feedback Systems

The generated Base64 images can later be displayed using Base64 Image Viewer widgets or converted into Mendix image objects.

Features and limitations

Features:

•  Rich Text Editing
•  Bold / Italic / Underline formatting
•  Bullet and Numbered Lists
•  Text Alignment Support
•  Drawing Canvas
•  Sketch and Remark Support
•  Single Image Upload
•  Multiple Image Upload
•  Save Text + Media Together
•  Base64 Image Conversion
•  JSON Array Output
•  Import Mapping Compatibility
•  React Client Support
•  Mendix Integration Ready
•  Image Reconstruction Support

Output Example:

[

{

"name":"sample.png",

"base64":"data:image/png;base64,..."

}

]

Limitations:

• Images are stored as Base64 strings which may increase JSON size for large images.

• Very large image uploads may impact performance.

• Image optimization or compression is not included.

• Generated image objects must be created using Import Mapping and microflow logic.

• Image viewer configuration is required separately for display.

Dependencies

Optional dependencies:

• Import Mapping module for JSON parsing

• Base64 Image Viewer widget (for image preview)

• Image entity extending System.Image

• Microflow logic for object creation

• JSON Structure definition

Recommended setup:

Widget → JSON Output → Import Mapping → Loop → Create Image Object → Display Using Viewer

Installation

1. Download and import Content Craft Pro widget.

2. Add the widget into the required page.

3. Create an entity to store:

• Text Content

• Base64 JSON

• Image Name

• Optional metadata

4. Create an entity extending System.Image.

5. Add Save microflow.

6. Capture JSON output from widget.

7. Create Import Mapping for JSON array.

8. Parse Base64 values.

9. Loop through imported records.

10. Create image objects.

11. Store image data.

12. Display images using Base64 Image Viewer if required.

Configuration

Step 1:

Place Content Craft Pro widget on page.

Step 2:

Bind widget to Mendix object.

Step 3:

Configure attributes:

• TextContent

• Base64

• ImageName

• JsonAttribute

Step 4:

Configure Save button action.

Step 5:

Create JSON Structure:

Root

└ JsonObject

└ Base64 (String)

Step 6:

Create Import Mapping.

Step 7:

Parse widget JSON response.

Step 8:

Iterate imported list.

Step 9:

Convert Base64 into image objects.

Step 10:

Display generated images.

Known bugs

Current known limitations:

• Large Base64 image payloads may increase response size.

• Multiple high resolution images may affect performance.

• Browser memory usage depends on image count.

• Very large drawings may increase JSON length.

No critical functional issues identified in current version.

Frequently Asked Questions

Q: Can users enter formatted text?

A: Yes. Rich text editing is supported.

Q: Can users draw inside the widget?

A: Yes. Drawing and sketch support is available.

Q: Does the widget support image upload?

A: Yes. Single and multiple image uploads are supported.

Q: How are images returned?

A: Images are returned as Base64 JSON array.

Q: Can JSON be imported into Mendix?

A: Yes. Import Mapping can parse the output.

Q: Can Base64 images be converted into System.Image?

A: Yes. Use loop logic and image creation microflows.

Q: Can images be previewed?

A: Yes. Base64 Image Viewer can display them.

Q: Is React Client supported?

A: Yes.

Q: Can this widget be used in digital report systems?

A: Yes. It is suitable for reports, remarks, annotations, inspections, and documentation applications.