Scroll view

Javeria

@ApplicationWindow {
id : hola
title: ("SketchIt")
width: 640
height: 480
minimumWidth: mainToolBar .implicitWidth
visible: true

Image{
    visible:true
 source:"C:\\1.jpg"
 sourceSize.width:hola.width/2
 sourceSize.height:hola.height/2
}
toolBar: ToolBar{
    id : mainToolBar
    anchors.fill :parent
    RowLayout{
     //   width : parent.width

        ToolButton{
       // text : ("main")
        iconSource: "C:\\Users\\Hassan Adil\\Documents\\sketchIt\\16.png"
        onClicked: hola.color = "blue"
        anchors.margins: 4

}

    Button{

        text : "close"
        onClicked: hola.close()

}
}
}
SplitView{
anchors.fill: parent
orientation: Qt.Horizontal
}

}@

Javeria

The C directory path is correct, but no view

p3c0

What do you mean by no view in this example?

Javeria

View meaning that the image is not visible

p3c0

Ok. Try prepending file:// to source. And you can use "/" as file separator. Qt internally handles it depending upon OS.
@
iconSource: "file://C:/Users/Hassan Adil/Documents/sketchIt/16.png"
@

Javeria

If i write file:/1.jpg which is located in C: it works and the view also works , but is it possible to put space between the images ?

p3c0

Ok. By space, do you mean another path ?

Javeria

No i mean i want to have some distance between the images, to make it look good, can i use borders or something else?

p3c0

Inside the RowLayout you can set spacing.

Javeria

Okay thanks a lot!, and also how can i shift the listview close to the bottom of the window

p3c0

anchor it to the bottom.

Javeria

I have tried to anchor it to the parent but the list view doesn't appear on the screen

p3c0

and who is parent of ListView ?

Javeria

I think the application window is the default parent, I haven't specified

p3c0

How did you anchor it ? Can you post some code ?

Javeria

@import QtQuick 2.4
import QtQuick.Controls 1.3
import QtQuick.Window 2.2
import QtQuick.Dialogs 1.2
ApplicationWindow {
//id:root
title: qsTr("Hello World")
width: 1500
height: 1000
property var imagesListModel: ["file:/original.jpg","file:/11.jpg","file:/test (1).jpg","file:/test (2).jpg","file:/test (3).jpg","file:/test (4).jpg","file:/test (5).jpg"]
Image{
id:main
width: 450
height: 600
source:"file:/test (6).jpg"
anchors.centerIn: parent
}
ListView {
id: imagesList
anchors.fill: parent
spacing:25
orientation: Qt.Vertictal
model: imagesListModel
delegate: Image {
width: 75
height: 100
source: imagesListModel[index]

         MouseArea {
             anchors.fill: parent

             onClicked: {

// main.
console.log("User select '"+imagesListModel[index]+"' image");
}
}
}
}

}
@

Javeria

And the image with id should change when the user select the image from the list , how can i do that as well?

p3c0

You should anchor ListView to bottom of root I.e ApplicationWindow. Do this in ListView
@
anchors.bottom : root.bottom
@

To set Image just assign the string that you get in onClicked to source of main

Javeria

It still doesnt work , how to put in corner

p3c0

anchor it to left or right as required.