Question

我需要开发一个bb 10级联应用程序，我需要在此图像中添加一个控件

http://subefotos.com/ver/?37868d57047746ce1ea9ca55b7637e9eo.jpg#codigos

（红色圆角）

当我触摸第二个气泡时，我需要显示第二个屏幕，第三个气泡第三个屏幕，依此类推。应显示默认屏幕是第一个屏幕（第一个气泡高亮）

但是如何在BB 10级联中执行此操作以及在bb 10中调用的控件是什么？

请帮忙，

谢谢!!!

Answer 1

-------在这里添加页面导航，为您的项目重新使用此代码-------------

从我的github示例中获取示例应用程序以供查询....

https://github.com/svmrajesh/BB-10-Cascades/tree/master/MY%20APPS/stackNavigation

1.main.qml :(第一页）

import bb.cascades 1.0

NavigationPane { id: navigationPane backButtonsVisible: false peekEnabled: false

Page {
    id: rootPage
    Container {
        background: Color.LightGray

        layout: DockLayout {

        }
        Label {
            text: "First page"
            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Center
        }
    }

    actions: [
        ActionItem {
            title: "Next page"
            ActionBar.placement: ActionBarPlacement.OnBar
            onTriggered: {
                var page = pageDefinition.createObject();
                navigationPane.push(page);

            }

            attachedObjects: ComponentDefinition {
                id: pageDefinition
                source: "PageTwo.qml"
            }
        }
    ]
}
onPopTransitionEnded: {
    page.destroy();
}

}

2.第二页

import bb.cascades 1.0

Page { id: pageTwo Container { background: Color.Gray layout: DockLayout {

    }
    Label {
        text: "Second page"
        horizontalAlignment: HorizontalAlignment.Center
    }


    Container {
        layout: StackLayout {

        }
        horizontalAlignment: HorizontalAlignment.Center
        verticalAlignment: VerticalAlignment.Center

        Button {

        text: qsTr("Next Page")
        imageSource: "asset:///images/picture1thumb.png"
        onClicked: {
            // show detail page when the button is clicked
            var page = getSecondPage();
            console.debug("pushing detail " + page)
            navigationPane.push(page);
        }
        property Page secondPage
        function getSecondPage() {
            if (! secondPage) {
                secondPage = secondPageDefinition.createObject();
            }
            return secondPage;
        }
        attachedObjects: [
            ComponentDefinition {
                id: secondPageDefinition
                source: "PageTwoOne.qml"
            }
        ]
    }

    Button {
       text: "Previous Page"
       onClicked: {
           navigationPane.pop();
       }

    }

}
}

/* ------------- Use this Code If back button visibility is "True"-----------------

paneProperties: NavigationPaneProperties {

    backButton: ActionItem {
        title: "Back"
     // imageSource: "asset:///back.png"
        onTriggered: {
            navigationPane.pop();
        }
        }
} */

}

3.last page

import bb.cascades 1.0

Page { id: pageTwoone

    Container {
 background: Color.DarkGray
 layout: DockLayout {}

 Label {
        horizontalAlignment: HorizontalAlignment.Center
        text: "Last Page"
 }


 Container {
      layout: StackLayout {}
      horizontalAlignment: HorizontalAlignment.Center
      verticalAlignment: VerticalAlignment.Center


    Button {
        horizontalAlignment: HorizontalAlignment.Center
        verticalAlignment: VerticalAlignment.Center
        text: qsTr("Goto Home Page")

        onClicked: {
            // show detail page when the button is clicked
            navigationPane.navigateTo(rootPage);
             }
            }
        Button {
            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Center
            text: qsTr("Goto Back")

            onClicked: {
                // show detail page when the button is clicked
                navigationPane.pop();
            }

        }
    }
}
}

------------添加更多使用此代码导航的页面--------------------------- -

-------------复制此代码并运行..如果需要，从上面的链接获取示例应用程序------

这个控件是什么以及如何在BB 10级联中使用它进行导航

1 个答案:

}

}