Xamarin.Forms: метки положения в StackLayout?

Наконец-то я смог отобразить несколько Labels в моем ListView. Мой xaml выглядит так. Как видите, я только что ударил 4 Labels, и вот что отображается:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
             xmlns:local="clr-namespace:GasStations"
             x:Class="GasStations.MainPage">

    <Grid RowSpacing="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="50" />
            <RowDefinition Height="auto" />
        </Grid.RowDefinitions>
        <StackLayout Grid.Row="0" x:Name="MapGrid">
            <maps:Map WidthRequest="960" HeightRequest="200" 
                  x:Name="MyMap" IsShowingUser="true"/>
        </StackLayout>
        <StackLayout Grid.Row="1">
            <Button Text="Show list" x:Name="Button_DisplayList"
                VerticalOptions="CenterAndExpand"
                HorizontalOptions="Center"
                Clicked="OnButtonClicked" />
        </StackLayout>
        <StackLayout Grid.Row="2" x:Name="listSection" IsVisible="false" HeightRequest="200">
            <ListView x:Name="ListView_Pets" >
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout Orientation="Horizontal" HeightRequest="200">
                                <Label Text="{Binding StoreName}" FontSize="10"/>
                                <Label Text="{Binding Description}" FontSize="14"/>
                                <Label Text="{Binding Street}" FontSize="8"/>
                                <Label Text="{Binding State}" FontSize="16"/>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
    </Grid>

</ContentPage>

Все идет нормально. Для всех, кто заинтересован, есть снимок экрана здесь.

Но вместо того, чтобы устанавливать ярлыки один за другим, я хочу расположить их в разных местах. Например, Label Name будет в верхнем левом углу, а Label Desc будет ниже, а Label Lon будет в правом нижнем углу, а Label Lat будет по центру по горизонтали.

Итак, мои вопросы:

1) Как я могу разместить эти метки в доступном пространстве? Есть ли что-то вроде html таблицы эквивалента, которую я могу использовать для размещения меток в определенных местах?

2) Как изменить высоту каждой строки? Причина, по которой я установил StackLayout Orientation на Горизонтально, заключается в том, что две метки не поместились, если я установил значение Вертикально (поэтому выглядит так). Я пробовал HeightRequest и MinimumHeightRequest, но ничего не изменилось.


person fdkgfosfskjdlsjdlkfsf    schedule 22.02.2019    source источник


Ответы (3)


Grid должен дать вам то, что ты хочешь. Вы можете установить количество строк и столбцов, а также высоту каждой строки и ширину каждого столбца. Настройки высоты и ширины могут быть абсолютными (вы указываете явное значение высоты / ширины), автоматическими (в зависимости от содержимого) или пропорциональными со значением «*». Вы также можете установить для элемента значение span несколько строк и / или столбцов ... как в таблице HTML.

person jgoldberger - MSFT    schedule 22.02.2019

Вы можете реализовать макет Grid следующим образом:

<ListView x:Name="ListView_Pets">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid VerticalOptions="Center">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Row="0"
                           Grid.Column="0"
                           FontSize="10"
                           Text="{Binding StoreName}"
                           VerticalTextAlignment="Center" />
                    <Label Grid.Row="0"
                           Grid.Column="1"
                           FontSize="14"
                           Text="{Binding Description}"
                           VerticalTextAlignment="Center" />
                    <Label Grid.Row="0"
                           Grid.Column="2"
                           FontSize="8"
                           Text="{Binding Street}"
                           VerticalTextAlignment="Center" />
                    <Label Grid.Row="0"
                           Grid.Column="3"
                           FontSize="16"
                           Text="{Binding State}"
                           VerticalTextAlignment="Center" />
                </Grid>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
person Himanshu Dwivedi    schedule 22.02.2019

Просто попробуйте это:

<Label Text="My text" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="End" />

и убедитесь, что HorizontalOptions в StackLayout равен HorizontalOptions="EndAndExpand"

person Ibrahim Shara'h    schedule 07.10.2019