UGTK / Toolkit / Ui Module / Responsive Layout System Completed

Responsive Rect

Summary

Mn_ResponsiveRect makes a child element automatically adapt whenever its RectTransform changes size — no LayoutGroup required. It applies percentage-based horizontal/vertical padding to the content and can auto-scale TMP text sizes to the current height. Works in editor and at runtime.

Content

Modules Dependencies
Setup
How To Use
Testing Scene
Known limitation: text scaling is inert
Technical Info

Modules Dependencies

This module has no hard UGTK dependencies. Text auto-scaling (TMP_Text) is compiled only when the TMP_PRESENT define is set (TextMesh Pro present).

Setup

No prefab and no scene ship with this module, so there is nothing to record: add Mn_ResponsiveRect to a UI object and it configures itself on Reset.

How To Use

Add Mn_ResponsiveRect to a UI object. On Reset it auto-assigns root to its own RectTransform and content to the first child; you can override both in the inspector.
Set horizontalPaddingPercent and verticalPaddingPercent (0–0.5); the content is anchored to stretch and inset by those percentages of the root size.
Enable autoScaleText to drive child TMP fonts: fontSize = clamp(height * fontSizeFactor, minFontSize, maxFontSize) (auto-sizing is disabled on those texts).
It reacts automatically via OnRectTransformDimensionsChange, OnEnable and (in editor) OnValidate; nothing needs to be called manually.

Good to know:

It is an alternative to a LayoutGroup, not a companion. It writes the content's anchors and offsets directly: put a LayoutGroup on the same object and the two fight every frame.
Padding is a percentage of the root, capped at 0.5 per side — at 0.5 the content collapses to nothing.
Auto-scaling text turns TMP auto-size OFF on the children it drives and writes fontSize itself. If a label must keep its own auto-size, keep it out of this hierarchy.
[ExecuteAlways]: it reflows in the editor too, so what you see while designing is what you get — but it also means it will rewrite values you tweak by hand on the content.

Testing Scene

Open Debug/ResponsiveScene.unity. A dark Root panel fills most of the canvas and carries Mn_ResponsiveRect; an orange Content panel sits inside it. The padding between the two is the component's whole output, so the orange rectangle is the readout.

What to do, in order:

Select Root and read Editor Test Tools → Root: the size the padding is derived from.
Drag Horizontal Padding Percent and Vertical Padding Percent. The orange panel follows at once, with the editor stopped.
Switch the Game view resolution from Full HD to a portrait one. The padding follows the new shape, because it is a percentage and not a number of pixels.
Switch back, and press ApplyNow(). It recomputes even though nothing has changed size.
Set both percentages to 0.5. The content collapses to nothing, which is the configured answer and not a bug.

Step 2 is the one that used to fail. Apply keeps a cache of the last root size so that the several OnRectTransformDimensionsChange calls of one layout pass do not each redo the work - and that cache also swallowed every recompute the user asked for. Dragging the sliders did nothing, and neither did the inspector button, which is exactly the case it exists for. Both force the recompute now.

The forced recompute is also deferred by one editor frame. Unity refuses to let a component move another RectTransform from inside OnValidate and says so with a SendMessage cannot be called during ... OnValidate error, so the work is scheduled for immediately after instead.

Known limitation: text scaling is inert

Auto Scale Text is checked by default and currently does nothing. The whole body of ApplyTextScaling sits inside #if TMP_PRESENT, and TMP_PRESENT is defined nowhere in this package - not in this assembly definition, not in the project settings. So the method compiles to an empty body in every build that has ever been made, and the three settings that drive it (minFontSize, maxFontSize, fontSizeFactor) are compiled out of the inspector entirely.

Turning it on is a versionDefines entry plus a TextMeshPro reference on UGTK.UIModule.Responsive.asmdef, which today references nothing at all. It is left off on purpose, because switching it on is not a neutral repair:

autoScaleText defaults to true, so every existing Mn_ResponsiveRect would immediately start overriding the font size of every TMP_Text beneath it;
it also sets enableAutoSizing = false on each of them, discarding any auto-sizing already configured;
and it adds three serialised fields to a component that is already deployed in projects.

In other words the switch changes how existing UI looks. Flip it deliberately, on a project you can look at, rather than as part of an upgrade.

Technical Info

Mn_ResponsiveRect: [ExecuteAlways] MonoBehaviour that, on any size change, applies relative padding to the content RectTransform and optionally rescales child TMP text to fit the current height.