跳到主要内容

eui.Group

包    eui

类    public class Group

继承    eui.Group → egret.DisplayObjectContainer → egret.DisplayObject → egret.EventDispatcher → egret.HashObject

子类    eui.DataGroup,eui.UILayer,eui.ViewStack

Group 是自动布局的容器基类。如果包含的子项内容太大需要滚动显示，可以在在 Group 外部包裹一层 Scroller 组件(将 Group 实例赋值给 Scroller 组件的 viewport 属性)。Scroller 会为 Group 添加滚动的触摸操作功能，并显示垂直或水平的滚动条。

公共属性​

属性
bottom : any
距父级容器底部距离
contentHeight : number
视域的内容的高度
contentWidth : number
视域的内容的宽度
currentState : string
组件的当前视图状态
elementsContent : egret.DisplayObject[]
此属性通常在 EXML 的解析器中调用，便于快速添加多个子项
explicitHeight : number
外部显式指定的高度
explicitWidth : number
外部显式指定的宽度
hasState : (stateName:string)=>boolean
horizontalCenter : any
在父级容器中距水平中心位置的距离
includeInLayout : boolean
指定此组件是否包含在父容器的布局中
layout : eui.LayoutBase
此容器的布局对象
left : any
距父级容器离左边距离
maxHeight : number
组件的最大高度,同时影响测量和自动布局的尺寸
maxWidth : number
组件的最大高度
minHeight : number
组件的最小高度,此属性设置为大于maxHeight的值时无效
minWidth : number
组件的最小宽度,此属性设置为大于maxWidth的值时无效
numElements : number
布局元素子项的数量
percentHeight : number
相对父级容器高度的百分比
percentWidth : number
相对父级容器宽度的百分比
right : any
距父级容器右边距离
scrollEnabled : boolean
是否启用容器滚动
scrollH : number
可视区域水平方向起始点
scrollV : number
可视区域竖直方向起始点
states : eui.State[]
为此组件定义的视图状态
top : any
距父级容器顶部距离
touchThrough : boolean
触摸组件的背景透明区域是否可以穿透
verticalCenter : any
在父级容器中距竖直中心位置的距离

公共方法​

方法
Group()
构造函数
getElementAt(index:number):egret.DisplayObject
获取一个布局元素子项
getLayoutBounds(bounds:egret.Rectangle):void
组件的布局尺寸,常用于父级的updateDisplayList()方法中
getPreferredBounds(bounds:egret.Rectangle):void
获取组件的首选尺寸,常用于父级的measure()方法中
getVirtualElementAt(index:number):egret.DisplayObject
invalidateDisplayList():void
标记需要验证显示列表，以便在稍后屏幕更新期间调用该组件的 updateDisplayList() 方法
invalidateProperties():void
标记提交过需要延迟应用的属性，以便在稍后屏幕更新期间调用该组件的 commitProperties() 方法
invalidateSize():void
标记提交过需要验证组件尺寸，以便在稍后屏幕更新期间调用该组件的 measure() 方法
invalidateState():void
标记组件当前的视图状态失效，调用此方法后，子类应该覆盖 getCurrentState() 方法来返回当前的视图状态名称
setContentSize(width:number,height:number):void
设置 contentWidth 和 contentHeight 属性
setLayoutBoundsPosition(x:number,y:number):void
设置元素在屏幕上进行绘制时所用的布局坐标
setLayoutBoundsSize(layoutWidth:number,layoutHeight:number):void
设置元素的布局大小
setMeasuredSize(width:number,height:number):void
设置测量结果
setVirtualElementIndicesInView(startIndex:number,endIndex:number):void
在支持虚拟布局的容器中，设置容器内可见的子元素索引范围
validateDisplayList():void
验证子项的位置和大小，并绘制其他可视内容
validateNow():void
验证并更新此对象的属性和布局，如果需要的话重绘对象
validateProperties():void
由布局逻辑用于通过调用 commitProperties() 方法来验证组件的属性
validateSize(recursive:boolean):void
验证组件的尺寸

事件​

