问题现象 #

• 首次加载首页时，CarouselView及点击手势功能完全正常；
• 点击项跳转到详情页后，通过Shell导航返回按钮回到首页，此时CarouselView项的TapGestureRecognizer不再触发；
• 该问题仅出现在iOS平台，Android平台运行正常；
• 只要水平滚动一下CarouselView（哪怕轻微滚动），点击手势就会立即恢复正常。

相关XAML代码 #

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage Title="HomeView"
             Shell.NavBarIsVisible="False"
             BackgroundColor="{DynamicResource SecondaryColor}">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="200"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

        <Image Source="main_logo.png"
               HeightRequest="50"
               WidthRequest="150" />

        <Grid Grid.Row="1" Margin="10,10,0,0">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <Image Source="user_avatar2.png" />

            <VerticalStackLayout Grid.Column="1" VerticalOptions="Start">
                <Label Text="{Binding FullName}"/>
                <Label Text="{Binding Email}"/>
                <HorizontalStackLayout VerticalOptions="Center">
                    <Image Source="mexico.png"/>
                    <Label Text="{Binding Phone}"/>
                </HorizontalStackLayout>
            </VerticalStackLayout>
        </Grid>

        <Label Grid.Row="2" Text="LABEL" />

        <CarouselView Grid.Row="3"
                      ItemsSource="{Binding Cards}"
                      Loop="False"
                      HeightRequest="200"
                      CurrentItem="{Binding CurrentCard}"
                      x:Name="CarouselView">
            <CarouselView.PeekAreaInsets>
                <OnPlatform x:TypeArguments="Thickness">
                    <On Platform="iOS" Value="60"/>
                    <On Platform="Android" Value="40"/>
                </OnPlatform>
            </CarouselView.PeekAreaInsets>
            <CarouselView.ItemsLayout>
                <LinearItemsLayout Orientation="Horizontal"
                                   SnapPointsType="Mandatory"
                                   SnapPointsAlignment="Center">
                    <LinearItemsLayout.ItemSpacing>
                        <OnPlatform x:TypeArguments="system:Double">
                            <On Platform="iOS" Value="5" />
                            <On Platform="Android" Value="0" />
                        </OnPlatform>
                    </LinearItemsLayout.ItemSpacing>
                </LinearItemsLayout>
            </CarouselView.ItemsLayout>
            <CarouselView.ItemTemplate>
                <DataTemplate x:DataType="data:CardItem">
                    <Border WidthRequest="300"
                            HeightRequest="180"
                            Stroke="Transparent">
                        <Border.StrokeShape>
                            <RoundRectangle CornerRadius="14"/>
                        </Border.StrokeShape>
                        <Border.GestureRecognizers>
                            <TapGestureRecognizer Command="{Binding GoToCardDetailsCommand, Source={RelativeSource AncestorType={x:Type local:HomeViewModel}}}" />
                        </Border.GestureRecognizers>
                        <Grid>
                            <Rectangle StrokeThickness="0"
                                       Margin="0,0,0,0"
                                        
                                       IsVisible="{Binding IsGradientVisible}">
                                <Rectangle.Background>
                                    <LinearGradientBrush>
                                        <GradientStop Color="{StaticResource PrimaryCardGradient}"
                                                      Offset="0.1" />
                                        <GradientStop Color="{StaticResource SecondaryCardGradient}"
                                                      Offset="1.0" />
                                    </LinearGradientBrush>
                                </Rectangle.Background>
                            </Rectangle>
                            <Image Source="{Binding ImageUrl}" 
                                   Aspect="AspectFill"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center" 
                                   Margin="0,0,0,0"
                                   IsVisible="{Binding IsImageVisible}"/>
                            <Grid
                                Margin="46,5"
                                ColumnDefinitions="*, *, *"
                                RowDefinitions="Auto, Auto, *"
                                RowSpacing="23"
                                BackgroundColor="Transparent">
                                <Border Background="{Binding CardStatusColor}"
                                        Grid.Column="2"
                                        Grid.Row="0"
                                        HorizontalOptions="End"
                                        VerticalOptions="Center"
                                        Stroke="Transparent"
                                        >
                                    <Label Text="{Binding Status}"
                                           FontSize="10"
                                           Margin="2"
                                           TextColor="White"/>
                                </Border>
                                <Label
                                    Grid.Row="0"
                                    Grid.ColumnSpan="2"
                                    Margin="0,6,0,0"
                                    FontSize="12"
                                    HorizontalOptions="Start"
                                    Text="{Binding Type}"
                                    TextColor="White"/>

                                <Label 
                                    Grid.Row="1"
                                    Grid.ColumnSpan="3"
                                    FontFamily="Montserrat-Medium"
                                    FontSize="16"
                                    HorizontalOptions="Start"
                                    LineHeight="{OnPlatform Default=-1, Android=1.5}"
                                    Text="{Binding Number}"
                                    TextColor="White"/>

                                <Grid Grid.Row="2" 
                                      Grid.ColumnSpan="3" 
                                      RowSpacing="0" 
                                      Margin="0,15,0,0"
                                      ColumnDefinitions="7*,3*">
                                    <VerticalStackLayout Grid.Column="0"
                                                 Spacing="3">

                                        <Label FontFamily="Montserrat-Medium"
                                               FontSize="10"
                                               LineHeight="{OnPlatform Default=-1,Android=1.5}"
                                               Text="{Binding NameLabel}"
                                               TextColor="White"/>
                                        <Label FontSize="10"
                                               HorizontalTextAlignment="Start"
                                               LineBreakMode="TailTruncation"
                                               MaxLines="1"
                                               Text="{Binding HolderName}"
                                               TextColor="White"/>
                                    </VerticalStackLayout>
                                    <Label Grid.Column="1"
                                           FontFamily="Montserrat-Medium"
                                           FontSize="10"
                                           Text="{Binding ExpirationLabel}"
                                           TextColor="White"/>
                                </Grid>
                            </Grid>
                        </Grid>
                    </Border>
                </DataTemplate>
            </CarouselView.ItemTemplate>
        </CarouselView>
    </Grid>
</ContentPage>

已尝试的解决方案 #

• 为Grid行设置固定高度
• 在代码后台调用InvalidateMeasure()刷新CarouselView
• 尝试使用CarouselView的Handler相关调整

内容的提问来源于stack exchange，提问作者Adrián Romero