NavigationPane ButtonBack overlapps content

Similar Questions

• NavigationPane ButtonBack question

  Hi all, I tried to change NavigationPane backButton, but nothing happens. This is a bug or I'm doing wrong? Here is my code:

  NavigationPane {
      id: navigationPane
      paneProperties: NavigationPaneProperties {
          backButton: ActionItem {
              title: "text"
              imageSource: "asset:///images/npane.png"
              onTriggered: {
                  helpToast.show();
              }
          }
      }
  

  It is not supposed to be a part of another component. This example makes be think so...
  http://developer.BlackBerry.com/Cascades/reference/bb__cascades__navigationpaneproperties.html

• How to connect the ButtonClick events to NavigationPane.popAndDelete within QML

  Hi all

  I know to connect my click event of the button to NavigationPane.popanddelete in the native SDK,

  I want to implement this feature in QML, how to implement it.

  My struct QML is something like this:

  P

  MyHeader.QML
  
  Container{
     Button{
       objectName:"BackButton"
       onClicked:..//how to write here
     }
  }
  
  MyPage.QML
  
  Container{
     MyHeader{
     }
     Container{
     }
  }
  
  within C++
  
              QmlDocument *qml = QmlDocument::create("MyPage.qml");
              AbstractPane *mypage= qml->createRootNode();
             // Button *button = alertPage->findChild("BackButton");
              //QObject::connect(button,SIGNAL(clicked()),this,SLOT(onPreviousClick()));
             m_pagePane->push(mypage);
  

  Thanks in advance...

  Hello

  I want everything first, make sure that you know about the properties of the component in QML. If you have inserted a page in your navigation pane and want to have a back button seems natural, you can use the following code in your definition of QML Page {}:

  paneProperties: {NavigationPaneProperties}
  ButtonBack: {ActionItem}
  Title: 'Back '.
  onTriggered: {}
  _navPane.pop ();
  }
  }
  }

  This will insert a lower bar filled with a previous button following a consistent style.

  If you want to raise the pop event from the QML document via manual button (no), in the property of your onClicked button, you can simply call pop on the handle of your navigation pane.

  for example
  Button {}
  ID: buttonTest
  objectName: "buttonTest.
  text: "text".
  onClicked: {}
  _navPane.pop ();
  }

  Please note that in both cases, you have exposed the handle of "_navPane" in your C++ code with subsequent calls (assuming that m_SidePaneContentQML is the name of your page with the back button):

  m_SidePaneContentQML = QmlDocument::create().load("SidePane/SidePane.qml");
  m_SidePaneQmlContext = m_SidePaneContentQML-> documentContext();
  m_SidePaneQmlContext-> setContextProperty ("_navPane", m_Nav);

  In this case, m_Nav would be the navigation pane that you use.

  Let me know if you need more information, I'm happy to help you.

  Good luck!

  Martin

• In the root of TabbedPane NavigationPane

  Hi all

  I have a TabbedPane and then a menu with a SettingsActionItem. When this settings button fires I want to push a page that contains the parameters to this subject, and then I can click back to return to tabs.

  import bb.cascades 1.0
  
  TabbedPane {
      Menu.definition: MenuDefinition {
          settingsAction: SettingsActionItem {
              onTriggered: {
                  var page = setingsView.createObject();
                  navigationPane.push(page);
              }
              attachedObjects: ComponentDefinition {
                  id: settingsView
                  source: "SettingsView.qml"
              }
          }
      }
      Tab {
          tite: "Tab1"
          NavigationPane {
              id: navigationPane
              Page {
                   //etc.....
              }
          }    }}
  

  However, the problem is that there is no navigation pane to push the new page. We cannot put a NavigationPane under the TabbedPane, but we can put it in a tab of a TabbedPane.

  So, how can I go all by pushing a new page?

  Thank you!

  [UPDATED ABOVE CODE]

  I got it work using files separated such as:

  hand. QML

  TabbedPane {
      id: newsPane
  
   Tab{
       title: ""
          TabOne {
              }
  }
  Tab{
      title: ""
         TabTwo {
             }
      }
  Tab{
      title: ""
         TabThree {
             }
      }
  Tab{
      title: ""
         TabFour {
             }
      }        
  
  }
  

  Then, he...

  TabOne.qml, TabTwo.qml, TabThree.qml and TabFour.qml:

  NavigationPane {
      Page {
         ....
         }
     }
  

  And it has an a NavigationPane feel TabbedPane when I can push to a page within the NavigationPane and action bar has more tabs, rather it changes the back button.  Can be illustrated in this app: http://appworld.blackberry.com/webstore/content/20197455/?lang=en (I wrote the application for OnlineTobago)

  So as much as your page 'Settings', why not use a spreadsheet?  This is exactly what a spreadsheet is intended, something that breaks the normal flow of navigation.  And it can be accessed via the system menu of any tab, if defined in the main.qml and using the property alias you can control the id defined in TabOne.qml, TabTwo.qml, etc. I have a sample where I do it too: http://bbcascades.com/index.php/tutorial-list/50-persistence-of-cascades-memory

  I hope this helps.

