c #windows phone 8.1更改默认控件颜色

时间:2015-10-04 12:19:47

标签: c# visual-studio-2013 windows-phone-8.1 controls

在我的wp应用程序中,我希望拥有所有控件'黑色;对于文本块和文本框我只是在我的字典中声明了一个样式:

<Style x:Key="TextColor" TargetType="TextBlock">
    <Setter Property="Foreground" Value="Black"/>
</Style>

我还有一些时间选择器控件和一个复选框,我无法分别修改标题和方框的颜色。这就是我所做的:

CheckBox VerticalAlignment="Top"
              HorizontalAlignment="Right"
              Margin="0,110,0,0"
              x:Name="dayOffBox"
              Content="Day off?" Checked="DayOff_Checked"
              Foreground="Black"/>

通过这种方式,文本&#34;休息日?&#34;这是复选框的内容是黑色,但框仍然是白色 enter image description here

时间选择器的标题相同。我是否必须更改应用文本的默认颜色?我怎么能这样做?

2 个答案:

答案 0 :(得分:1)

您是否尝试过覆盖默认画笔? 就像在App.xaml合并词典中添加条目一样:

<ResourceDictionary.ThemeDictionaries>
  <ResourceDictionary x:Key="Default">
    <SolidColorBrush x:Key="ApplicationForegroundThemeBrush" Color="Magenta" />
  </ResourceDictionary>
</ResourceDictionary.ThemeDictionaries>

答案 1 :(得分:1)

您可以通过编辑控件的默认样式来编辑任何控件样式。在CheckBox的情况下,它是以下内容:

<Style TargetType="CheckBox">
    <Setter Property="Background" Value="{ThemeResource CheckBoxBackgroundThemeBrush}" />
    <Setter Property="BorderBrush" Value="{ThemeResource CheckBoxBorderThemeBrush}" />
    <Setter Property="BorderThickness" Value="{ThemeResource PhoneBorderThickness}" />
    <Setter Property="FontSize" Value="{ThemeResource TextStyleLargeFontSize}" />
    <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Setter Property="HorizontalAlignment" Value="Left" />
    <Setter Property="VerticalAlignment" Value="Top" />
    <Setter Property="Padding" Value="{ThemeResource CheckBoxAndRadioButtonTextPaddingThickness}" />
    <Setter Property="MinWidth" Value="{ThemeResource CheckBoxAndRadioButtonMinWidthSize}" />
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="CheckBox">
          <Grid Background="Transparent">
            <VisualStateManager.VisualStateGroups>
              <VisualStateGroup x:Name="CommonStates">
                <VisualState x:Name="Normal" />
                <VisualState x:Name="MouseOver" />
                <VisualState x:Name="PointerOver" />
                <VisualState x:Name="Pressed">
                  <Storyboard>
                    <PointerDownThemeAnimation Storyboard.TargetName="Grid" />
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckBackground" Storyboard.TargetProperty="Background">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Fill">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedForegroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="NormalRectangle" Storyboard.TargetProperty="Fill">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
                <VisualState x:Name="Disabled">
                  <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckBackground" Storyboard.TargetProperty="BorderBrush">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBorderThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Fill">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="NormalRectangle" Storyboard.TargetProperty="Fill">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBackgroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}" />
                    </ObjectAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
                <VisualStateGroup.Transitions>
                  <VisualTransition From="Pressed" To="PointerOver">
                    <Storyboard>
                      <PointerUpThemeAnimation Storyboard.TargetName="Grid" />
                    </Storyboard>
                  </VisualTransition>
                  <VisualTransition From="PointerOver" To="Normal">
                    <Storyboard>
                      <PointerUpThemeAnimation Storyboard.TargetName="Grid" />
                    </Storyboard>
                  </VisualTransition>
                  <VisualTransition From="Pressed" To="Normal">
                    <Storyboard>
                      <PointerUpThemeAnimation Storyboard.TargetName="Grid" />
                    </Storyboard>
                  </VisualTransition>
                </VisualStateGroup.Transitions>
              </VisualStateGroup>
              <VisualStateGroup x:Name="CheckStates">
                <VisualState x:Name="Checked">
                  <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Visibility">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                    </ObjectAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
                <VisualState x:Name="Unchecked" />
                <VisualState x:Name="Indeterminate">
                  <Storyboard>
                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="NormalRectangle" Storyboard.TargetProperty="Visibility">
                      <DiscreteObjectKeyFrame KeyTime="0" Value="Visible" />
                    </ObjectAnimationUsingKeyFrames>
                  </Storyboard>
                </VisualState>
              </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid x:Name="Grid" Margin="{ThemeResource PhoneTouchTargetLargeOverhang}">
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="25.5" />
                <ColumnDefinition Width="*" />
              </Grid.ColumnDefinitions>
              <Grid Grid.Column="0" VerticalAlignment="Top">
                <Border x:Name="CheckBackground"
                        IsHitTestVisible="False"
                        VerticalAlignment="Center"
                        HorizontalAlignment="Left"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Height="25.5"
                        Width="25.5" />
                <Rectangle x:Name="NormalRectangle"
                           IsHitTestVisible="False"
                           Width="13"
                           Height="13"
                           HorizontalAlignment="Center"
                           VerticalAlignment="Center"
                           Fill="{ThemeResource CheckBoxBackgroundThemeBrush}"
                           Visibility="Collapsed" />
                <Path x:Name="CheckGlyph"
                      IsHitTestVisible="False"
                      Visibility="Collapsed"
                      Width="18.5"
                      Height="17"
                      Stretch="Fill"
                      HorizontalAlignment="Center"
                      VerticalAlignment="Center"
                      Fill="{ThemeResource CheckBoxForegroundThemeBrush}"
                      Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                      StrokeLineJoin="Round"
                      StrokeThickness="2.5"
                      FlowDirection="LeftToRight" />
              </Grid>
              <ContentPresenter x:Name="ContentPresenter"
                                Grid.Column="1" Content="{TemplateBinding Content}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Foreground="{TemplateBinding Foreground}"
                                FontFamily="{ThemeResource PhoneFontFamilyNormal}"
                                FontSize="{ThemeResource TextStyleLargeFontSize}"
                                FontWeight="Normal"
                                AutomationProperties.AccessibilityView="Raw" />
            </Grid>
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

