入门SkinUI（10）：布局（2）：弹性布局

弹性布局CFlexLayout，继承于CLayout，支持CLayout的所有属性和方法。

弹性布局称为 Flex 容器，简称"容器"。容器默认存在两根轴：水平的主轴和垂直的交叉轴。它的的所有子元素称为 Flex 项目（flex item），简称"项目"。项目默认沿主轴排列。

容器相关的属性和方法

主轴的方向

• 通过XML属性控制如下：

Direction="Row"
Direction="RowReverse"
Direction="Column"
Direction="ColumnReverse"

• 通过C++程序代码调用方法控制如下：

virtual void SetDirection(Direction nDirection);

换行方式

• 通过XML属性控制如下：

Wrap="NoWrap"
Wrap="Wrap"
Wrap="WrapReverse"

• 通过C++程序代码调用方法控制如下：

virtual void SetWrap(Wrap nWrap);

主轴对齐方式

• 通过XML属性控制如下：

JustifyContent="Start"
JustifyContent="End"
JustifyContent="Center"
JustifyContent="Between"
JustifyContent="Around"

• 通过C++程序代码调用方法控制如下：

virtual void SetJustifyContent(FlexAlign nJustifyContent);

交叉轴对齐方式

• 通过XML属性控制如下：

AlignItems="Start"
AlignItems="End"
AlignItems="Center"
AlignItems="Between"
AlignItems="Around"

• 通过C++程序代码调用方法控制如下：

virtual void SetAlignItems(FlexAlign nAlignItems);

主轴线对齐方式

• 通过XML属性控制如下：

AlignContent="Start"
AlignContent="End"
AlignContent="Center"
AlignContent="Between"
AlignContent="Around"

• 通过C++程序代码调用方法控制如下：

virtual void SetAlignContent(FlexAlign nAlignContent);

项目相关的属性和方法

设置视图放大系数

• 通过XML属性控制如下：

Grow="10"

• 通过C++程序代码调用方法控制如下：

virtual void SetGrow(LONG nGrow);

设置视图缩小系数

• 通过XML属性控制如下：

Shrink="10"

• 通过C++程序代码调用方法控制如下：

virtual void SetShrink(LONG nShrink);

示例

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="WrapReverse">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="RowReverse" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="RowReverse" Wrap="Wrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="RowReverse" Wrap="WrapReverse">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="WrapReverse">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="ColumnReverse" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="ColumnReverse" Wrap="Wrap">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="ColumnReverse" Wrap="WrapReverse">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" JustifyContent="Start">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" JustifyContent="End">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" JustifyContent="Center">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" JustifyContent="Between">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" JustifyContent="Around">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" JustifyContent="Start">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" JustifyContent="End">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" JustifyContent="Center">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" JustifyContent="Between">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" JustifyContent="Around">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="160">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" AlignItems="Start">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="80" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="60" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="160">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" AlignItems="End">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="80" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="60" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="160">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap" AlignItems="Center">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="80" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="60" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" AlignItems="Start">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="160" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="120" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" AlignItems="End">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="160" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="120" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap" AlignItems="Center">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="160" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="120" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap" AlignContent="Start">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap" AlignContent="End">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap" AlignContent="Center">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap" AlignContent="Between">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="420">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="Wrap" AlignContent="Around">
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap" AlignContent="Start">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap" AlignContent="End">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap" AlignContent="Center">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap" AlignContent="Between">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="Wrap" AlignContent="Around">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='2' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='4' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='5' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='6' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='7' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8">
			<TextView Text='8' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='9' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap">
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT8" Grow="1">
			<TextView Text='我被自动放大了' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="200" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="140">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Row" Wrap="NoWrap">
		<RelativeLayout Width="280" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="280" Height="100" Background="ID_COLOR_DEFAULT8" Shrink="1">
			<TextView Text='我被自动缩小了' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="280" Height="100" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="60" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="60" Background="ID_COLOR_DEFAULT8" Grow="1">
			<TextView Text='我被自动放大了' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="60" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>

效果图

布局文件

<RelativeLayout Width="MatchParent" Height="340">
	<FlexLayout AlignParentLeft="20" AlignParentTop="20" AlignParentRight="20" AlignParentBottom="20" Background="ID_COLOR_DEFAULT1" Direction="Column" Wrap="NoWrap">
		<RelativeLayout Width="240" Height="120" Background="ID_COLOR_DEFAULT5">
			<TextView Text='1' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="120" Background="ID_COLOR_DEFAULT8" Shrink="1">
			<TextView Text='我被自动缩小了' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
		<RelativeLayout Width="240" Height="120" Background="ID_COLOR_DEFAULT5">
			<TextView Text='3' Width="MatchParent" Height="MatchParent" HorzAlign="Center" Font="ID_FONT_H4" Color="ID_COLOR_WHITE"/>
		</RelativeLayout>
	</FlexLayout>
</RelativeLayout>