Dynamic SVG icon

Content Type: Widget
Categories: User Interface,Mobile,Visualization

Overview

Display stunning SVG icons effortlessly in your Mendix Native apps!

Bring flexibility and dynamic visual appeal to your native mobile applications with this easy-to-use SVG Icon widget. Seamlessly integrated into Mendix Native, this widget enables developers to effortlessly display customizable SVG icons with dynamic styling, ensuring your app stays visually consistent and appealing.

Key Features:

  • Flexible Icon Integration: Upload and use your SVG icons.

  • Comprehensive Styling: Customize fill color, width, and height through Mendix's built-in styling system.

  • Accessibility Ready: Includes built-in support for accessibility features, making your apps inclusive by default.

Enhance your user experience with beautifully rendered, fully customizable SVG icons today!

 

Documentation

Typical Usage Scenario

This SVG Icon widget allows developers to easily integrate custom SVG icons into their Mendix Native mobile applications. It simplifies the process of uploading and displaying custom icons, enhancing visual appeal, consistency, and accessibility throughout the app.

Features and Limitations

The widget functions by directly manipulating the fill attribute on the root-level SVG element to control icon coloring.

Features:

  • Upload and easily integrate custom SVG icons

  • Customize icon appearance including fill color, width, and height

  • Built-in accessibility support, making icons screen-reader friendly

Limitations:

  • Only supports SVG icons (no PNG or JPG)

  • Mendix Native applications only (not suitable for web-based Mendix apps)

Dependencies

  • Mendix Native Mobile

  • React Native

Installation

  1. Download the widget package from the Mendix Marketplace.

  2. Import the widget into your Mendix application via Studio Pro.

  3. Drag the widget onto a Native page to begin usage.

Configuration

  • SVG Icon: Upload your SVG file to the Mendix application.

  • Fill Color: Specify the desired color for your SVG icon.

  • Width and Height: Adjust these parameters to achieve the desired icon size.

Known Bugs

No known bugs at this time.

Frequently Asked Questions

  • Can I use other image formats?No, currently only SVG formats are supported.

  • Does this widget support web applications?No, this widget is exclusively for Mendix Native mobile apps.

Releases

Version: 1.0.0
Framework Version: 10.18.0
Release Notes: Initial version