Xamarin Forms выровняйте немного выше центра экрана

Question

Я занимаюсь разработкой чего-то вроде приложения Uber (Пин центрируется на экране, и карту можно перемещать только, пин всегда остается в центре).

Я создал Грид сИзображение и Xamarin.Forms.Map в нем, и я установил изображение по горизонтали и вертикали по центру, а карту по горизонтали и вертикали заполняет доступное пространство.Это не правильно, потому что дно булавки не будет соответствовать точному центру карты.Как я могу нарисовать немного выше, чем вертикальный центр экрана?Смотрите скриншот:

Это действительно должно быть динамично.

  <Grid>
    <maps:Map x:Name="DisplayMap" IsShowingUser="true" MapType="Street" HorizontalOptions="Fill" VerticalOptions="Fill"/>
    <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
            <!-- SOME OTHER CONTROLS -->
            <Image Source="pin.png" WidthRequest="50" HeightRequest="50"/>
    <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
  </Grid>

Answer 1

  <Grid>
   <Grid
     HorizontalOptions="Fill" 
     VerticalOptions="Fill">
    <Grid.RowDefinitions>
     <RowDefinition Height="*"/>
     <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Image 
       Grid.Row="0"
       Source="pin.png" 
       WidthRequest="50" 
       HeightRequest="50"
       VerticalOptions="End"
       HorizontalOptions="Center"/>

  </Grid>
  <maps:Map 
    x:Name="DisplayMap" 
    IsShowingUser="true" 
    MapType="Street" 
    HorizontalOptions="Fill" 
    VerticalOptions="Fill"/>
 </Grid>

Это разделит весь экран на две части по горизонтали, и изображение будет выровнено по нижней части первого ряда.

Answer 2

Если вы установите «некоторые другие элементы управления» в stackLayout, stackLayout будет центрирован, но ваше изображение больше не будет перемещаться вниз ...

Попробуйте что-то вроде этого (исключите изображение из stackLayout):

  <Grid>

    <maps:Map x:Name="DisplayMap" IsShowingUser="true" MapType="Street" 
        HorizontalOptions="Fill" VerticalOptions="Fill"/>

    <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
        <!-- SOME OTHER CONTROLS -->
    </StackLayout>

    <Image 
        Source="pin.png" 
        WidthRequest="50" HeightRequest="50"
        VerticalOptions="Center"
        HorizontalOptions="Center" 
        />
  </Grid>

Ваше изображение 'pin':

• будет отцентрировано
• будет поверх других элементов управления

Это должно работать сейчас ...