debugMode

Debug mode is a special rendering mode used for UI/UX debugging. Some of material components have touch areas larger than the actual components. It means that a user can tap outside a view and still trigger an action. Using debug mode you can preview all touch and draw areas in the editor. Red rectangles show hit areas, green rectanges - draw areas. Debug mode is also useful for SVG views debugging. SVG views appear empty, because SVG rendering is not supported in the editor.

To enable the debug mode, add the following line to your theme:

<item name="carbon_debugMode">true</item>

Then go to the editor and pick that theme to be used by the editor. You can create two themes, with and without the debug info, so you can switch between them.

<style name="AppTheme" parent="carbon_Theme.Light">
    <!-- Customize your theme here. -->
</style>

<style name="AppTheme.Debug">
    <item name="carbon_debugMode">true</item>
</style>