July 29, 2010

gault gault
Lab Rat
3 posts

How to create a multi-view application?

 

As we known, most of mobile applications are multi-view based. Does Qt Quick provide a standard way to do this? Or could somebody give an example to show how to create it manually?

Another questions:

1. QAction – action is basic type supported by QML. But I could not use it like this:

Property action openFile

2. How to assign value to action type in QML?

3. How to define a list property? How to use list in function?

How to implement a context sensitive toolbar?

I just want to define a property like this: list<action> actions, then use it in a function like:

  1. onActionsChanged: {
  2.  
  3. foreach (action, actions) {
  4.  
  5. //add a tool button for each action
  6.  
  7. }

How to implement this? Thanks!

7 replies

July 30, 2010

mario mario
Lab Rat
209 posts

Hi,

I’m not sure if I understand your first question but I think what you mean is something like QStackedWidget or similar for QML, correct?

Take a look at the example that is included in the source package: qt-dir/examples/declarative/tabwidget

Basically you just manipulate the visible property.

Another way of doing this is to use a ListView combined with VisualItemModel, see http://doc.qt.nokia.com/4.7-snapshot/qml-visualitemmodel.html. Each item in the listview is a QML item such as Rectangle, Item, etc.

August 2, 2010

mbrasser mbrasser
Lab Rat
452 posts

Hi,

Not all of the types can be used in property declarations from QML — see Adding new properties [doc.qt.nokia.com] for those that can. The webbrowser demo (in demos/declarative/webbrowser) gives an example of using QActions from QML (see Button.qml and Header.qml).

You can declare lists of objects, though this doesn’t seem to be documented. e.g.

  1. property list<Item> items: [Rectangle {}, Image {}]

and then iterate through the items in typical javascript fashion. This approach is rather limited though (I don’t think you can easily manipulate the list or get useful signals out of it, for example), so I’d suggest using a model with a Repeater or ListView to display the items.

Regards,
Michael

August 2, 2010

gault gault
Lab Rat
3 posts

Mario, thanks for your suggestion. Tabwidget is really a good widget which I would like to use in places, e.g. in application settings, there would be many different kinds of settings, then I could separate them well grouped. In multi-view based applications, I prefer the way like VisualItemModel, this kind of applications always have a controller which control the display of current page. The page usually has options like “next”, “back” and “exit”, something like that. However, there is a problem when I use this item. E.g. if I change the view from index 0 to index 10 by setting the index of list view, it’s really a long time to update. It will roll for a long time.

Currently, I use a mechanism like this.

  1. Item {
  2.  
  3. id: controller
  4.  
  5. property Item currentView
  6.  
  7. xxxView { ... //some button clicked, change controller's state}
  8.  
  9. xxxView { ... }
  10.  
  11. ...
  12.  
  13. states: [
  14.                 State {
  15.  
  16.                     name: "state"
  17.                     PropertyChanges { target: xxxView; x: 0 }
  18.                     PropertyChanges { target: controller.currentView; x: -(parent.width * 1.5) }
  19.                     PropertyChanges { target: controller; currentView: xxxView }
  20.  
  21.                 }
  22.  
  23. ..............
  24.  
  25. }
  26.  
  27. }

August 2, 2010

gault gault
Lab Rat
3 posts

mbrasser, thanks for your reply. I also noticed the webbrowser example. I found that action is not supported by defining as a property, although it is really a basic type in qml. QAction must be defined by C++ and then could be used in QML.

I am studying repeater now…

August 2, 2010

mario mario
Lab Rat
209 posts

@gault: If you don’t need the rolling-animation you can try setting the highlightMoveSpeed property to a high value, see http://doc.qt.nokia.com/4.7-snapshot/demos-declarative-rssnews-rssnews-qml.html were they set the property to 9999999

August 3, 2010

mbrasser mbrasser
Lab Rat
452 posts

mario wrote:
@gault: If you don't need the rolling-animation you can try setting the highlightMoveSpeed property to a high value, see http://doc.qt.nokia.com/4.7-snapshot/demos-declarative-rssnews-rssnews-qml.html were they set the property to 9999999


Another alternative, if you want to keep the animation, is to set highlightMoveSpeed to -1, and highlightMoveDuration to e.g. 300. This will use a constant duration for all transitions (which means small movements will look slower, and large movements will look faster).

August 3, 2010

gault gault
Lab Rat
3 posts

That’s great! Thanks for both.

 
  ‹‹ Using XMLHttpRequest in QML when behind a proxy      Unable to load gif file in QImage ››

You must log in to post a reply. Not a member yet? Register here!