顶部挡板bb10上的设置

时间:2013-07-18 10:49:36

标签: qml blackberry-10 blackberry-cascades

更新

我想通过滑动顶部挡板来实现设置,这是我的代码,我这样做了吗?目前这不起作用。我想知道如何实现它。我应该把代码放在哪里,我缺少什么才能使它工作?

import bb.cascades 1.0

NavigationPane {
    //property variant menu;

    Menu.definition: MenuDefinition {
        settingsAction: SettingsActionItem {
            imageSource: "asset:///images/navbar_icon_settings.png"

            onTriggered: {
                cppObj.onSettingsClicked();
            }
        }
        actions: [
            ActionItem {
                title: "Action 1"
                imageSource: "asset:///images/navbar_icon_settings.png"
                onTriggered: {
                    cppObj.onSettingsClicked();
                }
            }
        ]
    }

    firstPage: Page {

        Container {
            background: Color.create("#f9f7f2");
            layout: StackLayout {}

            // Container for holding the title
            Container {
                horizontalAlignment: HorizontalAlignment.Center
                layout: DockLayout {}

                ImageView {
                    horizontalAlignment: HorizontalAlignment.Fill
                    verticalAlignment: VerticalAlignment.Fill
                    imageSource: "asset:///images/navigation_bar.png"
                }

                /*Container {
                    horizontalAlignment: HorizontalAlignment.Right
                    rightPadding: 30
                    topPadding: 40
                    layout: DockLayout {}

                    ImageButton {
                        id: btnsettings
                        verticalAlignment: VerticalAlignment.Center
                        defaultImageSource: "asset:///images/navbar_icon_settings.png"

                        onClicked: {
                            // show settings page when the button is clicked
                            cppObj.onSettingsClicked();
                        }
                    }
                }*/
            }
            Container {
                topPadding: 20
                leftPadding: 20
                rightPadding: 20
                bottomPadding: 20
                background: Color.create("#F4E9E1");
                horizontalAlignment: HorizontalAlignment.Fill
                layout: StackLayout {}

                Label {
                    verticalAlignment: VerticalAlignment.Center
                    horizontalAlignment: HorizontalAlignment.Left
                    text: cppObj.name

                    textStyle {
                        //  fontFamily: FontStyle.Default.Myriad
                        // fontSize: 36
                        color: Color.create("#60323C")
                    }
                }
            }

            Container {
                verticalAlignment: VerticalAlignment.Center
                horizontalAlignment: HorizontalAlignment.Center
                layout: DockLayout {}
                Divider {}
                ScrollView {
                    scrollViewProperties {
                        scrollMode: ScrollMode.Vertical
                    }
                /* ImageView {
                 id: listviewbackground
                 verticalAlignment: VerticalAlignment.Center
                 horizontalAlignment: HorizontalAlignment.Center
                 scalingMethod: ScalingMethod.Fill
                 imageSource: "asset:///images/list_view_cell.png"
                 }*/

                    ListView {
                        id: lvprojects
                        dataModel: cppObj.model()

                        listItemComponents: [
                            ListItemComponent {
                                type: "item"

                                Container {
                                    horizontalAlignment: HorizontalAlignment.Center
                                    layout: DockLayout {}
                                    touchPropagationMode: TouchPropagationMode.Full;

                                    StandardListItem {
                                        title:ListItemData.desc
                                    }
                                }
                            }
                        ]

                        onTriggered: {
                            var selectedItem = dataModel.data(indexPath);

                            onClicked: {
                                // show issue's comment page when the button is clicked
                                cppObj.onIssueClicked(selectedItem.name);
                            }
                        }
                    }
                }
            }
         }
         actions: [
             ActionItem {
                 title: qsTr ("Add Issue")
                 imageSource: "asset:///images/actionbar_icon_add.png"
                 ActionBar.placement: ActionBarPlacement.OnBar

                 onTriggered: {
                     cppObj.onAddIssuesClicked();
                 }
             },

             ActionItem {
                 title: qsTr ("Issues")
                 imageSource: "asset:///images/actionbar_icon_issues.png"
                 ActionBar.placement: ActionBarPlacement.OnBar

                 onTriggered: {
                     cppObj.onIssuesClicked();
                 }
             },

             ActionItem {
                 title: qsTr ("Members")
                 imageSource: "asset:///images/actionbar_icon_members.png"
                 ActionBar.placement: ActionBarPlacement.OnBar

                 onTriggered: {
                     cppObj.onMembersClicked();
                 }
             }
         ]
    }
    /*attachedObjects: [
        ComponentDefinition {
            id: settingsPage
            source: "topsettings.qml"
        }
    ]
    onCreationCompleted: {
        // Create the app menu for the cookbook.
        menu = settingsPage.createObject();
    }
    onPopTransitionEnded: {
        // Transition is done destroy the Page to free up memory.
        page.destroy();
    }*/
}

这是topsettings.qml

MenuDefinition {
    settingsAction: SettingsActionItem {
        imageSource: "asset:///images/navbar_icon_settings.png"

        onTriggered: {
            cppObj.onSettingsClicked();
        }
    }

不显示设置:

enter image description here

2 个答案:

答案 0 :(得分:1)

您的代码看起来不错:唯一的问题是您尝试在Menu.definition中定义Page,但您应该在Pane中定义它。例如:https://github.com/Kernald/tt-rss-bb10/blob/master/assets/main.qml#L9

顺便提一下,请注意您已为“帮助”和“设置”预定义了操作。请看之前的链接,我也使用它们。

答案 1 :(得分:1)

假设您在应用程序启动时首先加载了NavigationPane作为QML文档,因此应将其放在MenuDefinition中,如下所示:

NavigationPane {

    Menu.definition: MenuDefinition {
        helpAction: HelpActionItem {
            onTriggered: {               
            }
        }
        actions: [
            ActionItem {
                title: "Action 1"
                imageSource: "asset:///images/ic_action1.png"
                onTriggered: {
                }
            },
            ActionItem {
                title: "Action 2"
                imageSource: "asset:///images/ic_action2.png"
                onTriggered: {
                }
            }
        ]
    }

    firstPage: Page {
    }
}

注意,如果您想要实现类似的菜单条目,最多可能有4个元素,HelpActionItem以及SettingsActionItem已经定义。