布局组件
- 如何弄一个父节点 适应子节点高度的结构出来
首先我们要了解一个东西 layout property
image.png
这再inspector 视图里面可以看到
其中的一些属性等是当前transform的属性
Preferred width 表示更倾向(更优先的意思) 于这个宽高。在有宽高限制组件(例如contentsizefillter)时,会将当前组件的宽高设置成 这个倾向的宽高。
而这些Preferred width 又时怎么计算出来的呢?
看ugui 源码可以找到答案(https://bitbucket.org/Unity-Technologies/ui)
LayoutPropertiesPreview.cs是这个面板的展示代码
public override void OnPreviewGUI(Rect r, GUIStyle background)
{
if (Event.current.type != EventType.Repaint)
return;
if (m_Styles == null)
m_Styles = new Styles();
GameObject go = target as GameObject;
RectTransform rect = go.transform as RectTransform;
if (rect == null)
return;
// Apply padding
RectOffset previewPadding = new RectOffset(-5, -5, -5, -5);
r = previewPadding.Add(r);
// Prepare rects for columns
r.height = EditorGUIUtility.singleLineHeight;
Rect labelRect = r;
Rect valueRect = r;
Rect sourceRect = r;
labelRect.width = kLabelWidth;
valueRect.xMin += kLabelWidth;
valueRect.width = kValueWidth;
sourceRect.xMin += kLabelWidth + kValueWidth;
// Headers
GUI.Label(labelRect, "Property", m_Styles.headerStyle);
GUI.Label(valueRect, "Value", m_Styles.headerStyle);
GUI.Label(sourceRect, "Source", m_Styles.headerStyle);
labelRect.y += EditorGUIUtility.singleLineHeight + EditorGUIUtility.standardVerticalSpacing;
valueRect.y += EditorGUIUtility.singleLineHeight + EditorGUIUtility.standardVerticalSpacing;
sourceRect.y += EditorGUIUtility.singleLineHeight + EditorGUIUtility.standardVerticalSpacing;
// Prepare reusable variable for out argument
ILayoutElement source = null;
// Show properties
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Min Width", LayoutUtility.GetLayoutProperty(rect, e => e.minWidth, 0, out source).ToString(), source);
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Min Height", LayoutUtility.GetLayoutProperty(rect, e => e.minHeight, 0, out source).ToString(), source);
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Preferred Width", LayoutUtility.GetLayoutProperty(rect, e => e.preferredWidth, 0, out source).ToString(), source);
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Preferred Height", LayoutUtility.GetLayoutProperty(rect, e => e.preferredHeight, 0, out source).ToString(), source);
float flexible = 0;
flexible = LayoutUtility.GetLayoutProperty(rect, e => e.flexibleWidth, 0, out source);
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Flexible Width", flexible > 0 ? ("enabled (" + flexible.ToString() + ")") : "disabled", source);
flexible = LayoutUtility.GetLayoutProperty(rect, e => e.flexibleHeight, 0, out source);
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Flexible Height", flexible > 0 ? ("enabled (" + flexible.ToString() + ")") : "disabled", source);
if (!rect.GetComponent<LayoutElement>())
{
Rect noteRect = new Rect(labelRect.x, labelRect.y + 10, r.width, EditorGUIUtility.singleLineHeight);
GUI.Label(noteRect, "Add a LayoutElement to override values.", m_Styles.labelStyle);
}
}
其中有一句
ShowProp(ref labelRect, ref valueRect, ref sourceRect, "Preferred Width", LayoutUtility.GetLayoutProperty(rect, e => e.preferredWidth, 0, out source).ToString(), source);
就是设置"Preferred Width" 的值的,
然后看下 LayoutUtility.GetLayoutProperty是怎么取值的
public static float GetLayoutProperty(RectTransform rect, System.Func<ILayoutElement, float> property, float defaultValue, out ILayoutElement source)
{
source = null;
if (rect == null)
return 0;
float min = defaultValue;
int maxPriority = System.Int32.MinValue;
var components = ListPool<Component>.Get();
rect.GetComponents(typeof(ILayoutElement), components);
for (int i = 0; i < components.Count; i++)
{
var layoutComp = components[i] as ILayoutElement;
if (layoutComp is Behaviour && !((Behaviour)layoutComp).isActiveAndEnabled)
continue;
int priority = layoutComp.layoutPriority;
// If this layout components has lower priority than a previously used, ignore it.
if (priority < maxPriority)
continue;
float prop = property(layoutComp);
// If this layout property is set to a negative value, it means it should be ignored.
if (prop < 0)
continue;
// If this layout component has higher priority than all previous ones,
// overwrite with this one's value.
if (priority > maxPriority)
{
min = prop;
maxPriority = priority;
source = layoutComp;
}
// If the layout component has the same priority as a previously used,
// use the largest of the values with the same priority.
else if (prop > min)
{
min = prop;
source = layoutComp;
}
}
ListPool<Component>.Release(components);
return min;
}
可以看到 是查找当前recttransform 的所有layout组件,然后根据一个优先级,优先级大的取值,如果一样大,看传入的方法
这里有可能不明白=> 表示什么意思
https://zhidao.baidu.com/question/283430770.html
其实就是匿名委托作为参数传递了= =(c#3.0特性)
然后还是不明白 e=>e.xxxx是什么意思
还有System.Func<ILayoutElement, float> 又是什么
其实就是传入一个参数,Tresult未结果的类型
所以总结来说
LayoutUtility.GetLayoutProperty(rect, e => e.minWidth, 0, out source)
就是传入了e作为参数,然后返回的结果是e的minWidth
太绕了。
所以取值的顺序可以看里面的说明了
// If this layout components has lower priority than a previously used, ignore it.
// If this layout property is set to a negative value, it means it should be ignored.
// If this layout component has higher priority than all previous ones,
// overwrite with this one's value.
// If the layout component has the same priority as a previously used,
// use the largest of the values with the same priority.
先取大优先级的,然后忽略掉要求的属性未负的,最后相同优先级的取属性最大的
所以我们可以看这个结构
image.png
minwidth 为什么是取自verticallayout,而preferredwidth取自image ? 是不是很奇怪?
image 和verticallayout 的优先级都是0的。
按道理 image 的minwidth 应该是396啊,因为不能变小了吧。 但是看
image代码发现
public virtual float minWidth { get { return 0; } }
他的minwidth 设置成了0了,所以肯定layoutgoup 那里的minwidth 要大,所以选了layoutgroup的。
而preferredwidth 就正常了,选最大的哪个。