Events
egret.Event.RESIZE
当UI组件的尺寸发生改变时调度
eui.UIEvent.MOVE
当UI组件在父级容器中的位置发生改变时调度
eui.UIEvent.CREATION_COMPLETE
当UI组件第一次被添加到舞台并完成初始化后调度
egret.Event.ADDED
将显示对象添加到显示列表中时调度。
egret.Event.ADDED_TO_STAGE
在将显示对象直接添加到舞台显示列表或将包含显示对象的子树添加至舞台显示列表中时调度。
egret.Event.REMOVED
将要从显示列表中删除显示对象时调度。
egret.Event.REMOVED_FROM_STAGE
在从显示列表中直接删除显示对象或删除包含显示对象的子树时调度。
egret.Event.ENTER_FRAME
[广播事件] 播放头进入新帧时调度。
egret.Event.RENDER
[广播事件] 将要更新和呈现显示列表时调度。
egret.TouchEvent.TOUCH_MOVE
当用户触碰设备时进行调度，而且会连续调度，直到接触点被删除。
egret.TouchEvent.TOUCH_BEGIN
当用户第一次触摸启用触摸的设备时（例如，用手指触摸手机屏幕）调度。
egret.TouchEvent.TOUCH_END
当用户移除与启用触摸的设备的接触时（例如，将手指从屏幕上抬起）调度。
egret.TouchEvent.TOUCH_TAP
当用户在启用触摸设备上的已启动接触的同一 DisplayObject 实例上抬起接触点时（例如，手机点击屏幕后抬起）调度。
egret.TouchEvent.TOUCH_RELEASE_OUTSIDE
当用户在启用触摸设备上的已启动接触的不同 DisplayObject 实例上抬起接触点时（例如，按住屏幕上的某个对象,然后从它上面挪开后再松开手指）调度。

属性详细信息​

bottom​

bottom : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

距父级容器底部距离。

contentHeight​

contentHeight : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

视域的内容的高度。如果 scrollEnabled 为 true，则视域的 contentHeight 为垂直滚动定义限制，且视域的实际高度定义可见的内容量。要在内容中垂直滚动，请在 0 和 contentHeight - height之间更改 scrollV。

contentWidth​

contentWidth : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

视域的内容的宽度。如果 scrollEnabled 为 true， 则视域的 contentWidth 为水平滚动定义限制，且视域的实际宽度定义可见的内容量。要在内容中水平滚动， 请在 0 和 contentWidth - width 之间更改 scrollH 。

currentState​

currentState : string

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

组件的当前视图状态。显式设置此属性，将采用显式设置的值去更新皮肤状态，而忽略组件内部 getCurrentState() 方法返回的值。将其设置为 "" 或 null 可将取消组件外部显式设置的视图状态名称，从而采用内部 getCurrentState() 方法返回的状态。

elementsContent​

elementsContent : egret.DisplayObject[]

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

此属性通常在 EXML 的解析器中调用，便于快速添加多个子项。

explicitHeight​

explicitHeight : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

外部显式指定的高度。

explicitWidth​

explicitWidth : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

外部显式指定的宽度。

hasState​

hasState : (stateName:string)=>boolean

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

horizontalCenter​

horizontalCenter : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

在父级容器中距水平中心位置的距离。

includeInLayout​

includeInLayout : boolean = true

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

指定此组件是否包含在父容器的布局中。若为false，则父级容器在测量和布局阶段都忽略此组件。注意，visible属性与此属性不同，设置visible为false，父级容器仍会对其布局。

layout​

layout : eui.LayoutBase

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

此容器的布局对象。s@default eui.BasicLayout

left​

left : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

距父级容器离左边距离。

maxHeight​

maxHeight : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

组件的最大高度,同时影响测量和自动布局的尺寸。

maxWidth​

maxWidth : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

组件的最大高度。同时影响测量和自动布局的尺寸。

minHeight​

minHeight : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

组件的最小高度,此属性设置为大于maxHeight的值时无效。同时影响测量和自动布局的尺寸。

minWidth​

minWidth : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

组件的最小宽度,此属性设置为大于maxWidth的值时无效。同时影响测量和自动布局的尺寸。

