如何使图像显示在我的 Xamarin.Forms 应用程序的 UWP 版本中

Question

I have a simple Xaml like this:

...
    <ContentPage.Content>
        <Grid Padding="0,40,0,0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
            </Grid.RowDefinitions>

            <Image  Grid.Row ="0" Source="iMobile"
                        HorizontalOptions="CenterAndExpand"
                        WidthRequest="260" HeightRequest="129"/>
        </Grid>
    </ContentPage.Content>

The image iMobile shows up on Android and ios . For Android I have the different sizes for the image in the separate drawable folders. For ios , I have the different sizes of the image in the Assets catalog.

I have tried to do same for UWP but nothing seems to work. Here are some of the things I have tried doing:

• I have added the image to the root directory for the UWP project but that doesn't work.

• I added the image to the Assets directory but that did not work.

• I tried adding .scale-100 , .scale-200 and .scale-400 to the name of the image file (tried them all separately) but that did not work.

• I also tried putting the image in a directory named scale-100 but that did not work either.

Any ideas what might be causing my issue and how I can fix this? It is super frustrating that something this trivial is taking so much of my time.

Update: I tried using a URL as the source instead of iMobile and this does not work for UWP either but it does work for Android, and idea why this might be?

Answer 1

How do I make images show up in UWP version of my Xamarin.Forms application

Please refer Images in Xamarin.Forms official document. Xamarin form support Native resolutions .

UWP image file names can be suffixed with .scale-xxx before the file extension, where xxx is the percentage of scaling applied to the asset, eg myimage.scale-200.png. Images can then be referred to in code or XAML without the scale modifier, eg just myimage.png. The platform will select the nearest appropriate asset scale based on the display's current DPI.

If you placed image file in the UWP Assets folder, you could use the following xaml, And please note the default blank xamarin app iamge file' color is white, we need set black background to highlight them.

<Grid BackgroundColor="Black">
    <Image>
        <Image.Source>
            <OnPlatform x:TypeArguments="FileImageSource">
                <On Platform="UWP" Value="Assets/LargeTile.png" />
                <On Platform="iOS" Value="LargeTile.png" />
                <On Platform="Android" Value="LargeTile.png" />
            </OnPlatform>
        </Image.Source>
    </Image>
</Grid>