Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Contributor
micksen
Posts: 17
Registered: ‎07-31-2013
My Device: Q10
My Carrier: T-Mobile

Change imagesource in ListView

Hi,

i have the following problem with updating the imagesource in a listview. 

i want to change the imageSource of imageMessage from c++. i created a property alias but i always get a error message saying: --- errors:  (asset:///ContentPage.qml:29:36: Invalid alias reference. Unable to find id "imageMessage") 

 

can somebody tell me how to get access from c++ to change the imageSource?

import bb.cascades 1.0
import bb.cascades.pickers 1.0


// Content Page

Page {
    id: content
    objectName: "contentPage"
    // Main Container
    property alias pictureMessage: imageMessage.imageSource
    
    Container {
        background: Color.White
        layout: StackLayout {

        }

        Container {
            id: chatroom
            minHeight: 80
            layout: DockLayout {

            }
            Label {
                id: mainLabel
                text: "Chat"
            }


            Container {
                minHeight: 1
                background: Color.Black
                horizontalAlignment: HorizontalAlignment.Fill
                verticalAlignment: VerticalAlignment.Bottom
            }

        }


        ListView {
            id: lv_messages

            objectName: "lv_messages"
            layout: StackListLayout {

            }
            listItemComponents: [

                ListItemComponent {
                    type: "header"

                    Header {
                        visible: false

                    }
                },
                ListItemComponent {
                    id: item
                    type: "item"
                    Container {
                        id: rootContainer
                        background: Color.White


                        Header {
                            title: "Message"
                        }

                        Container {
                            leftPadding: 10
                            rightPadding: 10
                            minHeight: 50
                            maxWidth: 750
                            horizontalAlignment: HorizontalAlignment.Center
                            visible: ListItemData.type == "event" ? true : false
                            layout: DockLayout {

                            }

                            Label {
                                text: ListItemData.content
                                textStyle.color: Color.White
                                horizontalAlignment: HorizontalAlignment.Left
                            }

                        }

                        Container {
                            id: imageContainer
                            visible: ListItemData.type == "image" ? true : false
                            leftPadding: 50
                            topPadding: 10
                            bottomPadding: 10
                            ImageView {
                                id: imageMessage
                                objectName: ListItemData.content.toString()
                                scalingMethod: ScalingMethod.AspectFill
                               imageSource: "asset:///loading.png"
                                maxHeight: 200
                                maxWidth: 200

                            }
                        }
                        TextArea {
                            id: message
                            leftPadding: 50
                            maxWidth: 650
                            maximumLength: 99999
                            editable: false
                            focusHighlightEnabled: false
                            text: ListItemData.content
                            inputMode: TextAreaInputMode.Chat
                            visible: ListItemData.type == "text" ? true : false
                        }

                    }

                }

            ]

        } //ListView
    } // top Container

}// Page

 

Please use plain text.
Developer
BBSJdev
Posts: 5,961
Registered: ‎07-05-2012
My Device: Playbook, Z10 LE, Dev Alpha C
My Carrier: Orange

Re: Change imagesource in ListView

You would not be able to do it this way as the ListItems are not in scope for the ListView at the point you are thinking it is.

 

You could swap it around so that your image is accessed from the ListItem as the ListItem is created.

 

Search this forum for access + ListItem in this forum and you'll get many answers on how to do that.

 


If you've been helped click on Like Button, if you've been saved buy the app. :smileyhappy:

Developer of stokLocker, Sympatico and Super Sentences.
Please use plain text.
Contributor
micksen
Posts: 17
Registered: ‎07-31-2013
My Device: Q10
My Carrier: T-Mobile

Re: Change imagesource in ListView

And can you tell me if there is a way in qml to check if a file already exists.

 

because then i would be able to do it like this: 

 

imageSource: filesystem+file.exists() ? filesystem+file : defaultImage

Please use plain text.
Contributor
micksen
Posts: 17
Registered: ‎07-31-2013
My Device: Q10
My Carrier: T-Mobile

Re: Change imagesource in ListView

[ Edited ]

My problem is that the list contains pictures which get downloaded from the internet. 

 

And now i want that the list to show a default image while the other picture is downloading from the internet and as soon as the picture is ready the default image should be replaced.

Please use plain text.
Developer
BBSJdev
Posts: 5,961
Registered: ‎07-05-2012
My Device: Playbook, Z10 LE, Dev Alpha C
My Carrier: Orange

Re: Change imagesource in ListView

[ Edited ]

Okay that's not the right way to go about it, asynchrnous is, I suggest you take a look at this example and do it in a similar fashion...

 

http://blackberry.github.io/Cascades-Samples/imageloader.html

 


If you've been helped click on Like Button, if you've been saved buy the app. :smileyhappy:

Developer of stokLocker, Sympatico and Super Sentences.
Please use plain text.