numElements​

numElements : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

布局元素子项的数量。

percentHeight​

percentHeight : number = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

相对父级容器高度的百分比。

percentWidth​

percentWidth : number = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

相对父级容器宽度的百分比。

right : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

距父级容器右边距离。

scrollEnabled​

scrollEnabled : boolean = false

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

是否启用容器滚动。如果为 true，则将子项剪切到视区的边界，配合设置scrollH和scrollV属性将能滚动视区。如果为 false，则容器子代会从容器边界扩展过去，而设置scrollH和scrollV也无效。默认false。

scrollH​

scrollH : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

可视区域水平方向起始点。

scrollV​

scrollV : number

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

可视区域竖直方向起始点。

states​

states : eui.State[]

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

为此组件定义的视图状态。

top​

top : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

距父级容器顶部距离。

touchThrough​

touchThrough : boolean

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

触摸组件的背景透明区域是否可以穿透。设置为true表示可以穿透，反之透明区域也会响应触摸事件。默认 false。

verticalCenter​

verticalCenter : any = NaN

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

在父级容器中距竖直中心位置的距离。

方法详细信息​

Group()​

public Group()

构造函数。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

getElementAt()​

public getElementAt(index:number):egret.DisplayObject

获取一个布局元素子项。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数

getLayoutBounds()​

public getLayoutBounds(bounds:egret.Rectangle):void

组件的布局尺寸,常用于父级的updateDisplayList()方法中。按照：布局尺寸>外部显式设置尺寸>测量尺寸 的优先级顺序返回尺寸。注意此方法返回值已经包含scale和rotation。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数

getPreferredBounds()​

public getPreferredBounds(bounds:egret.Rectangle):void

获取组件的首选尺寸,常用于父级的measure()方法中。按照：外部显式设置尺寸>测量尺寸 的优先级顺序返回尺寸。注意此方法返回值已经包含scale和rotation。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数

getVirtualElementAt()​

public getVirtualElementAt(index:number):egret.DisplayObject

  • 支持版本:all
  • 运行平台:Web,Native
  • 参数

invalidateDisplayList()​

public invalidateDisplayList():void

标记需要验证显示列表，以便在稍后屏幕更新期间调用该组件的 updateDisplayList() 方法。Invalidation 是一个很有用的机制，可将组件更改延迟到稍后屏幕更新时进行处理，从而消除了重复的工作。例如，要更改宽度和高度，如果在更改宽度后立即更新组件，然后在设置新高度后再次更新组件，就有些浪费。更改两个属性后再使用新的大小一次性呈示组件，效率会更高。很少调用 Invalidation 方法。通常，在组件上设置属性会自动调用合适的 invalidation 方法。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

invalidateProperties()​

public invalidateProperties():void

标记提交过需要延迟应用的属性，以便在稍后屏幕更新期间调用该组件的 commitProperties() 方法。这是一个很有用的机制，可将组件更改延迟到稍后屏幕更新时进行处理，从而消除了重复的工作。例如，要更改文本颜色和大小，如果在更改颜色后立即进行更新，然后在设置大小后再更新大小，就有些浪费。同时更改两个属性后再使用新的大小和颜色一次性呈示文本，效率会更高。很少调用 Invalidation 方法。通常，在组件上设置属性会自动调用合适的 invalidation 方法。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

invalidateSize()​

public invalidateSize():void

标记提交过需要验证组件尺寸，以便在稍后屏幕更新期间调用该组件的 measure() 方法。Invalidation 是一个很有用的机制，可将组件更改延迟到稍后屏幕更新时进行处理，从而消除了重复的工作。例如，要更改文本和字体大小，如果在更改文本后立即进行更新，然后在设置大小后再更新大小，就有些浪费。更改两个属性后再使用新的大小一次性呈示文本，效率会更高。很少调用 Invalidation 方法。通常，在组件上设置属性会自动调用合适的 invalidation 方法。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

invalidateState()​

public invalidateState():void

标记组件当前的视图状态失效，调用此方法后，子类应该覆盖 getCurrentState() 方法来返回当前的视图状态名称。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