要将颜色更改为黑色,您需要将Fill CheckGlyph元素的Path属性从CheckBoxForegroundThemeBrush更改为其他值。或者您可以完全更改CheckBox控件的视觉外观。你可以自己试验。

另一种方法是通过将以下资源添加到App.xaml

来覆盖以下任何资源
  <SolidColorBrush x:Key="CheckBoxBorderThemeBrush" Color="Black" />
  <SolidColorBrush x:Key="CheckBoxContentDisabledForegroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxContentForegroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxDisabledBorderThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxDisabledForegroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxForegroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPointerOverBackgroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPointerOverForegroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPointerOverBorderThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPressedBackgroundThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPressedBorderThemeBrush" />
  <SolidColorBrush x:Key="CheckBoxPressedForegroundThemeBrush" />

他们将改变的意义是自我描述,他们需要具有完全相同的名称。

您的App.xaml可能如下所示:

<Application
x:Class="MyApp"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
RequestedTheme="Light">

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.ThemeDictionaries>
            <!-- Overriden theme resources -->
            <ResourceDictionary x:Key="Light">
                <SolidColorBrush x:Key="CheckBoxBorderThemeBrush" Color="Black" />
            </ResourceDictionary>
            <ResourceDictionary x:Key="Dark">
                <SolidColorBrush x:Key="CheckBoxBorderThemeBrush" Color="White" />
            </ResourceDictionary>
        </ResourceDictionary.ThemeDictionaries>

        <ResourceDictionary.MergedDictionaries>
            <!-- Other resources -->
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

对于TimePicker,默认样式如下:

<Style TargetType="TimePicker">
    <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" />
    <Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" />
    <Setter Property="Foreground" Value="{ThemeResource TimePickerForegroundThemeBrush}" />
    <Setter Property="HorizontalAlignment" Value="Stretch" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="TimePicker">
                <StackPanel Margin="{TemplateBinding Padding}" x:Name="LayoutRoot">
                    <ContentPresenter x:Name="HeaderContentPresenter" Style="{StaticResource HeaderContentPresenterStyle}" Margin="0,0,0,-3"
                        Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" />
                    <Button x:Name="FlyoutButton"
            Foreground="{TemplateBinding Foreground}"
            BorderBrush="{TemplateBinding Foreground}"
            BorderThickness="2.5"
            Padding="6.5,0,0,3"
            IsEnabled="{TemplateBinding IsEnabled}"
            HorizontalAlignment="Stretch"
            HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" />
                </StackPanel>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

因此,TimePicker标题颜色的解决方案是创建新的TimePicker样式,并设置Foreground元素的HeaderContentPresenter,或者您可以更改HeaderTemplate的{​​{1}}没有创建新样式:

TimePicker

<TimePicker Foreground="Black">
    <TimePicker.Header>
        <TextBlock Text="Header Text Example" Foreground="Black">
    </TimePicker.Header>
</TimePicker>