• Store a NavigationPane as a QML property

  I have code similar to the following places:

  onTriggered: {
      var chosenItem = dataModel.data(indexPath);
      var detailPage = detailsPageDefinition.createObject();
      detailPage.initDetailsPage(chosenItem);
      // Push the content page to the navigation stack
      main_list_nav.push(detailPage);
  }
  

  detailPage must also push the NavigationPane, but the problem is I have a couple of different NavigationPanes and the detailPage knows not only push you on.

  I want to be able to switch the navigation as the parameter pane to initDetailsPage() i.e.

  detailPage.initDetailsPage(chosenItem, main_list_nav);
  

  But how I declare this as a property? by DetailsPage.qml

  Page {
       property  navigationPaneToUse
  
       function initDetailsPage(item, navPane)
       {
            navigationPaneToUse = navPane
            ...
       }
  }
  

  If not, is there a property QML on a Page that tells it what NavigationPane he pushed to?

  Thanks for all the help guys. Suite suggested Zmey using the idea of the .parent property and generalizing javayoung above, I came up with this method I set on my UI root object, if it's available everywhere.

  It crosses just to the top of the tree of the child until it finds an ancestor with an object name that contains "NavigationPane", then push on that. In this way, that you don't need to store anything.

      function pushToParentNavigation(child, objToPush)
      {
          var cur = child;
          while(cur != null && cur.objectName.indexOf("NavigationPane") == -1)
          {
              cur = cur.parent;
          }
          if(cur.objectName.indexOf("NavigationPane") != -1)
          {
              cur.push(objToPush);
          }
          else
          {
              console.log("No NavigationPane in heirarchy!");
          }
      }
  

  So now I can just do this anywhere:

  // Push the content page to the navigation stack this page belongs to.
  pushToParentNavigation(this_page_id, myUIObject);
  

  This means that you must add objectName: 'NavigationPane' to all your NavigationPane who isn't ideal. If anyone can suggest a better way to do it, it would be great. I looked at JavaScript typeof operator, but it is not powerful enough.

