How to Resize Parent to Text Content
Background
To adjust the size of an object based on the size of a child object is a common scenario when building UIs.
This tutorial explains how to adjust an input field so that its height expands based on the input.
There are other scenarios as well (like a button where the width expands based on the displayed text). Those other scenarios work pretty similar.
Preparation
In this example we have an Input Field and a Text inside which can be changed by the user.
Please note that the Input Field can be a Better Input Field, a Better TextMesh Pro Input Field or a non-better-pendant. Make sure the Line Type is set to a Multi Line type.
The Text also can be a Better Text, a Better TextMesh Pro UGUI component or a non-better-pendant.
Make sure that the Input Field doesn't resize (no "Best Fit" or "Auto Size" -- if it is a better version: Set the Fitting mode to "Sizer Only").
Make it work
- Add a Better Content Size Fitter to the game object with the Input Field.
- Set the Source object of the Better Content Size Fitter to the Game Object containing the Text lower in the hierarchy.
- Set Vertical Fit to Preferred Size.
- Select the Game object containing the Text and add a Size Change Tracker component to it.
- Add the Input Field object to the Affected Objects list.
You probably also want to set the Min Size and add Padding to the Better Content Size Fitter at the input field.