alexrainman / CarouselView

CarouselView control for Xamarin Forms
MIT License
436 stars 178 forks source link

Dynamically-bound image in CarouselView lost Aspect.Fit after image change #561

Closed j2bmw closed 4 years ago

j2bmw commented 4 years ago

I am working on a cross-platform project using Xamarin forms. I am using carouselview to display an image button. See the code snippets below. The customImageButtonStyle sets to Aspect.Aspect.Fit. Initially it works as intended. However, after the image is changed, the image is still displayed, but smaller, ie. no longer does Aspect.Fit. If I place the same code outside the carouselview, it works without such a issue.

                            </Grid>
                        </x:Array>
                    </controls:CarouselViewControl.ItemsSource>
                </controls:CarouselViewControl>
j2bmw commented 4 years ago

Xamarin forms - Dynamically-bound image in CarouselView lost Aspect.Fit after image change on Android.txt

j2bmw commented 4 years ago
            <StackLayout Grid.Row="0" Grid.Column="1" Orientation="Vertical" HorizontalOptions="CenterAndExpand">
                <Grid x:Name="relayGrid" HorizontalOptions="CenterAndExpand">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="4.0*" />
                        <RowDefinition Height="1*" />
                    </Grid.RowDefinitions>
                    <ImageButton x:Name="relayButton" Source="{Binding RelayIcon}" Grid.Row="0" Grid.Column="0" 
                                             Style="{StaticResource customImageButtonStyle}"
                                             Command="{Binding NavigateCommand}" CommandParameter="{x:Type views:RelayPage}" />
                    <Label Text="RELAYS" Grid.Row="1" Grid.Column="0" Style="{StaticResource deviceHomeBottomTextStyle}" />
                </Grid>
                <StackLayout.GestureRecognizers>
                    <TapGestureRecognizer Command="{Binding NavigateCommand}" CommandParameter="{x:Type views:RelayPage}" />
                </StackLayout.GestureRecognizers>
            </StackLayout>
        </Grid>
    </x:Array>
</controls:CarouselViewControl.ItemsSource>
j2bmw commented 4 years ago

Relay icon aspect fit issue

j2bmw commented 4 years ago

The original images: TecomPlus_walktest_selected TecomPlus_walktest_grey

j2bmw commented 4 years ago

The code:

            public static string RelayDarkIcon = "TecomPlus_walktest_selected.png";
            public static string RelayDisabledIcon = "TecomPlus_walktest_grey.png";

        public string RelayIcon
        {
            get
            {
                return _relayIcon;
            }
            set => SetProperty(ref _relayIcon, value);
        }

        private string _relayIcon;

            MessagingCenter.Subscribe<BaseViewModel>(this, "CheckPermissions", (sender) =>
            {
...
                    RelayIcon = IsInstallerLoggedIn
                        ? FilenameRepository.Image.RelayDarkIcon
                        : FilenameRepository.Image.RelayDisabledIcon;
...
                }
            });
j2bmw commented 4 years ago

It seems this is a Xamarin forms issue. I've tried to replace the image button with an image, the problem goes away. It seems sometimes AspectFit doesn't work for ImageButton when the bound image changes from a view model.