Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

ScrollView and image

IMikkeIIMikkeI Member ✭✭

Hello, I'm working with Xamarin.Forms 4.7. I'm trying to display a large image (large width and tight height) and I would like to be able to scroll it horizontally with a custom height.

I have the basic following code :

What I have now is an image that fill the parent horizontally (I think this is due to AspectFit option by default). The height request seems to do nothing. I have tried to use AspectFill, it resized my image to fit vertically with the scollView, but I can't scroll anymore.

Does anyone have a solution to do this ?

Thanks for any help.

Mike.

Best Answer

Answers

  • LeonLuLeonLu Member, Xamarin Team Xamurai

    Do you want to achieve the result like following GIF?

    Just add the following code.

     <ScrollView Orientation="Horizontal">
    
                <Image
    
                    HorizontalOptions="Center"
                    VerticalOptions="Center"
                    Aspect="AspectFill"
                    Source="scr.jpg" />
            </ScrollView>
    
  • IMikkeIIMikkeI Member ✭✭

    Yes the gif represents what I want.
    I've tried your code, in portrait I can scroll horizontally (the height of my image stays tight), but in landscape mode, the image fit horizontally the screen.
    I forgot to say that my image is quite special with a resolution of 50000x2048 pixels. So I need to increase display height to see something.

    That's why I'm wondering how to be able to set the height.

  • LeonLuLeonLu Member, Xamarin Team Xamurai
    edited August 5

    Can you share your test image?In landscape mode, it could scroll as well

  • IMikkeIIMikkeI Member ✭✭

    Sorry I can't share this picture.

    I've tried with this smaller one found on the web. The result keeps the same (test realized on emulator and smartphone).

  • IMikkeIIMikkeI Member ✭✭
    edited August 5

    It's ok now, found the problem. Your code was running properly, thank you. The image I use is too big to get loaded correctly by the application (Java.Lang.RuntimeException: 'Canvas: trying to draw too large(409616384bytes) bitmap.')

    I use glidex.forms library that is able to load my image. But this library appears to customize the image renderer. That's why my image behavior was different and doesn't render properly on the scrollView.

    Now I have to found a solution to load giant images without this library or redefine glidex renderer... :/

    Thanks for your help and your patience

Sign In or Register to comment.