Кнопки C # UWP не выровнены так, как я хотел

Question

Я создал кнопку рядом с моей кнопкой «Пуск».На моей странице xaml кнопка появляется там, где я хочу, чтобы она была.

Однако, когда я запускаю приложение, оно появляется случайным образомместо нахождения.

как это исправить?

StackPanel>
        <TextBlock Text="Description:" Style="{StaticResource SampleHeaderTextStyle}"/>
        <TextBlock Style="{StaticResource ScenarioDescriptionTextStyle}" Text="This page is where your exercise starts " FontSize="20"/>
        <TextBlock TextWrapping="Wrap" Margin="0,20,0,0" FontSize="20">
            Follow the instruction and press "Start" to begin the exercise.
        </TextBlock>
        <TextBlock TextWrapping="Wrap" Margin="0,0,0,0" FontSize="15">
            (Ensure the connected BLE device is working before starting the exercise.)
        </TextBlock>
        <TextBlock x:Name="txtClock" TextWrapping="Wrap" Margin="0,10,0,0" FontSize="20"/>
        <Button x:Name="btnStart" Content="Start" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="0,10,0,0" Height="38" Width="106" Click="btnStart_Click_1"/>
        <TextBlock x:Name="txtExercise"  TextWrapping="Wrap" Margin="0,10,0,0" FontSize="15"/>
        <TextBlock x:Name="txtAngle"  TextWrapping="Wrap" Margin="0,10,0,0" FontSize="15"/>
        <TextBlock x:Name="txtDisplay"  TextWrapping="Wrap" Margin="0,10,0,0"/>
        <TextBlock x:Name="txtAgain" Text="" TextWrapping="Wrap" Margin="0,10,0,0" FontSize="15"/>
        <Button x:Name="btnRefresh" Content="Refresh" HorizontalAlignment="Left" VerticalAlignment="Top" Height="38" Width="106" Margin="150,-158,0,0" Click="btnRefresh_Click"/>

Answer 1

Поскольку вы используете Margin-Property кнопки, имеет смысл, что она появится в другом месте.

Если честно, я не знаю, почему, но у меня были те же проблемы.

Я бы посоветовал вам использовать RelativePanel a StackPanel или Grid.

. Вы можете прочитать на этой странице Microsoft. Чтобы узнатьподробнее о разнице между различными типами.

Сетка будет выглядеть примерно так: (Имейте в виду, что сетка имеет индекс 0)

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="100"/> //For a Row of 100 units height
    <RowDefinition Height="*"/> //For a Row which fills the rest of the available screen space
  </Grid.RowDefinitions>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="100"/> //For a column of 100 units width
    <ColumnDefinition Width="*"/> //For a column which fills the rest of the screen
  </Grid.ColumnDefinitions>

  <Button x:Name="Button1" Grid.Row="0" Grid.Column="0" />
  <Button x:Name="Button2" Grid.Row="1" Grid.Column="1" />
</Grid> 

Панель стека будет выглядеть следующим образом: (Здесь нужно помнить, что панель Stackpanel не будет изменять размеры своих элементов при изменении размера экрана / окна)

<Stackpanel Orientation="horizontal">
  <Button x:Name="Button1"/>
  <Button x:Name="Button2"/>
</Stackpanel>