• Sharing values between pages in NavigationPane

  Hello

  I'm trying the NavigationPane as well as 2 pages. In the first page, I collect certain values (via text fields, slider, etc.). After that the user fills all the values and click the 'calculate', the second page will be pushed on the screen to display results based on what the user has entered before.

  The way I do now is to store the values of the 'first' page in a few global variables in a javascript file. The second page will then read from these variables and perform the necessary calculation.

  First page:

  import bb.cascades 1.0
  import "ExtJS.js" as MortgageCal
  
  NavigationPane {
      id: navPane
      Page {
          content: Container {
              id: mortgagePaymentSettingPage
              Container {
                  TextField {
                      inputMode: TextFieldInputMode.PhoneNumber
                      id: valueTxt
                      onTextChanged: {
                          ExtJS.Value = Math.round(text)
                      }
                  }
              }
          }
          actions: [
              ActionItem {
                  title: "Calculate"
                  ActionBar.placement: ActionBarPlacement.OnBar
                  onTriggered: {
                      navPane.deprecatedPushQmlByString("resultPage.qml");
                  }
              }
          ]
      }
  }
  

  Second page:

  import bb.cascades 1.0
  import "ExtJS.js" as MortgageCal
  
  Page {
      content: Container {
          id: ResultPage
          Container {
              Label {
                  text: "User Entered: " + ExtJS.Value
              }
  
          }
      }
  }
  

  I wonder if there is a better alternative to make the values of the first page "visiable" on the second page?

  Thank you

  Hello

  the solution is very simple. You can access the valueTxt.text property in resultPage.qml as same qml.

  When you write valueTxt on the second page and put a point, he won't give a suggestion, you must write manually.

  When you compile it will work completely.

  You can access first qml varibale when the second page is pushed by the navigation pane.

  Try this,

  hand. QML

  import bb.cascades 1.0
  
  NavigationPane {
      id: navPane
      Page {
          content: Container {
              id: mortgagePaymentSettingPage
              Container {
                  TextField {
                      inputMode: TextFieldInputMode.PhoneNumber
                      id: valueTxt
                  }
              }
          }
          actions: [
              ActionItem {
                  title: "Calculate"
                  ActionBar.placement: ActionBarPlacement.OnBar
                  onTriggered: {
                      navPane.deprecatedPushQmlByString("resultPage.qml");
                  }
              }
          ]
      }
  }
  

   

  resultPage.qml

   

  import bb.cascades 1.0
  
  Page {
      content: Container {
          Label {
              text: " I am First page Text : " + valueTxt.text
          }
      }
  }
  

• NavigationPane metal back button

  Hello

  I placed a NavigationPane in a component of sheet cascading through qml. It works very well. If I place actions in the Page element that works too. But I can't afford to get the new action button in the NavigationPane. I can close the leaf via an ActionItem I manually place, but what looks like no standard for stocks to return. Also, I know that I could use the dismissAction in the title bar, but as I use a SegmentedControl in the title bar that is not an option for me.

  Here is a snippet of my code qml:

  {Sheet

  ID: detailsSheet
      
  NavigationPane {}
  paneProperties: {NavigationPaneProperties}
  ButtonBack: {ActionItem}
  Title: qsTr ("BACK")
  }
  }
          
  {Page}
  ID: sheetPage
              
  actions:]
  {ActionItem}
  Title: qsTr ("Library")
  ActionBar.placement: ActionBarPlacement.OnBar
  onTriggered: {}
  detailsSheet.close)
  }
  }
  ]

  }

  }

  }

  It works for the closure of the leaf, but the back button does not appear. In momentics there is a check box for "back buttons visible. Any ideas?

  The back button will only appear if there are two or more screens in NavigationPane. I don't know if it's good for UX close the worksheet by using the "back" button.

