ListView trackpad navigation

Hello

I want to know if anyone tried to change with trackpad navigation in the listview.

I ListItemComponent now:

ListItemComponent {
    content: Container {
        CheckBox {
        }
        Label {
            text: ListItemData.title
        }
    }
}

At startup, check box of the first line focuses, descendant of focus moves to etc box of the second row. Moving right door component the list from the previous row item and moving right emphasis again making up the list for the current line item.

Is it possible to change the path to:

at startup, list of first line component focused, moving down to the door of the box of the first line, move to the bottom of the list in the second row focus point component, move to the bottom of the box of the second row focuses, etc...?

Yes, it was my first idea. But this isn't what I want. I tried to remove the update and it is impossible to check the checkbox with trackpad and I want something different to do in onTriggered.

I solved it with the addition of ImageButton that does the same thing as onTriggered. So now with touch: checkebox + onTriggered, trackpad: checkbox + image button.

In any case thanks for the comment!

ListItemComponent {
    content: Container {
        CheckBox {
        }
        Label {
            text: ListItemData.title
        }
        ImageButton {
        }
    }
}

Tags: BlackBerry Developers

Similar Questions

  • TrackBall/TrackPad Navigation between multiple GridFieldManagers

    I'm not bad with the UI for the storm.  However, I do my first port to TrackBall/TrackPad BlackBerry, and I find it a little harder than I thought.

    They way my layout of the screen, it seems that a Manager custom holding several GridFieldMangers is the easiest way to go to reach my goals.  However, I ran into a problem.  When I use a TrackBall to go from a GridFieldManager to an another GridFieldManager, the own field it does not receive the focus.

    For example; If the field in the very lower right cell of the GridFieldManager high on the page has the focus and I have move the focus down GridFieldManager, the upper-LEFT cell gets the focus.  I want the top RIGHT cell to have the focus if the movement is fluid.

    The only thought I have at the moment is:

    1. When a cell in the bottom row of the top GridField loses the focus, I put a variable to identify the button that is loses focus.
    2. I need to set this variable to a null value if the movement of the navigation will not the low GridFieldManager.
    3. When the upper-left cell of the bottom GridFieldManager gets focus, I do a check to see if a cell in the bottom row of the upper GridField just lost focus.  If she did access the variable that identifies the button that has lost focus, and then uses this information to bring the focus to the appropriate button for the fluid movement of the trackBall navigation.

    It would also be reversed to move down in GridFieldManager GridFieldManager upward.

    It sounds terribly complicated for something I think a lot of developers would go in. So my question is, I making more complicated it must be or I'm on the right track?

    Any thoughts are appreciated.

    Thank you!

    Say, if anyone can think of other keywords people might use for this research, please label.

    My apologies, my second statement how identified evil GridField.

    Amended return for Top GridField //if

    until //if substantive statement GridField

    Private boolean IsTouchScreen is Touchscreen.isSupported ();.
    private CustomButtonField CurrentFocusButtonField = null;

    {public focusChanged Sub (field field, int eventtype)

    If (!.) IsTouchScreen) {}

    If statement for Top GridField
    If (field == & eventtype == FOCUS_GAINED & CurrentFocusButtonField! = null) {}
    eventbutton = ((CustomButtonField) CurrentFocusButtonField) .getButton ();
    CurrentFocusButtonField = null;
    Switch (eventbutton) {}
    case CustomButtonField.BUTTON1:
                           

  • WebWorks widget navigation mode work only not in ripple or Phone Simulator

    Hi, this is my first Bb Widget/WebWorks app, and I am currently having problems with the navigation mode.  Basically, it does not ripple, or in the simulator of v6.0 9700 device or on a real device of 9700 after packaging and signing of the package.

    I have read the documentation on the official website of WebWorks on the use of navigation mode:

    http://devBlog.BlackBerry.com/2010/05/BlackBerry-widget-navigation-mode/

    https://bdsc.webapps.BlackBerry.com/HTML5/documentation/ww_developing/rim_navigation_element_1582456...

    https://bdsc.webapps.BlackBerry.com/HTML5/documentation/ww_developing/using_the_navigation_mode_1866...

    I find these forums and found a how to on a policy which could have disabled Javascript on the phone, but my camera is not a policy, and it is not connected to a corporate server.

    Here are the contents of the config.xml file.


    http://www.w3.org/ns/widgets ".
    "xmlns:RIM ="http://www.blackberry.com/ns/widgets"
    version = "2.3.0.9".
    RIM: header = "" Widget-RIM: RIM/widget ">"
        
        
     
      nnn
      nnn - nnn
      ipsom
      <>committees mode = "auto" / >
     
     
     
     

    The application uses nine HTML files, including the file index.html.  Here is an excerpt of the file index.html.

    To check widget works, I have included this javascript call to display the name of the application from the config.xml file, and when the page appears in the training, the Simulator or on the device, the name of the application appears.

    The index.html page provides a list of items that have a link to the other pages.  Here is a sample of some of the links.  According to the documentation of WebWorks, the element will automatically receive focus when the user navigates to the screen in the application.  Just to be safe, I've added option, x-blackberry-Focus = "true" to some of the links to try to force the focus navigation, but it does not work.

    AAA

    BBB

    CCC

    Essentially, when the application loads in Wellington, I can navigate the application because the training allows me to use the mouse pointer in Windows to control what is on the screen of the virtual device.

    When I package, sign and load the application on the Simulator, the Windows mouse pointer is of no use in the Simulator, so at the start of my application, I try to use the cursor keys to navigate through the page, but the elements do not receive focus.  Of course, the cursor keys work in the Simulator, because they move the cursor autour, let me choose the icons etc.

    The only way I can get a pointer to appear in my app is when I press the menu button on the simulated phone and choose the Select option, which then displays a text on-screen cursor, and then moving the trackpad, the cursor becomes a pointer that I can move and then click a link properly following the href attribute.

    I loaded the application signed on my device and the behavior is exactly the same with the Simulator.  I must be doing something wrong because I searched with Google and have not been able to find similar experiences.  My config.xml file is missing a value?

    I'm sorry, I should have said something too.  Ripple itself does emule not the trackpad navigation.  So, you won't see focus moving in your content when you try to interact with the trackpad (it does nothing).

    However the Simulator certainly should allow you to test this feature.

    Is the snippet of code provided here work for you?

    https://bdsc.webapps.BlackBerry.com/HTML5/documentation/ww_developing/using_the_navigation_mode_1866...

  • Vertical transition between panels

    Hello

    Does anyone know if there's a widget that will allow the user to drag upward or down on their mouse trackpad navigation vertically between the panels?

    The navigation points and the keyboard up and down arrows seem to be the only way.

    But I really want to give the user the ability to swipe on the trackpad mouse.

    Thanks in advance for your help

    Not something that can be done directly from end of Muse, but you can try these alternative options:

    http://musewidgets.com/search?q=mouse

    Thank you

    Sanjit

  • Navigation in TrackPad control

    I asked widget that displays a datatable in a div. I use navigation of Rim and capture events onLeft, onRight, and when the Div containing the datatable is selected. I want to give my users the ability to slide on their trackpad and be able to move to the next datatable, but currently on a whim a user can scroll through 3 or 4 sets of data.

    Recommendations on how to deal with this? It reminds me the issue of the 'button' bounce in an integrated development environment.  I tried a setTimeout to delay the evolution of data sets, but nothing helped.

    After looking in the scenario, here's what our development team has for the entry:

  • How to load data into datamodel of the listview that is not not the direct child of the navigation pane

    Hello

    I have two pages main.qml and score.qml and I want to display groupdata model data using listview in score.qml.  The problem is that score.qml is not a direct child of the navigationpane, he is not able to locate the subject of groupdatamodel and cannot be binding. How can I display data in this case?

    I am surprised that the attachedobject method has failed. You can try attaching score.qml as a page and not a definition of component?

  • Update a listView when a page is skipped

    Hi all

    I'm new in the cascades, in the developing world. I'm trying to do a two pages about the first page exposure items to a listview and has buttom "new item" action at the bottom. it triggers now pushes the second page that contains fields for a new record. He has a backup action button. When trigged inserts the element in the database and revealing the first page is displayed. My problem is that the new record is not displayed on the page. at least I got close and reopen the application. I use a sql database to populate the list. and I do everything in the cascades (no C++ backend)

    Thanks in advance for your help.

    Welcome on the support forums.

    you have several options.

    -Insert the item in sql, then reload the entire listview. You can do it by listening to the signal onTopChanged of the navigation pane.

    -inclusion of the item in the list or the model data (as well as in sql). It's a better solution in most cases, at least if the sorting is not done by sql or similar.

  • How to recharge a ListView when an item is deleted or changed?

    So I have a ListView in a Page that lists the files.  And the selected files are sometimes renamed or deleted on the triggering of action items, how to refresh the ListView to reflect these changes?

    I would refresh my data model during the outbreak of the follow-up action. It would be just a matter of ListView redisplay with the new data model data.

    It is not in a Navigation pane so I can't push a ComponentDefinition.

    Hello

    Have you tried clearing the datamodel and re - insert the data into it.

    Clear() - http://developer.blackberry.com/cascades/reference/bb__cascades__groupdatamodel.html#function-clear

    insertList() - http://developer.blackberry.com/cascades/reference/bb__cascades__groupdatamodel.html#function-insert...

  • is it possible to have a mouse pointer type navigation system in my java application?

    Hello

    Basic question, but I have to ask: is it possible to have the scheme of navigation mouse pointer type/style in my java application?  Rather than having the focus of just tab trackpad/ball around the screen?

    Thank you

    It is relatively easy to have a pointer that can move around the screen.  What's more complicated is to find where this point is in relation to the fields that you have on the screen, and so the fields that have the focus.  So of course what do you with this pointer while people type?  or if there was a pointer, users will need to click to select the input field?  Then once you have selected an input field, made the moving average of scrolling trackball with - in the area or that the bar has to be moved.  Everything becomes complicated.

    Unless someone is willing to throw a lot of money to you to implement this, I would say that the answer is no.

  • Navigation in Blackberry 10

    Hi all

    I have following Qml Code for navigation. It has three Pages and and works fine... but here's one

    small problem. that is to say;  I have defined all three pages in a single file called unique Qml 'main. QML. I want to write a separate Qml file for each page and attach them to 'hand. QML. Here is my code...

    // Default empty project template
    import bb.cascades 1.0
    // To access Timer in QML, we need to import the CustomTimer library.
    //import CustomTimer 1.0
    
    NavigationPane {
        id: navigationPane
        Page {
            // The initial page
            id: tradeListPage
    
            Container {
                ListView {
                    id: tradeList
                    objectName: "tradeList"
                    layout: StackListLayout {
    
                    }
                    dataModel: GroupDataModel {
                        grouping: ItemGrouping.None
                    }
    
                    listItemComponents: [
                        ListItemComponent {
                            type: "header"
                            Header {
                                title: {
                                    ListItemData
                                }
                            }
                        },
                        // The tradeList Item
                        ListItemComponent {
                            type: "item"
                            Container {
                                id: listItems
                                layout: AbsoluteLayout {
    
                                }
                                Label {
                                    id: symbol
                                    text: ListItemData.Symbol
    
                                    // Text Style and size etc
                                    textStyle.base: SystemDefaults.TextStyles.SmallText
                                    layoutProperties: AbsoluteLayoutProperties {
                                        positionX: 10.0
                                    }
    
                                    textStyle.fontSizeValue: 30.0
                                }
                                Label {
                                    id: bidprice
                                    text: ListItemData.BidPrice
                                    textStyle.base: SystemDefaults.TextStyles.SmallText
                                    layoutProperties: AbsoluteLayoutProperties {
                                        positionX: 100.0
                                    }
                                    textStyle.fontSizeValue: 30.0
    
                                }
                                Label {
                                    id: open
                                    text: ListItemData.Open
                                    textStyle.base: SystemDefaults.TextStyles.SmallText
                                    layoutProperties: AbsoluteLayoutProperties {
                                        positionX: 300.0
                                    }
                                    textStyle.fontSizeValue: 30.0
                                }
                                Label {
                                    id: askprice
                                    text: ListItemData.AskPrice
                                    textStyle.base: SystemDefaults.TextStyles.SmallText
                                    layoutProperties: AbsoluteLayoutProperties {
                                        positionX: 450.0
                                    }
                                    textStyle.fontSizeValue: 30.0
                                }
                                Label {
                                    id: close
                                    text: ListItemData.Close
                                    textStyle.base: SystemDefaults.TextStyles.SmallText
                                    layoutProperties: AbsoluteLayoutProperties {
                                        positionX: 600.0
                                    }
                                    textStyle.fontSizeValue: 30.0
                                }
                            }
                        }
                    ]
    
                }
                Button {
                    id: charts
                    text: "Charts"
                    verticalAlignment: VerticalAlignment.Bottom
                    onClicked: {
                        navigationPane.push(chartsPage)
                    }
                }
                Button {
                    id: qiuckview
                    text: "Quickview"
                    verticalAlignment: VerticalAlignment.Bottom
                    onClicked: {
                        navigationPane.push(quickViewPage)
                    }
                }
            }
        } //End of The initial page
    
        attachedObjects: [
            Page {
                id: chartsPage
                Container {
                    WebView {
                        id: chartview
                        url: "local:///assets/candlechart/bar.html"
                        // url: "http://www.google.co.in/"
                        settings.zoomToFitEnabled: true
                        settings.activeTextEnabled: true
                        objectName: "webview"
                    }
                }
            }, // end of the chartsPage
            Page {
                id: quickViewPage
                Container {
                    layout: StackLayout {
    
                    }
                    Label {
                        text: "Prev Close :" + propertyMap.Close
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Bid :" + propertyMap.BidPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Ask :" + propertyMap.AskPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Open :" + propertyMap.Open
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Days of Range :" + propertyMap.AskPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                }
            } // end of the quickViewPage
        ] // end of the attachedObject
    }
    

    now, I want to create a Qml file, sepere as 'charts. QML"like below...

    Page {
                id: chartsPage
                Container {
                    WebView {
                        id: chartview
                        url: "local:///assets/candlechart/bar.html"
                        // url: "http://www.google.co.in/"
                        settings.zoomToFitEnabled: true
                        settings.activeTextEnabled: true
                        objectName: "webview"
                    }
                }
            }
    

    and "Quickview. QML"as...

     Page {
                id: quickViewPage
                Container {
                    layout: StackLayout {
    
                    }
                    Label {
                        text: "Prev Close :" + propertyMap.Close
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Bid :" + propertyMap.BidPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Ask :" + propertyMap.AskPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Open :" + propertyMap.Open
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                    Label {
                        text: "Days of Range :" + propertyMap.AskPrice
                        textStyle.base: SystemDefaults.TextStyles.SmallText
                        textStyle.fontSizeValue: 30.0
                    }
                }
            } // end of the quickViewPage
    

    How to call these in pane (main.qml) navigation. Thanks in advance

    This will load in fact all pages at once. It is best to use a ComponentDefinition which allows to create objects at run and save some memory.

    ComponentDefinition {
        id: myPage
        source: "MyPage.qml"
    }
    

    You can place these in the attachedObjects table. To create it just do:

    var page = myPage.createObject();
    

    Some additional information can be found in this lesson.

  • On the Navigation pane

    Hello

    in my application consists of four different pages, so the navigation must occur one after another by clicking on the buttons in the navigation pane used pirticular page.i, using this I am able to navigate to the next page, after that how can I move to another page.

    Thank you.

    When the page is pushed into the NavigationPane, the NavigationPane becomes its parent.

    It can be accessed like this:

    SecondPage.qml

    Page
    {
      id: secondPage
    
      ...
    
      secondPage.parent.push(thirdPage) // secondPage.parent is Page's NavigationPane
    }
    

    ThirdPage.qml

    Page
    {
      id: thirdPage
    
      ...
    
      thirdPage.parent.push(fourthPage)
    }
    

    etc.

    Also, you can access items in the hierarchy by their id-s even between QML files. Thus, a reference to the NavigationPane directly by id probably will also work. It will work in some cases, for example if there are the ListViews in the hierarchy. I like the previous approach, because the pages will be autonomous and they can be easily rearranged.

  • ListView / DataModel crash

    Hello

    I'll have a consistent crash in my application and could not find a solution. Basically I have a GroupDataModel as a QProperty in my main class. Then, I have a page with three buttons. Each button creates and opens a page different qml. One of the qml pages contains a ListView that is connected to the above mentioned data model. The first time the page is opened there is no problem. Then when I go back (which causes the page to be destroyed) and re-enter the page, it crashes. No other pages are affected and can be opened infinite times. I know that it is GroupDataModel, because if I change the listview datamodel to point to a temp .xml file I open this page again for unlimited times. Here are a few pieces of code that I feel are important to this question:

    in class.hpp

    public :Q_PROPERTY(bb::cascades::GroupDataModel *expensesModel READ expensesModel CONSTANT);
    
    private :
    bb::cascades::GroupDataModel* expensesModel() const;
    bb::cascades::GroupDataModel* m_expensesModel;
    

    in class.cpp

    bb::cascades::GroupDataModel* ExpenseTracker::expensesModel() const {
        return m_expensesModel;
    }
    

    in the page containing the buttons:

    Button {
                            text: "Loans"
                            onClicked: {
                                app.updateDataModel("", "Loan");
                                var page =loanPage.createObject();
                                page.type = "Loan"
    
                                mainNavigationPane.push(page);
                            }
                            attachedObjects: ComponentDefinition {
                                id: loanPage
                                source: "Expenses_QML/ExpensePage.qml"
                            }
                        }
                        Button {
                            text: "Reports"
                            onClicked: {
                                var page = reportPage.createObject();
                                mainNavigationPane.push(page);
                            }
                            attachedObjects: ComponentDefinition {
                                id: reportPage
                                source: "Reports_QML/ReportPage.qml"
                            }
                        }
    

    reportPage can be opened permanently, only expensePage.

    In the navigation pane:

        onPopTransitionEnded: {
            console.log("got here");
            page.destroy();
        }
    

    In ExpensePage.qml (which cannot be opened once)

    ListView {
                onTriggered: {
                    var viewExpensePage = viewExpensePageDef.createObject();
                    viewExpensePage.expenseData = dataModel.data(indexPath);
                    mainNavigationPane.push(viewExpensePage)
                }
                layout: StackListLayout {
                }
                /* with only this changed page can be opened infinite times
                 * dataModel: XmlDataModel {
                 * source: "models/sheetmodel.xml"
                 * } */
                dataModel: app.expensesModel
                listItemComponents: [
                    ListItemComponent {
                        type: "item"
                        id: listItemComponent
                        ExpenseListItemView {
                            id: thumbListView
                        }
                    }
                ]
            }
    

    I absolutely need this page to be created and deleted everything being open/closed, because it is the key in my architecture. So I can't solve this problem the "cheating" way to not destroy the page and leaving always responsible. All suggestions are welcome! If more code is needed let me know and I'll add it.

    Thank you

    Gerry

    You cannot use the same datamodel on several lists, you try to do?

    In addition, when a page is destroyed, everything on the page gets destroyed, so when listview is destroyed, it removes also the datamodel, who so if you try and open the page again, you will be the datamodel of new listview to an address memory random with nothing there, it will crash.

  • Navigation by clicking of the manager that affect the present ActiveRichTextField in the Manager.

    Hi all

    I have a HorizontalFieldManager containing different custom fields, among which ActiveRichTextField is one of them. I gave a click of navigation for the Manager in the code:

    protected boolean navigationClick (int status, int time) {}
    {if (Touchscreen.IsSupported ())}
    Returns false;
    } else {}
    fieldChangeNotify (1);
    Returns true;
    }
    }
        
    protected boolean touchEvent (TouchEvent message)
    {
    If (TouchEvent.DOWN is {message.getEvent ()})
    FieldChangeListener listener = getChangeListener();
    If (listener! = null)
    this.setFocus ();
    }
            
    If (TouchEvent.CLICK == message.getEvent ())
    {
    FieldChangeListener listener = getChangeListener();
    If (null! = earpiece)
    this.setFocus ();
    listener.fieldChanged (this, 1);
    }
    Return super.touchEvent (message);
    }

    and then treatment to the touch by using FieldChangeListener. When I click on the ActiveRichTextField contained in the horizontal field Manager, action for, click Manager is run. Please can someone tell how this can be avoided. Thanks in advance.

    "If this field with focus is instance of ActiveRichTextField I should call super.touchEvent ().

    No, if you put the code in navigationClick...!

    Putting this another way, I mean:

    Super. ();

    "I can't choose only one of the fields to handle the click event of the manager that my requirement is to treat the click, clicking anywhere on the Manager."

    I think you can do it, because the movement key or trackpad will move the focus in one of your fields, and assuming you have only two fields focusable in the Manager, then it will be your ActiveRichTextField or your field.  As mentioned, managers do not get then to enter a Manager, the BB a to move the focus to a focus scope.

  • ListView does not populate when entered second time

    Hi all

    It comes to my previous query:

    http://supportforums.BlackBerry.com/T5/Cascades-development/problem-with-findChild/m-p/2441175#M2524...

    Now when opening the app, I can see the listview in the note.qml and after click on return of the navigation pane and enter the same page (note.qml) still I am not able to see the ListView.

    The code is available in the link above.

    I guess that groupDataModel is exposed via C++ right? Is Qt.objectCrypt.fetchNotes () who is to fill the data model?

    I think your problem might be that the ListView takes possession of the "groupDataModel". Then he destroyed it once the page is destroyed. And the second time, it does not appear because the data model is already destroyed.

    See the documentation of the ListView, as soon as you assign it a dataModel is supported if the datamodel does not have a previous parent. So your solution is perhaps here give the groupDataModel a parent existing if ListView does not try to take ownership.

  • How to access an item in the ListView

    I have a ListView with a GroupDataModel (a size). I have navigated to specific option when it appears. Unfortunatelly nor

    ListView {
       .
       .
      onCreationCompleted: {
          scrollToItem(QVariantList() << x, ScrollAnimation.None);
      }
       .
       .
    }
    

    Neither

    ListView {
       .
       .
      onCreationCompleted: {
          select(QVariantList() << x, true);
      }
       .
       .
    }
    

    works. (x is a simple number) What can I do else?

    It's the C++ syntax. QML/JavaScript, it would be

    idOfListView.scrollToItem ([x], ScrollAnimation.None)
    or
    idOfListView.scrollToItem ([0, x], ScrollAnimation.None)

Maybe you are looking for