setContentSize()​

public setContentSize(width:number,height:number):void

设置 contentWidth 和 contentHeight 属性。此方法由布局来调用，开发者应该在布局类的 updateDisplayList() 方法中对其进行调用。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数
    • width:number - contentWidth 的新值。
    • height:number - contentHeight 的新值。

setLayoutBoundsPosition()​

public setLayoutBoundsPosition(x:number,y:number):void

设置元素在屏幕上进行绘制时所用的布局坐标。请注意，调用 setLayoutBoundSize() 方法会影响布局位置，因此请在调用 setLayoutBoundSize()之后再调用 setLayoutBoundPosition()。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数
    • x:number - 边框左上角的 X 坐标。
    • y:number - 边框左上角的 Y 坐标。

setLayoutBoundsSize()​

public setLayoutBoundsSize(layoutWidth:number,layoutHeight:number):void

设置元素的布局大小。这是元素在屏幕上进行绘制时所用的大小。如果 width 和/或 height 参数尚未指定 (NaN))，则 EUI 会将该元素的布局大小设置为首选宽度和/或首选高度。请注意，调用 setLayoutBoundSize() 方法会影响布局位置，因此请在调用 setLayoutBoundSize()之后再调用 setLayoutBoundPosition()。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数
    • layoutWidth:number - 元素的布局宽度。
    • layoutHeight:number - 元素的布局高度。

setMeasuredSize()​

public setMeasuredSize(width:number,height:number):void

设置测量结果。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数

setVirtualElementIndicesInView()​

public setVirtualElementIndicesInView(startIndex:number,endIndex:number):void

在支持虚拟布局的容器中，设置容器内可见的子元素索引范围。此方法在不支持虚拟布局的容器中无效。通常在即将重新布局子项之前会被调用一次，容器覆盖此方法提前释放已经不可见的子元素。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数
    • startIndex:number - 可视元素起始索引（包括）
    • endIndex:number - 可视元素结束索引（包括）

validateDisplayList()​

public validateDisplayList():void

验证子项的位置和大小，并绘制其他可视内容。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

validateNow()​

public validateNow():void

验证并更新此对象的属性和布局，如果需要的话重绘对象。通常只有当脚本执行完毕后，才会处理要求进行大量计算的处理属性。例如，对 width 属性的设置可能会延迟，因为此设置需要重新计算这些对象的子项或父项的宽度。如果脚本多次设置了 width 属性，则延迟处理可防止进行多次处理。此方法允许您手动覆盖此行为。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

validateProperties()​

public validateProperties():void

由布局逻辑用于通过调用 commitProperties() 方法来验证组件的属性。通常，子类应覆盖 commitProperties() 方法，而不是覆盖此方法。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native

validateSize()​

public validateSize(recursive:boolean):void

验证组件的尺寸。

  • 支持版本:eui 1.0
  • 运行平台:Web,Native
  • 参数
    • recursive:boolean - 如果为 true，则调用对象子项的此方法。

示例​

**

* 下面的例子显示了一个 Group 的常规用法。

*/

class  GroupExample  extends  egret.Sprite  {

public  constructor()  {

super();

var exml =

`<e:Group xmlns:e="http:/ns.egret.com/eui">

<e:layout>

<e:HorizontalLayout gap="20"/>

</e:layout>

<e:Group>

<e:layout>

<e:VerticalLayout gap="20"/>

</e:layout>

<e:Label text="BeiJIng" textColor="0xFFFFFF"/>

<e:Label text="sunny" textColor="0xFFFFCC"/>

<e:Image source="resource/sunny.png"/>

</e:Group>

<e:Group>

<e:layout>

<e:VerticalLayout gap="20"/>

</e:layout>

<e:Label text="ShangHai" textColor="0xFFFFFF"/>

<e:Label text="cloudy" textColor="0xFFFFCC"/>

<e:Image source="resource/cloudy.png"/>

</e:Group>

</e:Group>`;

var clazz =  EXML.parse(exml);

var group:eui.Group  =  new  clazz();

this.addChild(group);

}

}