FFImageLoading icon indicating copy to clipboard operation
FFImageLoading copied to clipboard

Loading gifs freezing

Open LeoJHarris opened this issue 5 years ago • 22 comments

The loading Gif animations are sometimes freezing, requires user to scroll away and back again for them to reload properly.

  • Version with issue: 2.4.11.982
  • Platform: Android, untested on iOS.

ezgif com-video-to-gif (2)

LeoJHarris avatar May 27 '19 00:05 LeoJHarris

Could you make a repo?

daniel-luberda avatar May 27 '19 15:05 daniel-luberda

SampleTest (2).zip

See attached.

For reference the code block in TaskWithSubTasksViewCell.xaml.cs handles the CachedImage on line 240

ContentView image = new ContentView
                    {
                        HorizontalOptions = LayoutOptions.Center,
                        Margin = new Thickness(0, 10, 10, 10),
                        Content = new CachedImage
                        {
                            HorizontalOptions = LayoutOptions.Center,
                            Source = subTask.ImageURL,
                            RetryCount = 3,
                            RetryDelay = TimeSpan.FromSeconds(2).Milliseconds,
                            ErrorPlaceholder = Application.Current.Resources["BrokenImageIcon"].ToString(),
                            LoadingPlaceholder = Application.Current.Resources["LoadingGif"].ToString(),
                            HeightRequest = 180,
                            WidthRequest = 180,
                            VerticalOptions = LayoutOptions.Center,
                            Transformations =
                            {
                                new CircleTransformation()
                                {
                                    BorderHexColor = Color.White.GetHexString(),
                                    BorderSize = 2
                                }
                            }
                        }
                    };

LeoJHarris avatar May 27 '19 21:05 LeoJHarris

I have a simarlar issue, I think? When Gifs are displayed on android, it does not transition back to the image after loading. It works fine in iOS. It works correct up to version 2.4.7.944, after that it does not work, from my tests I did, if it helps.

I am using the image as a button, when I touch the image todo an action the loading gif disappears and the correct image is shown.

isimobile avatar May 28 '19 06:05 isimobile

@LeoJHarris You sample has way to many dependencies. Tried to add it to FFImageLoading's solution and:

Screenshot 2019-05-28 at 18 53 17

Please provide a minimal repo, then I would be able to debug it.

daniel-luberda avatar May 28 '19 16:05 daniel-luberda

@daniel-luberda okay will do that today and create new sample project

LeoJHarris avatar May 28 '19 18:05 LeoJHarris

SampleTest.zip

Can you try this, have removed those dependencies and removed some other code

LeoJHarris avatar May 28 '19 21:05 LeoJHarris

We observe the same behavior on android, FFImageLoading version: 2.4.11.982 The loading gif animation freezes and is not replaced by the actual image.

viktorgt avatar May 29 '19 08:05 viktorgt

@LeoJHarris Unluckily, I couldn't add your projects to the FFImageLoading repo (errors). Can you clone this repo and add those projects here? (I need to reference FFImageloading projects instead nuget dependencies to debug it)

Error CS1703: Multiple assemblies with equivalent identity have been imported: '/Library/Frameworks/Mono.framework/External/xbuild-frameworks/MonoAndroid/v1.0/mscorlib.dll

daniel-luberda avatar May 30 '19 09:05 daniel-luberda

@daniel-luberda sorry I had some little issues with the cloned repo, I was struggling to build the project

LeoJHarris avatar Jun 08 '19 07:06 LeoJHarris

I think that my issue is related. https://github.com/luberda-molinet/FFImageLoading/issues/1263 i can reproduce it easily using sfListview horizontally. It works fine on version 2.4.6.92

EmilAlipiev avatar Jun 22 '19 17:06 EmilAlipiev

@daniel-luberda & @LeoJHarris Same here, for example I have this menu and some of them (images - gifs) transition and some others wont.

*Color circles are the Spinners.gif

Spinners Stuck

Juandi-M avatar Jul 07 '19 07:07 Juandi-M

I have similar issue

jrahma avatar Aug 01 '19 23:08 jrahma

I have same issue.

nimashshz avatar Aug 26 '19 10:08 nimashshz

I have same issue.

Ekct00 avatar Sep 07 '19 07:09 Ekct00

And i have same issue.

kochev avatar Feb 21 '20 02:02 kochev

yes, and I have same issue

devperson avatar Mar 28 '20 22:03 devperson

I've got the same issue

ericc0504 avatar Jun 18 '20 11:06 ericc0504

Same issue

Reddyo avatar Aug 11 '20 22:08 Reddyo

the same issue, any solution ??

angelru avatar Aug 28 '20 17:08 angelru

Same issue here

WorldOfBasti avatar Nov 02 '20 21:11 WorldOfBasti

@daniel-luberda Since the more info needed label is still there, I will describe my current experience: If you set an animated gif as loading placeholder, the gif stops and the image won't be displayed..

This bug occurs only (for my Tests):

  • On Android
  • If you're loading more than one image (some images are loading, some not)

I also created a sample which you can find here: TestApp - FFImageLoading_1283.zip

And the code snippet (which is in the sample) is here:

<ContentPage.Content>

    <Grid ColumnDefinitions="*, *" RowDefinitions="*, *, *, *">
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="0" Grid.Row="0"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="0" Grid.Row="1"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="0" Grid.Row="2"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="0" Grid.Row="3"/>

        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="1" Grid.Row="0"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="1" Grid.Row="1"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="1" Grid.Row="2"/>
        <ffimageloading:CachedImage Aspect="AspectFill" HeightRequest="500" WidthRequest="500" DownsampleToViewSize="True" LoadingDelay="750" Source="image.jpg" LoadingPlaceholder="loading.gif" Grid.Column="1" Grid.Row="3"/>
    </Grid>

</ContentPage.Content>

WorldOfBasti avatar Dec 03 '20 17:12 WorldOfBasti

You can try adding an ActivityIndicator while checking if the image has finished loading using DataTrigger and Binding For example:

                                         <StackLayout Margin="8,0">
                                                    <ActivityIndicator Color="Red">
                                                        <ActivityIndicator.Triggers>
                                                            <DataTrigger TargetType="ActivityIndicator" Binding="{Binding Source={x:Reference image}, Path=IsLoading}" Value="True">
                                                                <Setter Property="IsRunning" Value="True"></Setter>
                                                                <Setter Property="IsVisible" Value="True"></Setter>
                                                            </DataTrigger>

                                                            <DataTrigger TargetType="ActivityIndicator" Binding="{Binding Source={x:Reference image}, Path=IsLoading}" Value="False">
                                                                <Setter Property="IsRunning" Value="False"></Setter>
                                                                <Setter Property="IsVisible" Value="False"></Setter>
                                                            </DataTrigger>
                                                        </ActivityIndicator.Triggers>
                                                    </ActivityIndicator>

                                                    
                                                        <forms:CachedImage FadeAnimationForCachedImages="True"  BitmapOptimizations="True" Source="{Binding Path}" DownsampleToViewSize="True" Aspect="Fill" HeightRequest="225" WidthRequest="145" x:Name="image">
                                                        </forms:CachedImage>
                                                </StackLayout>

ramidisha avatar Feb 10 '21 14:02 ramidisha