XAML 滚动视图在IOS上是不同的

bgibtngc  于 2023-04-03  发布在  iOS
关注(0)|答案(1)|浏览(154)

我一直在为iOS上的滚动视图而挣扎。当我在Android上运行我的程序时,一切都很好,但在iOS上滚动视图太宽了。准确地说,Android上的滚动视图与屏幕一样宽,但在iOS上,滚动视图是实际屏幕宽度的三倍。总的来说,每当我在Android上做任何布局时,一切看起来都很好,工作正常,但当我将模拟器切换到iOS时,布局完全不同,被破坏了。有人知道是什么会导致这种行为吗?
下面是XAML代码:

<RefreshView BackgroundColor="#0F0F0F"
                 Command="{Binding GetPostCommand}"
                 IsRefreshing="{Binding IsRefreshing}" >
        <ScrollView>
            <CollectionView ItemsSource="{Binding mainPost}">
                <CollectionView.ItemTemplate>
                    <DataTemplate x:DataType="model:MainPostJson">
                        <VerticalStackLayout Margin="6,80,6,0">
                            <Grid ColumnDefinitions="auto,auto,*,*" BackgroundColor="Black">
                                <Image Source="{Binding ProfileImage}" Grid.Column="0" HorizontalOptions="Start" WidthRequest="38" HeightRequest="38" Margin="7"/>
                                <Label Text="{Binding FullName}" Grid.Column="1" TextColor="White" VerticalOptions="Center" HorizontalOptions="Start" FontSize="16"/>
                                <Label Text="{Binding Date}" Grid.Column="2" TextColor="#8A8A8A" FontSize="10" VerticalTextAlignment="Center" HorizontalOptions="Start" Padding="12,4,0,0"/>
                                <Label Text="..." Grid.Column="4" TextColor="White" FontSize="24" Padding="0,0,10,10" VerticalTextAlignment="Center" HorizontalOptions="End">
                                    <Label.GestureRecognizers>
                                    </Label.GestureRecognizers>
                                </Label>
                            </Grid>
                            <Image Source="{Binding MainImage}" Aspect="AspectFill" HeightRequest="300" BackgroundColor="Black"/>
                            <Grid HeightRequest="130" ColumnDefinitions="*,*" RowDefinitions="*,*,*" BackgroundColor="Black">
                                <Label Text="{Binding Topic}" Grid.ColumnSpan="2" Grid.Row="0" Grid.RowSpan="2" TextColor="White" FontSize="20" HorizontalTextAlignment="Center" VerticalTextAlignment="Center"/>
                                <Line Grid.ColumnSpan="2" Grid.Row="2" VerticalOptions="Start" Margin="10,0" BackgroundColor="#AEAEAE" HeightRequest="0.5"/>
                                <HorizontalStackLayout Grid.Column="0" Grid.Row="2" VerticalOptions="Center">
                                    <Image Source="like_icon_red.png" Aspect="AspectFit" WidthRequest="30" HeightRequest="30" VerticalOptions="Center" HorizontalOptions="Start" Margin="10,0"/>
                                    <Label VerticalOptions="Center">
                                        <Label.FormattedText>
                                            <FormattedString>
                                                <Span Text="{Binding Likes}" FontAttributes="Bold" TextColor="White" FontSize="14"/>
                                            </FormattedString>
                                        </Label.FormattedText>
                                    </Label>
                                </HorizontalStackLayout>
                                <Image Source="sharepost_icon.png" Grid.Column="2" Aspect="AspectFit" Grid.Row="2" WidthRequest="30" HeightRequest="30" HorizontalOptions="End" Margin="10,0"/>
                            </Grid>
                        </VerticalStackLayout>
                    </DataTemplate>
                </CollectionView.ItemTemplate>
            </CollectionView>
        </ScrollView>
    </RefreshView>

我已经找了两天了,没有找到答案。

8ulbf1ek

8ulbf1ek1#

我测试你的代码可以重现这一点。但对于你的情况,不建议将垂直滚动的CollectionView Package 在垂直滚动的ScrollView中,这可能会导致许多滚动问题。CollectionView有自己的滚动功能,所以你不必像Jason所说的那样将其放在ScrollView中。或者你可以为CollectionView设置一个WidthRequest
有关更多信息,您可以参考:How to use CollectionView inside a ScrollView .
希望对你有用。

相关问题