Cascades Development

[pseudonym27]

Hello,

can anyone please provide a sample to a application or documentation

on how to create a simple ListView using C++?
and with custom data? (e.g., I don't need to load data to it using QML or JSON,

just string texts).

Many thanks in advance.

[javayoung]

You can refer with the links as below

http://developer.blackberry.com/cascades/documentation/ui/lists/groupdatamodel.html

http://developer.blackberry.com/cascades/reference/bb__cascades__groupdatamodel.html

But I suggest the best way is to review the sample source codes like rssnews, tldr, bucketlist and etc.

[pseudonym27]

can you please provide links to those sample sources? thanks.

btw. and is it possible to customize a list view created in c++ e.g., change text color, background color etc.?

Thanks.

[javayoung]

https://github.com/blackberry/Cascades-Samples

I think that everything can be done or even more in c++ if it can be done in QML. :0)

[pseudonym27]

Hi, the rssnews does not contain any C++ code ( I just want a simple sample which shows how to create a simple ListView in C++ (or maybe in QML I don't know which is better). The items of the ListView are just strings; maybe with sections. And I also want to customize the user interface of ListView items, e.g., set text color, ListView background color etc. Any help or some simple tutorial would be greatly appreciated!

[BBSJdev]

What you've described quickly becomes cumbersome with hardcoding. I recommend creating an XML file then linking it with the ListView.  This way you can quickly add the parts you need to change QML componant properties such as color, sections etc. in the XML file and interpret it in the QML.

It really is simple to do and you'll be thankful you did it the XML way later on.

Examples on how to build it up with code examples are given here...

http://developer.blackberry.com/cascades/documentation/ui/lists/list_view.html

[pseudonym27]

Hi, thanks again for your help.

Let me mention one more thing. I think I found solution, how to do it using C++.

The idea is to use a similar approach used in the cookbook sample which is implemented in C++.

http://developer.blackberry.com/cascades/sampleapps/

The C++ cookbook ListView is also customized, e.g., it can show images, text and I think

also background image. They achieve cutomization through use of ListItemProvider (http://developer.blackberry.com/cascades/reference/bb__cascades__listitemprovider.html) class and

another class which implements ListItemListener. However, their data model or the list does

not use headers. If you, or someone else could help me figure out how to extend

the ListView example in C++ cookbook with adding headers I would be very grateful.

[BBSJdev]

If by headers you mean partitioning off listitem under seperate sections then you are better off using a GroupDataModel.

But somehow I think you are meaning something different as the code example for doing this is in the link I gave you and the examples shown show grouped items?

Everything you've described so far can easily be accomplised in QML and since QML componants come from C++ classes it can be easily achieved in either.

Most customisation can be done without the use of ListItemProvider, I think you are over complicating what you are trying to do.  I use ListItemProvider but only because I have a complicated filter system on the data and an element that always must remain at the top of the list and I daresay if I'd wanted to I probably could have done it in QML without the Provider anyway.

Please mess around a little with ListView in QML it won't take you long and I think you'll find the cosmetic changes you are asking for do not need ListItemProvider.

Thanks are appreciated but if I or anyone else is helping you out then please click on the 'like - thumbs up' icon next to the post.

[BBSJdev]

I will share some of my code with you just to show you how customisable a ListItem can be, this little snippet of QML places two text items (Labels in this case) in the same item alternates the background colour and changes the font styles without any ListItemProvider being in place...

ListItemComponent {

    id: textItem
    
    type: "textItem"

    Container {
        layout: StackLayout {
            orientation: LayoutOrientation.LeftToRight
        }

        background: (ListItem.indexInSection % 2) ? Color.LightGray : Color.Transparent

        Label {
            layoutProperties: StackLayoutProperties { spaceQuota: 0.2 }
            multiline: true
            textStyle { base: tsdTitle.style }
	        text: ListItemData.title
        }

	    Label {
            layoutProperties: StackLayoutProperties { spaceQuota: 0.8 }
            multiline: true
            textStyle { base: tsdValue.style }
	        text: ListItemData.value
        }
	    
        attachedObjects: [
    	   TextStyleDefinition {
    	       id: tsdTitle
    	       base: SystemDefaults.TextStyles.SmallText
    	       fontStyle: FontStyle.Normal
    	       textAlign: TextAlign.Right
    	   },
    	   TextStyleDefinition {
       	       id: tsdValue
       	       base: SystemDefaults.TextStyles.TitleText
       	   }
        ]
	}
}

[pseudonym27]

Hi, thanks again for your help.

By headers I mean string arrangements like this:

 - Green
        - Cucumber
        - Peas
        - Salad
 - Red
        - Tomato
        - Red Radish
        - Carrot

 But again as you mention after encountering this link: http://developer.blackberry.com/cascades/documentation/ui/lists/list_view.html and the samples about how it is using ListItemComponent - now I am in a dilemma whether to implement my list in C++ or QML. Later seems easier? I was thinking in favor of C++ because on item clicks I might needed to push pages on NavigationPane which might have been implemented on the C++ side; but I guess I cann access it from QML too right? So, again now I am thinking to use C++ or QML for creating the listview but as you mentioned the QML list view seems to be highly customizable. I will get back to it a bit later and also 'like' other your posts which were helpful. You, please feel free to provide some additional feedback for example on what I mentioned here. Thank you once again.