Trouble with GridView

Circuits

I have a rather simple GridView who's model is a list of url's for images. The delegate is Image and I am not specifying anything about the image other than it's source and id:

Component
{
  id: theComponent
  Item
  {
    id: theItem
    GridView
    {
      id: theGridView
      model: modelData.optionsListImages
      anchors.fill: parent
      anchors.margins: 10
      delegate: Image
      {
        id: theImage
        source: modelData
      }
    }
  }
}

the problem I am having is that these images overlap one another. That is, until I start messing around with the cellWidth property... until I specify that the property should be the width of the image, but I can't specify that width like this:

cellWidth: theImage.width

Instead I have to specify the actual images size, like so:

cellWidth: 250

I was under the impression that it would automatically set the cellWidth and cellHeight property's to be the size of whatever is inside the delegate? That's what the examples here seem to suggjest. I would rather have the cell width/height grow/shrink depending on the size of the image. Perhaps I cant? Perhaps I actually need to MAKE SURE my images are all EXACTLY the same size and specify it directly?

Circuits

Apparently I was wrong: "The item size of the GridView is determined by cellHeight and cellWidth. It will not resize the items based on the size of the root item in the delegate." So I suppose you do have to explicitly set your cellWidth and cellHeight to be that of the root item in the delegate.