制作一个对话框,让框能随着文本的长度和高度变化。
模式一
一个随文本的实时输入而自动适应的对话框。
1.效果:
2.层级与组件:
frame就是个Image对话框图,锚点和Text一样,使用ContentSizeFitter组件使Text适应文字,当小于单行的最大长度时使用HorizontalFit,当大于单行最大长度则使用VerticalFit,然后在代码中让框的大小随Text的大小变化。
3.代码:
/// <summary>
/// 对话框
/// </summary>
[HideInInspector]
public Image boxFrame;
/// <summary>
/// 输入文本
/// </summary>
[HideInInspector]
public Text messageText;
private ContentSizeFitter sizeFitter;
/// <summary>
/// 框最小长度
/// </summary>
public int minFrameWidth = 100;
/// <summary>
/// 框最大长度
/// </summary>
public int maxFrameWidth = 1200;
/// <summary>
/// 框与文本的高度差
/// </summary>
private float offsetDistance;
// Use this for initialization
void Start () {
boxFrame = transform.Find("frame").GetComponent<Image>();
messageText = GetComponentInChildren<Text>();
sizeFitter = messageText.transform.GetComponent<ContentSizeFitter>();
offsetDistance = boxFrame.rectTransform.sizeDelta.y - messageText.rectTransform.sizeDelta.y;
}
void Update () {
AdjustDialogBoxSize();
}
private void AdjustDialogBoxSize()
{
//大于行的最大长度则换行
if(boxFrame.rectTransform.sizeDelta.x > maxFrameWidth)
{
if(sizeFitter.horizontalFit == ContentSizeFitter.FitMode.PreferredSize)
{
sizeFitter.horizontalFit = ContentSizeFitter.FitMode.Unconstrained;
sizeFitter.verticalFit = ContentSizeFitter.FitMode.PreferredSize;
}
}
else
{
if (sizeFitter.horizontalFit == ContentSizeFitter.FitMode.Unconstrained)
{
sizeFitter.horizontalFit = ContentSizeFitter.FitMode.PreferredSize;
sizeFitter.verticalFit = ContentSizeFitter.FitMode.Unconstrained;
}
}
boxFrame.rectTransform.sizeDelta = new Vector2(minFrameWidth + messageText.rectTransform.sizeDelta.x, messageText.rectTransform.sizeDelta.y + offsetDistance);
}
模式二
传入一段文字到对话框,然后根据文本一次性适配。
1.效果:
2.层级与组件
在frame的狂下有两个Text,一个做行的长度适配,一个做行数的高度适配,当长度小于行最大长度时,把VecticalText的Color设为透明隐藏,当大于行最大长度则换行,把Horizontal的字体颜色设置为透明隐藏。
3.代码:
/// <summary>
/// 对话框
/// </summary>
[HideInInspector]
public Image boxFrame;
public Text horizontalText;
public Text verticalText;
private ContentSizeFitter sizeFitter;
/// <summary>
/// 框最小长度
/// </summary>
public int minFrameWidth = 100;
/// <summary>
/// 框最大长度
/// </summary>
public int maxFrameWidth = 1200;
public Color textColor = new Color(1, 1, 1, 1);
public Color hideColor = new Color(1, 1, 1, 0);
/// <summary>
/// 框与文本的高度差
/// </summary>
private float offsetDistance;
// Use this for initialization
void Start () {
boxFrame = transform.Find("frame").GetComponent<Image>();
offsetDistance = boxFrame.rectTransform.sizeDelta.y - horizontalText.rectTransform.sizeDelta.y;
verticalText.color = hideColor;
horizontalText.color = textColor;
StartCoroutine(AdjustSize());
}
private void AdjustDialogBoxSize()
{
//换行
if(verticalText.rectTransform.sizeDelta.y > 85)
{
verticalText.color = textColor;
horizontalText.color = hideColor;
boxFrame.rectTransform.sizeDelta = new Vector2(minFrameWidth + verticalText.rectTransform.sizeDelta.x, verticalText.rectTransform.sizeDelta.y + offsetDistance);
}
else
{
boxFrame.rectTransform.sizeDelta = new Vector2(minFrameWidth + horizontalText.rectTransform.sizeDelta.x, horizontalText.rectTransform.sizeDelta.y + offsetDistance);
}
}
/// <summary>
/// 传入文本
/// </summary>
/// <param name="input"></param>
public void SendText(InputField input)
{
verticalText.text = horizontalText.text = input.text;
StartCoroutine(AdjustSize());
}
IEnumerator AdjustSize()
{
yield return new WaitForEndOfFrame();
AdjustDialogBoxSize();
}