水平對齊AppBarButton - XAML

我需要在我的CommandBar左邊對齊「Button1」，右邊對齊「Button2」。水平對齊AppBarButton - XAML

我嘗試在「Button1」中放入代碼「HorizontalAlignment =」Left「」，但這不是左邊的對齊方式。始終保持正確的路線。

我的代碼是：

<CommandBar x:Name="CommandBarTest" Grid.Row="1"> 
      <AppBarButton x:Name="Button1" Label="MyButton1" Click="MyButton1_Click" HorizontalAlignment="Left"> 
       <AppBarButton.Content> 
        <Grid> 
         <Border Margin="4,-1,0,13" Canvas.ZIndex="1" CornerRadius="15" Background="Black" Height="19" Width="19" HorizontalAlignment="Left"> 
          <TextBlock Text="2" FontFamily="Segoe UI" FontSize="12" Foreground="White" TextLineBounds="Tight" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="3,5"></TextBlock> 
         </Border> 
         <TextBlock FontFamily="Segoe MDL2 Assets" FontSize="24" Text="&#xE7EE;" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="12,3,12,4"></TextBlock> 
        </Grid> 
       </AppBarButton.Content> 
      </AppBarButton> 
      <AppBarButton x:Name="Button2" Label="MyButton2"> 
       <AppBarButton.Content> 
        <Button Content="&#xE840;" HorizontalAlignment="Center" FontFamily="Segoe MDL2 Assets" FontSize="20" Width="32" Height="32" Padding="0" Background="Transparent"/> 
       </AppBarButton.Content> 
      </AppBarButton> 
</CommandBar>

有人幫幫我嗎？

感謝

來源

2015-09-13 fipcurren88

您應該使用PrimaryCommands（右側）和SecondaryCommands（向左）爲您移動appBarButton s到左邊或右邊，應該基於微軟指引

<CommandBar x:Name="CommandBarTest" Grid.Row="1" > 
     <CommandBar.SecondaryCommands> 
      <AppBarButton x:Name="Button1" Label="MyButton1"> 
       <AppBarButton.Content> 
        <Grid> 
         <Border Margin="4,-1,0,13" Canvas.ZIndex="1" CornerRadius="15" Background="Black" Height="19" Width="19" HorizontalAlignment="Left"> 
          <TextBlock Text="2" FontFamily="Segoe UI" FontSize="12" Foreground="White" TextLineBounds="Tight" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="3,5"></TextBlock> 
         </Border> 
         <TextBlock FontFamily="Segoe MDL2 Assets" FontSize="24" Text="&#xE7EE;" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="12,3,12,4"></TextBlock> 
        </Grid> 
       </AppBarButton.Content> 
      </AppBarButton> 
     </CommandBar.SecondaryCommands> 
     <CommandBar.PrimaryCommands> 
      <AppBarButton x:Name="Button2" Label="MyButton2"> 
       <AppBarButton.Content> 
        <Button Content="&#xE840;" HorizontalAlignment="Center" FontFamily="Segoe MDL2 Assets" FontSize="20" Width="32" Height="32" Padding="0" Background="Transparent"/> 
       </AppBarButton.Content> 
      </AppBarButton> 
     </CommandBar.PrimaryCommands>   
    </CommandBar>

如果您不想遵守這些準則，你可以簡單地使用Grid的AppBar代替內，

<AppBar> 
     <Grid x:Name="CommandBarTest" > 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="auto"/> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="auto"/> 
      </Grid.ColumnDefinitions> 

      <AppBarButton Grid.Column="0" x:Name="Button1" Label="MyButton1"> 
       <AppBarButton.Content> 
        <Grid> 
         <Border Margin="4,-1,0,13" Canvas.ZIndex="1" CornerRadius="15" Background="Black" Height="19" Width="19" HorizontalAlignment="Left"> 
          <TextBlock Text="2" FontFamily="Segoe UI" FontSize="12" Foreground="White" TextLineBounds="Tight" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="3,5"></TextBlock> 
         </Border> 
         <TextBlock FontFamily="Segoe MDL2 Assets" FontSize="24" Text="&#xE7EE;" HorizontalAlignment="Center" VerticalAlignment="Center" Margin="12,3,12,4"></TextBlock> 
        </Grid> 
       </AppBarButton.Content> 
      </AppBarButton> 


      <AppBarButton x:Name="Button2" Grid.Column="2" Label="MyButton2"> 
       <AppBarButton.Content> 
        <Button Content="&#xE840;" HorizontalAlignment="Center" FontFamily="Segoe MDL2 Assets" FontSize="20" Width="32" Height="32" Padding="0" Background="Transparent"/> 
       </AppBarButton.Content> 
      </AppBarButton> 
     </Grid> 
    </AppBar>

來源

2015-09-13 13:56:25 Usama

水平對齊AppBarButton - XAML

回答

相關問題