Xamarin iOS изображения перекрываются внутри сетки - PullRequest
Новая
       13

Xamarin iOS изображения перекрываются внутри сетки

0 голосов
/ 28 августа 2018

Heyo,

Итак, в Xamarin у меня есть <Grid> с <Image> и парой <Label> s внутри, все обернуто внутри <ViewCell>. В Xamarin.Android это выглядит совершенно нормально, однако в Xamarin.iOS изображения накладываются на метки. Я не уверен, в чем может быть разница - почему он хорошо выглядит в Xamarin.Android, но в iOS все шатко?

Ниже мой XAML и пара макетов, чтобы показать, что я имею в виду. 

<ListView.ItemTemplate>
    <DataTemplate>
        <ViewCell>
            <ViewCell.View>
            <Grid>
                <Grid.ColumnDefinitions>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>

                <Image Grid.Column="0" Grid.Row="0" Aspect="AspectFill" Source="{Binding ImageOverlayEN}" />
                <Label Grid.Column="0" Grid.Row="1" VerticalTextAlignment="Start" LineBreakMode="WordWrap" Text="{Binding DynamicOfferText}" FontSize="18">
                    <Label.FontFamily>
                        <OnPlatform x:TypeArguments="x:String">
                        <OnPlatform.iOS>RobotoCondensed-Regular</OnPlatform.iOS>
                        <OnPlatform.Android>RobotoCondensed-Regular.ttf#RobotoCondensed-Regular</OnPlatform.Android>
                        <OnPlatform.WinPhone>RobotoCondensed-Regular.ttf#RobotoCondensed</OnPlatform.WinPhone>
                    </OnPlatform>
                    </Label.FontFamily>
                </Label>
                <Label Grid.Column="0" Grid.Row="2" VerticalTextAlignment="Start" LineBreakMode="WordWrap" Text="{Binding DynamicOfferDetail}" FontSize="16">
                    <Label.FontFamily>
                        <OnPlatform x:TypeArguments="x:String">
                        <OnPlatform.iOS>RobotoCondensed-Regular</OnPlatform.iOS>
                        <OnPlatform.Android>RobotoCondensed-Regular.ttf#RobotoCondensed-Regular</OnPlatform.Android>
                        <OnPlatform.WinPhone>RobotoCondensed-Regular.ttf#RobotoCondensed</OnPlatform.WinPhone>
                    </OnPlatform>
                    </Label.FontFamily>
                </Label>
                </Grid>
            </ViewCell.View>
        </ViewCell>
    </DataTemplate>
</ListView.ItemTemplate>

Я попытался установить HeightRequest, но, похоже, это не имело значения: 

#if __IOS__
    if (viewModel.Items.Count > 0)
    {
        MyListView.HeightRequest = 300 * viewModel.Items.Count;
    }
#endif

Вот наглядное представление о происходящем:

enter image description here

1 Ответ

0 голосов
/ 31 августа 2018

Разобрался - это было связано с тем, что мой RowDefinitions был настроен на Auto

Это выглядело правильно: 

<RowDefinition Height="1*" />
<RowDefinition Height="0.18*" />
<RowDefinition Height="0.77*" />

Я думаю, что сначала происходит ListView, высота определения строки Auto устанавливает высоту каждой строки до загрузки изображения завершается, затем изображение завершает загрузку и накладывается на остальная часть элемента представления списка (включая метки). Это может быть просто причуда iOS, когда Android вычисляет высоту строк после завершения загрузки изображений (объясняя, почему в Android все выглядело нормально)

...