Xamarin 形成自定义滚动视图，显示奇怪的行为答案

【问题标题】：Xamarin forms custom scrollview showing weird behaviorXamarin 形成自定义滚动视图，显示奇怪的行为
【发布时间】：2020-03-21 04:59:49
【问题描述】：

我有一个基于 TLScrollView 的要求定制的 ScrollView。

现在，当我向其中添加一些数据时，我最近注意到屏幕区域的一部分无法点击，而其余部分工作正常。

现在，相同的代码在 Android 上运行起来就像一个魅力，但 iOS 显示出这种奇怪的行为，

Xaml：

  <controls:TLScrollView Orientation="Horizontal" BackgroundColor="White"
          x:Name="ListAddons" ItemsSource="{Binding ListAddons}" AbsoluteLayout.LayoutFlags = "All"
            AbsoluteLayout.LayoutBounds = "0.5, 0.5, 1.0, 1.0">

                <controls:TLScrollView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout BackgroundColor="Transparent" Margin = "0, 5, 0, 0">
                                <Grid BackgroundColor="White" InputTransparent="true"  RowSpacing = "0" ColumnSpacing = "0">
                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="0.5*" />
                                        <RowDefinition Height="45.0*" />
                                        <RowDefinition Height="45*" />
                                    </Grid.RowDefinitions>
                                    <Grid.ColumnDefinitions>
                                        <ColumnDefinition Width="100" />
                                        <ColumnDefinition Width="1" />
                                    </Grid.ColumnDefinitions>
                                    <ffimageloading:CachedImage Source="{Binding Icon, Converter={StaticResource Base64ToImageConverter}}"
                   ErrorPlaceholder = "nopreviewlandscape" LoadingPlaceholder = "loadingicon"
                              Grid.Row="1" Grid.Column="0" HorizontalOptions="Center"
                              VerticalOptions="Center" Aspect="AspectFill" />
                                    <Label x:Name="lblRecommendationsName"  Margin="0" Text="{Binding CategoryName}"
                                  LineBreakMode="WordWrap" XAlign="Center" TextColor="{StaticResource gray_text_color}"
                                  VerticalOptions="Center" HorizontalOptions="Center" Grid.Row="2"
                                  Grid.Column="0" Style="{StaticResource RecommendationName}">
                                        <Label.FontFamily>
                                            <OnPlatform x:TypeArguments="x:String">
                                                <On Platform="iOS" Value="OpenSans-Light" />
                                                <On Platform="Android" Value="OpenSans-Light" />
                                            </OnPlatform>
                                        </Label.FontFamily>
                                        <Label.TextColor>
                                            <OnPlatform x:TypeArguments="Color">
                                                <On Platform="Android" Value="#000000"></On>
                                            </OnPlatform>
                                        </Label.TextColor>
                                    </Label>

                                    <BoxView WidthRequest="0" Grid.Row="1" Grid.Column="1"
                                  BackgroundColor="{StaticResource separator_color}"
                                      Grid.RowSpan="4" Style="{StaticResource BoxViewHomeStyle}">
                                    </BoxView>

                                </Grid>
                                <StackLayout.GestureRecognizers>
                                    <TapGestureRecognizer Command="{Binding Path=BindingContext.AddonsClickCommand,Source={x:Reference ListAddons}}"
                                      CommandParameter="{Binding CategoryId}"
                                  />
                                </StackLayout.GestureRecognizers>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </controls:TLScrollView.ItemTemplate>
            </controls:TLScrollView>

首先，我认为其中一定有某种重叠可能会导致这种情况，但后来我意识到相同的代码在 Android 设备上运行并在 iOS 上导致了这种情况。

图像中不可点击的部分位于黑框内，其他地方点击事件都可以正常工作。

【问题讨论】：

你运行了哪个 ios 设备？
iPhone X,6,7,8,6s（物理设备），他们似乎都没有在那个位置得到触摸
无法点击的区域在工具栏中？
不，这不是工具栏，这是中间屏幕的一部分，我只添加了相关的屏幕部分

标签： xamarin xamarin.forms xamarin.ios xamarin.android

【解决方案1】：

可能与此问题无关，但我认为 BoxView 的“Grid.RowSpan”可能会导致问题。

Grid 只有三行（0-2 行）定义，但 BoxView 指定合并 1 到 4 行。

                                    <Grid.RowDefinitions>
                                        <RowDefinition Height="0.5*" />
                                        <RowDefinition Height="45.0*" />
                                        <RowDefinition Height="45*" />
                                    </Grid.RowDefinitions>

<BoxView WidthRequest="0" Grid.Row="1" Grid.Column="1"
                                  BackgroundColor="{StaticResource separator_color}"
                                      Grid.RowSpan="4" Style="{StaticResource BoxViewHomeStyle}">
                                    </BoxView>

【讨论】：

【解决方案2】：

好吧，我不确定是什么导致了这个问题，但更新到最新版本的 Xamarin.Forms 修复了这个错误！

我已更新到 Xamarin.Forms 版本 4.5.0.396

如果您遇到类似问题，请随时回复。

【讨论】：