maui icon indicating copy to clipboard operation
maui copied to clipboard

Images are not rendering in both iOS and Android

Open sam33r786 opened this issue 2 years ago • 6 comments

Description

I am attempting to use a CarouselView to show an Array of images using URLs stored alongside an entity but the doesn't show anything than an empty white square in both Android and iOS.

I have also added a standalone Image element with a hard-coded source to check if the issue was with my code or the framework but the issue remains.

            <CarouselView ItemsSource="{Binding CurrentRecord.ImageUrls}" IndicatorView="indicatorView" HeightRequest="300">
                <CarouselView.ItemTemplate>
                    <DataTemplate>
                        <Frame HasShadow="True"
                           BorderColor="DarkGray"
                           CornerRadius="5"
                           Margin="20"
                           HeightRequest="300"
                           HorizontalOptions="Center"
                           VerticalOptions="Center">
                            <Image Source="{Binding .}" 
                               Aspect="AspectFill"
                               HeightRequest="150"
                               WidthRequest="150"
                               VerticalOptions="Center"
                               HorizontalOptions="Center" />

                        </Frame>

                    </DataTemplate>

                </CarouselView.ItemTemplate>

            </CarouselView>
            <IndicatorView x:Name="indicatorView"
                   IndicatorsShape="Square"
                   IndicatorColor="LightGray"
                   SelectedIndicatorColor="DarkGray"
                   HorizontalOptions="Center"
                   Margin="0,0,0,40" />

            <!-- Standalong hard-coded image element-->
            <Image Source="https://en.wikipedia.org/wiki/Visual_Studio#/media/File:Visual_Studio_2013_EN.png" HeightRequest="200" WidthRequest="200" MinimumHeightRequest="200" MinimumWidthRequest="200" />

Steps to Reproduce

  1. Create an Image element in XAML and either hard-code its source or attempt to bind source to view model.

Link to public reproduction project repository

N/A

Version with bug

7.0 (current)

Last version that worked well

Unknown/Other

Affected platforms

iOS, Android

Affected platform versions

iOS 16.2, Android 12

Did you find any workaround?

No response

Relevant log output

No response

sam33r786 avatar Dec 17 '22 00:12 sam33r786

I have the same problem, only on the emulator everything works, but when you run it on the device - a blank square.

7702244 avatar Dec 18 '22 16:12 7702244

After several days of searching for solutions and experiments, I managed to find a solution to the problem. Add a datatype for the <DataTemplate> tag:

<CarouselView.ItemTemplate>
    <DataTemplate x:DataType="sys:String">
        <Image Source="{Binding .}"  />
     </DataTemplate>
</CarouselView.ItemTemplate>

and namespace: xmlns:sys="clr-namespace:System;assembly=mscorlib".

Maybe an analyzer should be added, so that the Visual Studio warnings about this situation?

7702244 avatar Dec 18 '22 17:12 7702244

After several days of searching for solutions and experiments, I managed to find a solution to the problem. Add a datatype for the <DataTemplate> tag:


<CarouselView.ItemTemplate>

    <DataTemplate x:DataType="sys:String">

        <Image Source="{Binding .}"  />

     </DataTemplate>

</CarouselView.ItemTemplate>

and namespace: xmlns:sys="clr-namespace:System;assembly=mscorlib".

Maybe an analyzer should be added, so that the Visual Studio warnings about this situation?

Thanks for the workaround. I'll try and give that a go.

sam33r786 avatar Dec 18 '22 17:12 sam33r786

@7702244 I've tried your workaround and it doesn't seem to working for me for some reason.

sam33r786 avatar Dec 19 '22 12:12 sam33r786

Hi @sam33r786. We have added the "s/needs-repro" label to this issue, which indicates that we require steps and sample code to reproduce the issue before we can take further action. Please try to create a minimal sample project/solution or code samples which reproduce the issue, ideally as a GitHub repo that we can clone. See more details about creating repros here: https://github.com/dotnet/maui/blob/main/.github/repro.md

This issue will be closed automatically in 7 days if we do not hear back from you by then - please feel free to re-open it if you come back to this issue after that time.

ghost avatar Dec 19 '22 15:12 ghost

This issue has been automatically marked as stale because it has been marked as requiring author feedback to reproduce the issue but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.

ghost avatar Dec 23 '22 16:12 ghost