• NavigationPane property and objectname explanation

  Hi all!

  I worked with a variety of examples of applications that use objects NavigationPane (in QML) and have noticed that sometimes the pages and/or lists that are in the NavigationPane resemble properties of the component:

  NavigationPane {}

  ID: navigationPane

  firstPage: {Page}

  ID: pgMain

  content: {Of container

  {To ListView

  ID: listView

  set the name of the object to leave listView to be detectable from C++

  objectName: "listView".

  layout: {GridListLayout}

  ...

  Then, at other times, the words I in bold are simply not there.  This makes a difference or have a meaning? Also, when and why do you use ' objectName.  I looked through the documentation on both of these topics and not found many explanations.

  objectName can also be used in QML, for example, when a child iteration of a container to distinguish them.

  firstPage and content are the default properties. If the property name is omitted, the children of the element will be bound to a property by default (if there is a sense). More information on this:

  http://Qt-project.org/doc/Qt-4.8/PropertyBinding.html#default-properties

  Or better yet the example of Qt 5 documentation (it still applies to 4.8):

  http://Qt-project.org/doc/Qt-5.0/qtqml/qtqml-syntax-objectAttributes.html#default-properties

• Beta 3: call the application menu NavigationPane

  Now we can define menus of applications of Cascades in Beta 3, I tried to find how we can call all windows in a SettingsActionItem.

  I have a pane with tabs with a declared MenuDefination. I want to call a QML file that is a NavigationPane that contains the list of parameters. I have tried to seem so all documentation and sample applications and do not see the right way to do this. It would be nice to have a applications examples with an application menu that calls a settings screen.

  Can anyone help or recommend best practices for this?

  Thanks in advance.

  Ok. I managed to do the work.

  hand. QML

  import bb.cascades 1.0
  
  TabbedPane {
      showTabsOnActionBar: true
  
       Menu.definition: MenuDefinition {
          helpAction: HelpActionItem {
              imageSource: "asset:///icons/help.png"
          }
          settingsAction: SettingsActionItem {
              imageSource: "asset:///icons/setting.png"
              onTriggered : {
                 settingsSheet.open()
              }
          }
          actions: [
              ActionItem {
                  title: "Info"
                  imageSource: "asset:///icons/info.png"
              }
          ]
      } 
  
      attachedObjects: [
         Sheet {
             id: settingsSheet
             objectName: "settingsSheet"
             content: SettingsSheet {
                 id: settingsContent
             }
         }
     ]
  
      Tab {
          title: qsTr("Tab 1")
          Page {
              id: tab1
              Container {
                  Label {
                      text: qsTr("Tab 1 title")
                  }
              }
          }
      }
      Tab {
          title: qsTr("Tab 2")
          Page {
              id: tab2
              Container {
                   Label {
                      text: qsTr("Tab 2 title")
                  }
              }
          }
      }
      Tab {
          title: qsTr("Tab 3")
          Page {
              id: tab3
              Container {
                  Label {
                      text: qsTr("Tab 3 title")
                  }
              }
          }
      }
      onCreationCompleted: {
          OrientationSupport.supportedDisplayOrientation = SupportedDisplayOrientation.All;
      }
  }
  

  SettingsSheet.qml

  import bb.cascades 1.0
  
  NavigationPane {
      Page {
          Container {
              Label {
                  text: "Settings Page"
              }
          }
      }
  }
  

• Get the title or the content of the an element selected in the list view?

  Hello guys, I made a list view and I need to get the content of the selected item (item Ontriggerd)

  onTriggered: {}
  lable. Text =?
  navigationPane.push (bPage);
  }

  Thank you

  dataModel.data (row) returns a QVariant. To call ".someProperty", you will need to know the type of the object (int, string, etc.) and call the appropriate function (toInt, toString, etc.). For example, if your QVariant has elements of the string:

  lable. Text = dataModel.data (row) m:System.NET.SocketAddress.ToString ();

  An example aside, if she has a StandardListItem object:

  Label.Text = dataModel.data (row) .title ();

• Change orientation distorts the content of the screen on Dev Alpha (10.0.6.545)

  I use the Beta 2 SDK and my Alpha Dev is updated to 10.0.6.545.

  I want my application to support the changes in orientation from portrait to landscape and back. To implement, I followed the tutorial at:

  https://developer.BlackBerry.com/Cascades/documentation/dev/orientation/index.html

  When I flip the Alpha of Dev to change the orientation of the fashion portrait to landscape mode, it works. But when I flip it back to leave for the portrait, the content of my app's screen gets distorted / destroyed somehow so that more or less garbage appears. It is not just a question that all of my components are not moved or something (I understand I must handle this) but the screen content is garbled. When I go again in landscape mode it seems ok again. But when I go to the portrait of the screen is still once deformed. Here is a screenshot:

  

  I've found that I can reproduce this behavior also with examples of applications like weatherguesser and also with costs projects created from the project templates as examples NavigationPane or TabbedPane when I just turn on self-orientation in their bar - descriptor.xml file and just add an onCreationCompleted handler in their main.qml:

  onCreationCompleted: {
      OrientationSupport.supportedDisplayOrientation = SupportedDisplayOrientation.All;
  }
  

  Since the orientation change works very well for the operating system itself and the browser pre-installed too, and only my apps are affected, I think that I'm doing something wrong. Any tips?

  Is the source code for the tutorial above available as an archive available for download somewhere? I want to check it out.

  Or is it is a known issue in Beta 2? (I did not implement the change in orientation of support before Beta 2).

  (I have not found anything on this issue in the issue tracker.)

  Thanks in advance

  I've updated to Beta 3 SDK and the Dev Alpha 10.0.9.388 and this bug seems to be fixed.

• SettingsActionItem / NavigationPane in TabbedPane initialization

  I'm having a problem to SettingsActionItem to work properly with dynamic creation of NavigationPanes located in a TabbedPane.

  The problem is that when I run the app, I create the first NavigationPane tab to the onCreationCompleted signal. If I then try to access the SettingsActionItem, I can't push more pages on the settings page.

  If I select another tab, I can push more pages on the settings page, even when I return to the first who would work the first time. There must be something with the initialization of the first NavigationPane.

  import bb.cascades 1.0
  
  // Include asset folders
  import "folder1"
  import "folder2"
  import "folder3"
  
  TabbedPane {
      id: tabbedPane
      showTabsOnActionBar: false
  
      // Set to first tab id
  
      property NavigationPane currentNavigationPane: oneNavPaneObject
  
      property OneNavPane oneNavPaneObject
      property TwoNavPane twoNavPaneObject
      property ThreeNavPane threeNavPaneObject
  
      // Attached Objects
  
      attachedObjects: [
          ComponentDefinition {
              id: settingsListPage
              source: "SettingsListPage.qml"
          },
          Sheet{
              id: infoSheet
              InfoPage {
                  id: infoPage
                  onDone: {
                      infoSheet.close();
                  }
              }
          },
          ComponentDefinition {
              id: oneNavPaneDefinition
              OneNavPane { }
          },
          ComponentDefinition {
              id: twoNavPaneDefinition
              TwoNavPane { }
          },
          ComponentDefinition {
              id: threeNavPaneDefinition
              ThreeNavPane { }
          }
      ]
  
      // Application Menu
  
      Menu.definition: MenuDefinition {
          id: menu
          actions: [
              ActionItem {
                  title: "Info"
                  imageSource: "icons/info.png"
                  onTriggered: {
                      // For InfoPage, we will use Sheet
                      infoSheet.open();
                  }
              }
          ]
          settingsAction: SettingsActionItem {
              imageSource: "icons/settings.png"
              onTriggered: {
                  // For Settings, we will use NavigationPane
                  var settingsListPageObj = settingsListPage.createObject();
                  Application.menuEnabled = false;
                  currentNavigationPane.push(settingsListPageObj);
              }
          }
      } 
  
      // Tabs
  
      Tab {
          id: oneTab
          title: qsTr("One")
          imageSource: "icons/one.png"
          onTriggered: {
              oneNavPaneObject = oneNavPaneDefinition.createObject()
              currentNavigationPane = oneNavPaneObject
              oneTab.content = oneNavPaneObject
          }
      }
      Tab {
          id: twoTab
          title: qsTr("Two")
          imageSource: "icons/two.png"
          onTriggered: {
              twoNavPaneObject = twoNavPaneDefinition.createObject()
              currentNavigationPane = twoNavPaneObject
              twoTab.content = twoNavPaneObject
          }
      }
      Tab {
          id: threeTab
          title: qsTr("Three")
          imageSource: "icons/three.png"
          onTriggered: {
              threeNavPaneObject = threeNavPaneDefinition.createObject()
              currentNavigationPane = threeNavPaneObject
              threeTab.content = threeNavPaneObject
          }
      }
      onCreationCompleted: {
          oneNavPaneObject = oneNavPaneDefinition.createObject()
          currentNavigationPane = oneNavPaneObject
          oneTab.content = oneNavPaneObject
      }
  }
  

  Solved: Solution was to define the active tab.

      onCreationCompleted: {
          oneNavPaneObject = oneNavPaneDefinition.createObject()
          currentNavigationPane = oneNavPaneObject
          oneTab.content = oneNavPaneObject
          tabbedPane.activeTab = oneTab
      }
  

• By clicking on a button in the TabbedPane page opens a page with view NavigationPane

  Hello

  I want to have a tabbedPane as my main of the startup application view - with two tabs

  The first tab has a top button - which when clicked opens a new page... this new page (lets called him 'Détails' has a layout of navigation pane - so the tabs are no longer visible and a 'Back' button comes up.)

  By clicking on the "Back" button takes you back to the tabbedPane

  Is this possible at all?

  Thank you

  // main. qml
  TabbedPane {
      Tab {
          id: mainTab
          MainCustomPage {
          }
      }
      Tab {
          id: detailsTab
          DetailsCustomPage {
          }
      }
  }
  
  // MainCustomPage.qml
  NavgationPane {
  Page {
      // your main page content here
      }
  }
  
  // DetailsCustomPage.qml
  Page {
      // your details page
      }
  

  But if use you it, you can only push one screen battery! If you want to push more screens in NavigationPane, you must remove TabbedPane from your main screen

• Table of contents for several sheet file...?

  It is possible to:

  1. Create a Table of contents listing all sheets in a file?
  2. Have these hyperlink worksheet titles to the sheets themselves?

  I build what will eventually be a fairly large file (read: 75 + leaves). Rather than scrolling all the leaves one by one by one manually to locate the correct table, it would be useful to have a table of contents or an Index that lists the in order... Ideally, allowing the connection of hypertext link to the leaves they reference. (I swear that this was part of a way-back-when number...)

  Instead, is it possible to auto-trier worksheets in alphabetical order? He would not give me the project view as a table of contents or an Index of 35,000 feet, but at least it would be a little easier to find what it takes.

  Looking forward to sharing the wisdom...

  HI stephanie,.

  The numbers 2 (' 09) and 3 support not the hyperlinks to locations within the current document. Both take in charge of hyperlinks that open a Web page in your default browser or which will open and send a new e-mail message.

  Command-F can be your friend here.

  Place an array of single cell on each sheet (or use a cell on the existing table). Enter a short text string that identifies the table or sheet. Each string must be unique in the document.

  To access the card containing one of the following strings:

  Press Control + F to open the Find dialog.

  Enough chain to identify the worksheet type.

  Number will draw this roadmap forward as soon as it can determine which table contains the cell containing this string.

  Tested with four sheets containing:

  able, baker, charlie and delta

  With this limit together (and any other tables in the document - quite an artificial situation!), type c or d was enough to bring me to sheet 3 or 4, sheets 1 and 2 required two letters (ab or ba) to identify the good sheet and bring it forward.

  

  

  With a document containing several tables (and more leaves), create (and remembering) a separate channel for each becomes more complicated.

  You can place a second copy of each in a table of Index or table of contents on a separate sheet. From the index table,

  Copy the entry for the table/worksheet you want to go.

  Open the dialog to find (command-V)

  Paste the entry in the search box. (What it will find and highlight the entry that you have copied to the index table)

  Click on the > button on the dialog to find the occurrence FOLLOWING this string (on your target table.

  Kind regards

  Barry

• Why Safary does not load the content of pages?

  Why Safary does not load the content of pages? I mean, when I hover over the places where should be the content, he is always showing the "redirect to: [email protected]/" lower left. My Safari is 9.5 and worked fine until Safe Fimder Virus get inside my computer. Mozilla Firefox is a bit slower. If someone could give me an idea on how to deal with it, I would be happy.

  Sorry if my English is not good, I am a Brazilian who is still learning English

  Your English is very good!

  Redirects are usually due to adware or malware.

  Download the run MalwareBytes.

  It of free and takes only a minute or two. Which should remove all adware and malicious software on your Mac.