CommandBar AppBarButton图标大小

Question

我正尝试重新设计CommandBar AppBarButton图标，使其看起来像日历，邮件等Microsoft Apps。

正如您在下面看到的那样，Microsoft Apps图标比我的图标更大，更平滑，更薄，并且还具有鲜艳的白色。

我尝试应用资源，并且其他配置（例如字体大小，高度，宽度和任何配置都无效），我不知道该怎么做。

这是我的源代码：

<Page.Resources>
    link to resouse file:
    https://msdn.microsoft.com/pt-br/library/windows/apps/mt299105.aspx
</Page.Resources>

<CommandBar Height="40" OverflowButtonVisibility="Collapsed" Background="Transparent" IsOpen="True" DefaultLabelPosition="Right">
    <CommandBar.Content>
        <TextBlock Text="X" FontFamily="SEGOE" Padding="10,0,0,0"/>
    </CommandBar.Content>
    <AppBarButton Icon="Save" Label="Save"/>
    <AppBarButton Icon="Delete" Label="Save"/>
    <AppBarButton Style="{StaticResource AppBarButtonStyle1}" Icon="Save" Label="Save"/>
    <AppBarButton Style="{StaticResource AppBarButtonStyle1}" Icon="Delete" Label="Delete"/>
</CommandBar>

Answer 1

您在上面的注释中提到的AppBarButton样式不是最新的。

您可以通过以下步骤获取最新样式：

转到“文档大纲->右键单击AppBarButton->编辑模板->编辑副本” 。

