BlackBerry10 Cascades之DockLayout

DockLayout，可以排列控件在不同的位置，例如上，下，左，右，居中等。

类继承关系：

C++代码实例：

01	Container* pContainer = new Container();

02	DockLayout *pDockLayout = new DockLayout();

03	pContainer->setLayout(pDockLayout);

04

05	DockLayoutProperties* pProperties = 0;

06

07	// Position button 1 horizontally centered and docked to the top

08	// of the container

09	Button* pButton1 = Button::create().text("Button1");

10	pProperties = DockLayoutProperties::create();

11	pProperties->setHorizontalAlignment(HorizontalAlignment::Center);

12	pProperties->setVerticalAlignment(VerticalAlignment::Top);

13	pButton1->setLayoutProperties(pProperties);

14

15	// Position buttons 2 vertically centered and docked to the

16	// right edge of the container

17	Button* pButton2 = Button::create().text("Button2");

18	pProperties = DockLayoutProperties::create();

19	pProperties->setHorizontalAlignment(HorizontalAlignment::Right);

20	pProperties->setVerticalAlignment(VerticalAlignment::Center);

21	pButton2->setLayoutProperties(pProperties);

22

23	pContainer->add( pButton1 );

24	pContainer->add( pButton2 );

实现效果：

QML代码实例：

01	import bb.cascades 1.0

02

03

Page {

04	content:Container {

05	id: containerID

06	layout: DockLayout {

07

08

}

09

Button {

10	text: "Button 01"

11	layoutProperties: DockLayoutProperties {

12	verticalAlignment: VerticalAlignment.Center

13	horizontalAlignment: HorizontalAlignment.Right

14

}

15

}

16

Button {

17	text: "Button 02"

18	layoutProperties: DockLayoutProperties {

19	verticalAlignment: VerticalAlignment.Center

20	horizontalAlignment: HorizontalAlignment.Center

21

}

22

}

23

Button {

24	text: "Button 03"

25	layoutProperties: DockLayoutProperties {

26	verticalAlignment: VerticalAlignment.Fill

27	horizontalAlignment: HorizontalAlignment.Fill

28

}

29

}

30

31

Button {

32	text: "Button 04"

33	layoutProperties: DockLayoutProperties {

34	verticalAlignment: VerticalAlignment.Bottom

35	horizontalAlignment: HorizontalAlignment.Right

36

}

37

}

38

}

39

}

实现效果：

http://www.onmoso.com/blackberry/281.html