Native Development

[A7omic]

Hi,  I would like to have a horizontal list but cannot figure out how using the cascades libraries.  I can see how it is done using the regular QT libraries, there is an orientation property but this does not exist in the Cascades ListView.

Does anyone know of a way to do this using Cascades?

[RileyGB]

I'm pretty sure that a StackLayout can be modified to be horizontal. I'm not 100% on that, but I seem to recall that from one of the Jam sessions.

[peter9477]

Looks like you should be able to set the layout to a StackListLayout created with its layoutDirection set to LayoutDirection::LeftToRight.

I'd guess at a code sample, but I'm just getting to grips with translating what I see in the docs into QML syntax, and anyway you didn't say whether you're doing QML or C++.

[A7omic]

StackLayout is a QML property of Container , so you can easily arrange items like text boxes or images horizontally in a Container using:

layout: StackLayout {
    layoutDirection: StackLayout.LeftToRight
} 

But it does not work in a ListView because ListView does not have this property.

[peter9477]

I think it must have that property in some fashion, as it has (in C++) a constructor that allows specifying it: explicit ListView(ListLayout *layout, Container *parent = 0);

I've been trying to decipher how that might be used from QML, but maybe you are just looking for C++ and that's adequate for you?

[A7omic]

At the moment I am looking for the QML implementation.

I see the ListLayout class but the documentation doesn't give any details, it looks like it is incomplete.

[peter9477]

Maybe try setting it with the code you showed above? I don't see a "setLayout" accessor or anything like that, but I could easily be ignorant about how this would actually get passed through, and maybe it works. I'd also think the IDE should have some syntax completion support that would recognize/show the supported property name, if it's there. Doesn't it?

[A7omic]

Using that code above in the ListView results in the following error:

Cannot assign to non-existent property "layout"

As I said the layout property does not exist for ListView.

Seems pretty silly to me that this is not possible, if it is not I hope this is due to this being a beta. Even so it seems like this should be pretty standard.

[A7omic · Accepted solution]

Ok it can be done in C++:

Using the CookBook example program I  declared a new StackListLayout variable in ListView *CascadesCookbookApp::createRecipeListView() and passed it into ListView:

StackListLayout *sll = new StackListLayout(LayoutDirection::LeftToRight);

ListView *recipeListView = new ListView(sll);

I would still prefer having a solution within QML but at least I know it can be done. 

[gbeukeboom]

The way of doing this in QML is coming but is currently not supported. For now you could handle most UI in QML and just set the layout using C++ if needed to help keep things clean until the QML functionality is there.