然后，您会发现<Style x:Key="AppBarButtonStyle" TargetType="AppBarButton"> <Setter Property="Background" Value="{ThemeResource AppBarButtonBackground}" /> <Setter Property="Foreground" Value="{ThemeResource AppBarButtonForeground}" /> <Setter Property="BorderBrush" Value="{ThemeResource AppBarButtonBorderBrush}" /> <Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="VerticalAlignment" Value="Top" /> <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" /> <Setter Property="FontWeight" Value="Normal" /> <Setter Property="Width" Value="68" /> <Setter Property="UseSystemFocusVisuals" Value="{StaticResource UseSystemFocusVisuals}" /> <Setter Property="AllowFocusOnInteraction" Value="False" /> <Setter Property="KeyboardAcceleratorPlacementMode" Value="Hidden" /> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="AppBarButton"> <Grid x:Name="Root" Background="{TemplateBinding Background}" BorderThickness="{TemplateBinding BorderThickness}" BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="{TemplateBinding CornerRadius}" MinWidth="{TemplateBinding MinWidth}" MaxWidth="{TemplateBinding MaxWidth}"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="ApplicationViewStates"> <VisualState x:Name="FullSize" /> <VisualState x:Name="Compact"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="LabelOnRight"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentViewbox" Storyboard.TargetProperty="Margin"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarButtonContentViewboxMargin}" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentRoot" Storyboard.TargetProperty="MinHeight"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarThemeCompactHeight}" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="(Grid.Row)"> <DiscreteObjectKeyFrame KeyTime="0" Value="0" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="(Grid.Column)"> <DiscreteObjectKeyFrame KeyTime="0" Value="1" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="TextAlignment"> <DiscreteObjectKeyFrame KeyTime="0" Value="Left" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="Margin"> <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource AppBarButtonTextLabelOnRightMargin}" /> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="LabelCollapsed"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentRoot" Storyboard.TargetProperty="MinHeight"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource AppBarThemeCompactHeight}" /> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="TextLabel" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed" /> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Overflow"> <VisualState.Setters> <Setter Target="ContentRoot.MinHeight" Value="0" /> <Setter Target="ContentViewbox.Visibility" Value="Collapsed" /> <Setter Target="TextLabel.Visibility" Value="Collapsed" /> <Setter Target="OverflowTextLabel.Visibility" Value="Visible" /> </VisualState.Setters> </VisualState> <VisualState x:Name="OverflowWithToggleButtons"> <VisualState.Setters> <Setter Target="ContentRoot.MinHeight" Value="0" /> <Setter Target="ContentViewbox.Visibility" Value="Collapsed" /> <Setter Target="TextLabel.Visibility" Value="Collapsed" /> <Setter Target="OverflowTextLabel.Visibility" Value="Visible" /> <Setter Target="OverflowTextLabel.Margin" Value="38,0,12,0" /> </VisualState.Setters> </VisualState> <VisualState x:Name="OverflowWithMenuIcons"> <VisualState.Setters> <Setter Target="ContentRoot.MinHeight" Value="0" /> <Setter Target="ContentViewbox.HorizontalAlignment" Value="Left" /> <Setter Target="ContentViewbox.VerticalAlignment" Value="Center" /> <Setter Target="ContentViewbox.Width" Value="16" /> <Setter Target="ContentViewbox.Height" Value="16" /> <Setter Target="ContentViewbox.Margin" Value="12,0,12,0" /> <Setter Target="TextLabel.Visibility" Value="Collapsed" /> <Setter Target="OverflowTextLabel.Visibility" Value="Visible" /> <Setter Target="OverflowTextLabel.Margin" Value="38,0,12,0" /> </VisualState.Setters> </VisualState> <VisualState x:Name="OverflowWithToggleButtonsAndMenuIcons"> <VisualState.Setters> <Setter Target="ContentRoot.MinHeight" Value="0" /> <Setter Target="ContentViewbox.HorizontalAlignment" Value="Left" /> <Setter Target="ContentViewbox.VerticalAlignment" Value="Center" /> <Setter Target="ContentViewbox.Width" Value="16" /> <Setter Target="ContentViewbox.Height" Value="16" /> <Setter Target="ContentViewbox.Margin" Value="38,0,12,0" /> <Setter Target="TextLabel.Visibility" Value="Collapsed" /> <Setter Target="OverflowTextLabel.Visibility" Value="Visible" /> <Setter Target="OverflowTextLabel.Margin" Value="76,0,12,0" /> </VisualState.Setters> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="CommonStates"> <VisualState x:Name="Normal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> </Storyboard> </VisualState> <VisualState x:Name="PointerOver"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundPointerOver}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushPointerOver}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundPointerOver}" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> </Storyboard> </VisualState> <VisualState x:Name="Pressed"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundPressed}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushPressed}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundPressed}" /> </VisualState.Setters> <Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="OverflowTextLabel" /> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundDisabled}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushDisabled}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundDisabled}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundDisabled}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="OverflowNormal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="ContentRoot" /> </Storyboard> </VisualState> <VisualState x:Name="OverflowPointerOver"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundPointerOver}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushPointerOver}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPointerOver}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundPointerOver}" /> <Setter Target="SubItemChevron.Foreground" Value="{ThemeResource AppBarButtonSubItemChevronForegroundPointerOver}" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="ContentRoot" /> </Storyboard> </VisualState> <VisualState x:Name="OverflowPressed"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundPressed}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushPressed}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundPressed}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundPressed}" /> <Setter Target="SubItemChevron.Foreground" Value="{ThemeResource AppBarButtonSubItemChevronForegroundPressed}" /> </VisualState.Setters> <Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="ContentRoot" /> </Storyboard> </VisualState> <VisualState x:Name="OverflowSubMenuOpened"> <VisualState.Setters> <Setter Target="Root.Background" Value="{ThemeResource AppBarButtonBackgroundSubMenuOpened}" /> <Setter Target="Root.BorderBrush" Value="{ThemeResource AppBarButtonBorderBrushSubMenuOpened}" /> <Setter Target="Content.Foreground" Value="{ThemeResource AppBarButtonForegroundSubMenuOpened}" /> <Setter Target="TextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundSubMenuOpened}" /> <Setter Target="OverflowTextLabel.Foreground" Value="{ThemeResource AppBarButtonForegroundSubMenuOpened}" /> <Setter Target="KeyboardAcceleratorTextLabel.Foreground" Value="{ThemeResource AppBarButtonKeyboardAcceleratorTextForegroundSubMenuOpened}" /> <Setter Target="SubItemChevron.Foreground" Value="{ThemeResource AppBarButtonSubItemChevronForegroundSubMenuOpened}" /> </VisualState.Setters> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="ContentRoot" /> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="InputModeStates"> <VisualState x:Name="InputModeDefault" /> <VisualState x:Name="TouchInputMode"> <VisualState.Setters> <Setter Target="OverflowTextLabel.Padding" Value="{StaticResource AppBarButtonOverflowTextTouchMargin}" /> </VisualState.Setters> </VisualState> <VisualState x:Name="GameControllerInputMode"> <VisualState.Setters> <Setter Target="OverflowTextLabel.Padding" Value="{StaticResource AppBarButtonOverflowTextTouchMargin}" /> </VisualState.Setters> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="KeyboardAcceleratorTextVisibility"> <VisualState x:Name="KeyboardAcceleratorTextCollapsed" /> <VisualState x:Name="KeyboardAcceleratorTextVisible"> <VisualState.Setters> <Setter Target="KeyboardAcceleratorTextLabel.Visibility" Value="Visible" /> </VisualState.Setters> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="FlyoutStates"> <VisualState x:Name="NoFlyout" /> <VisualState x:Name="HasFlyout"> <VisualState.Setters> <Setter Target="SubItemChevron.Visibility" Value="Visible" /> </VisualState.Setters> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid x:Name="ContentRoot" MinHeight="{ThemeResource AppBarThemeMinHeight}"> <Grid.ColumnDefinitions> <ColumnDefinition Width="*" /> <ColumnDefinition Width="Auto" /> <ColumnDefinition Width="Auto" /> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height="Auto" /> <RowDefinition Height="Auto" /> </Grid.RowDefinitions> <Viewbox x:Name="ContentViewbox" AutomationProperties.AccessibilityView="Raw" HorizontalAlignment="Stretch" Height="50" Margin="{ThemeResource AppBarButtonContentViewboxCollapsedMargin}"> <ContentPresenter x:Name="Content" Content="{TemplateBinding Icon}" Foreground="{TemplateBinding Foreground}" Height="20" /> </Viewbox> <TextBlock x:Name="TextLabel" AutomationProperties.AccessibilityView="Raw" FontFamily="{TemplateBinding FontFamily}" Foreground="{TemplateBinding Foreground}" FontSize="12" Margin="2,0,2,6" Grid.Row="1" Text="{TemplateBinding Label}" TextWrapping="Wrap" TextAlignment="Center" /> <TextBlock x:Name="OverflowTextLabel" AutomationProperties.AccessibilityView="Raw" FontFamily="{TemplateBinding FontFamily}" Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Stretch" Margin="12,0,12,0" Padding="{StaticResource AppBarButtonOverflowTextLabelPadding}" Text="{TemplateBinding Label}" TextTrimming="Clip" TextWrapping="NoWrap" TextAlignment="Left" VerticalAlignment="Center" Visibility="Collapsed" /> <TextBlock x:Name="KeyboardAcceleratorTextLabel" AutomationProperties.AccessibilityView="Raw" Grid.Column="1" Foreground="{ThemeResource AppBarButtonKeyboardAcceleratorTextForeground}" HorizontalAlignment="Right" MinWidth="{Binding TemplateSettings.KeyboardAcceleratorTextMinWidth, RelativeSource={RelativeSource Mode=TemplatedParent}}" Margin="24,0,12,0" Style="{ThemeResource CaptionTextBlockStyle}" Text="{TemplateBinding KeyboardAcceleratorTextOverride}" VerticalAlignment="Center" Visibility="Collapsed" /> <FontIcon x:Name="SubItemChevron" AutomationProperties.AccessibilityView="Raw" Grid.Column="2" FontFamily="{ThemeResource SymbolThemeFontFamily}" Foreground="{ThemeResource MenuFlyoutSubItemChevron}" FontSize="12" Glyph="&#xE0E3;" MirroredWhenRightToLeft="True" Margin="12,0,12,0" Visibility="Collapsed" /> </Grid> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> 被包装在ViewBox中。此ViewBox具有固定的高度（16）。您可以更改所需的高度值。

<CommandBar>
    <AppBarButton Style="{StaticResource AppBarButtonStyle}" Label="add" Icon="Save">
    </AppBarButton>
</CommandBar>

// Capturing alert message.    
String alertMessage= driver.findElement(By.className("modal-header"))
                           .getText();

System.out.println(alertMessage);


String okButton= driver.findElement(By.xpath("//h4[contains(text(),'Woo Hoo! You have successfully registered! Look ou')]"))
                       .getText();
System.out.println(okButton);

driver.findElement(By.xpath("//button[contains(text(),'OK')]"))
      .click();