Cascades Development

[Brennan12325]

Say I have a a scrollview that i know the height and width of (the entire screen height and width for example, 768x1280).

I want to "aspect fit" the image so that it takes up the entire width of the screen, so if the image is 800x600 it would scale to 768x580 (guessing on the scaling of the height, haven't calculated exactly what it would scale too).

Now my image is 580 tall (after scaling), so I have 700 leftover pixels. I want my image then to have 350 pixels above it and 350 pixels below it.

How can I make a scrollview / imageview combination behave in this way? The image is being dynamically loaded and we are setting the imageSource of the ImageView in a SLOT.

I've tried scrolling my scrollview after doing some math on the fly, but the ScalingMethod AspectFit on the scrollview appears to be completely overriding everything and aligning the top of the image with the top of the scrollview.

[oliver_kranz]

Put a container into the ScrollView and set the container to the screen height. Put the ImageView in this container and center it vertically.

ScrollView {
    verticalAlignment: VerticalAlignment.Fill
    horizontalAlignment: HorizontalAlignment.Fill
    Container {
        horizontalAlignment: HorizontalAlignment.Fill
        verticalAlignment: VerticalAlignment.Top
        minHeight: 1280
        ImageView {
            horizontalAlignment: HorizontalAlignment.Fill
            verticalAlignment: VerticalAlignment.Center
        }
    }
}

[Brennan12325]

The image needs to be scrollable and support pinch to zoom. Do you know if thats also possible with this solution? I dont have a device to test the pinch to zoom gesture with, yet. It seems that the whole container should be zoomable, so I'd suspect this solution should work.