BlackBerry10 Cascades之DockLayout

来源：互联网发布：java课程设计编辑：程序博客网时间：2024/05/21 01:58

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

类继承关系：

BlackBerry10 Cascades DockLayout

C++代码实例：

01Container* pContainer = new Container();
02DockLayout *pDockLayout = new DockLayout();
03pContainer->setLayout(pDockLayout);
04  
05DockLayoutProperties* pProperties = 0;
06  
07// Position button 1 horizontally centered and docked to the top
08// of the container
09Button* pButton1 = Button::create().text("Button1");
10pProperties = DockLayoutProperties::create();
11pProperties->setHorizontalAlignment(HorizontalAlignment::Center);
12pProperties->setVerticalAlignment(VerticalAlignment::Top);
13pButton1->setLayoutProperties(pProperties);
14  
15// Position buttons 2 vertically centered and docked to the
16// right edge of the container
17Button* pButton2 = Button::create().text("Button2");
18pProperties = DockLayoutProperties::create();
19pProperties->setHorizontalAlignment(HorizontalAlignment::Right);
20pProperties->setVerticalAlignment(VerticalAlignment::Center);
21pButton2->setLayoutProperties(pProperties);
22  
23pContainer->add( pButton1 );
24pContainer->add( pButton2 );

实现效果：

BlackBerry10 Cascades DockLayout

QML代码实例：

01import bb.cascades 1.0
02 
03Page {
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}

实现效果：

BlackBerry10 Cascades DockLayout

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