覆蓋ThemeResource特定控制

我想集中的時候建立一個透明的文本框，沒有背景的顏色（默認是白色，或SystemControlBackgroundChromeWhiteBrush）。我明白，我可以覆蓋使用的顏色在App.xaml中像這樣：（使用多個ThemeDictionaries或）覆蓋ThemeResource特定控制

<Application.Resources> 
    <SolidColorBrush x:Key="SystemControlBackgroundChromeWhiteBrush">Transparent</SolidColorBrush> 
</Application.Resources>

但是我不想修改所有的TextBlocks，但只有特定的人。我的第一個猜測是將更改後的畫筆包含在TextBlock的資源中，但這不起作用。

來源

2015-10-26 Dominik Weber

您可以修改默認樣式的控制。 HERE是文章如何找到它。文本框的

獲取樣式，將它插入在XAML資源和修改，如：

<!-- Default style for Windows.UI.Xaml.Controls.TextBox --> 
<Style TargetType="TextBox"> 
<Setter Property="MinWidth" Value="{ThemeResource TextControlThemeMinWidth}" /> 
<Setter Property="MinHeight" Value="{ThemeResource TextControlThemeMinHeight}" /> 
<Setter Property="Foreground" Value="{ThemeResource TextBoxForegroundThemeBrush}" /> 
<Setter Property="SelectionHighlightColor" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" /> 
<Setter Property="Background" Value="{ThemeResource TextBoxBackgroundThemeBrush}" /> 
<Setter Property="BorderBrush" Value="{ThemeResource TextBoxBorderThemeBrush}" /> 
<Setter Property="BorderThickness" Value="{ThemeResource TextControlBorderThemeThickness}" /> 
<Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}" /> 
<Setter Property="FontSize" Value="{ThemeResource ContentControlFontSize}" /> 
<Setter Property="TextWrapping" Value="NoWrap" /> 
<Setter Property="ScrollViewer.HorizontalScrollMode" Value="Auto" /> 
<Setter Property="ScrollViewer.VerticalScrollMode" Value="Auto" /> 
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Hidden" /> 
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Hidden" /> 
<Setter Property="ScrollViewer.IsDeferredScrollingEnabled" Value="False" /> 
<Setter Property="Padding" Value="{ThemeResource TextControlThemePadding}" /> 
<Setter Property="Margin" Value="{ThemeResource TextControlMarginThemeThickness}" /> 
<Setter Property="VerticalAlignment" Value="Top" /> 
<Setter Property="Template"> 
    <Setter.Value> 
    <ControlTemplate TargetType="TextBox"> 
     <Grid Background="Transparent"> 
     <VisualStateManager.VisualStateGroups> 
      <VisualStateGroup x:Name="CommonStates"> 
      <VisualState x:Name="Disabled"> 
       <Storyboard> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledBackgroundThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledBorderThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentElement" Storyboard.TargetProperty="Foreground"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Foreground"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter" Storyboard.TargetProperty="Foreground"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxDisabledHeaderForegroundThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       </Storyboard> 
      </VisualState> 
      <VisualState x:Name="Normal"> 
       <Storyboard> 
       <DoubleAnimation Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Opacity" Duration="0" 
           To="{ThemeResource TextControlBorderThemeOpacity}" /> 
       </Storyboard> 
      </VisualState> 
      <VisualState x:Name="Focused"> 
       <Storyboard> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="BorderBrush"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       <DoubleAnimation Storyboard.TargetName="PlaceholderTextContentPresenter" Storyboard.TargetProperty="Opacity" Duration="0" To="0" /> 
       <ObjectAnimationUsingKeyFrames Storyboard.TargetName="BorderElement" Storyboard.TargetProperty="Background"> 
        <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource TextBoxFocusedBackgroundThemeBrush}" /> 
       </ObjectAnimationUsingKeyFrames> 
       </Storyboard> 
      </VisualState> 
      </VisualStateGroup> 
     </VisualStateManager.VisualStateGroups> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 
     <Border x:Name="BorderElement" Grid.Row="1" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" /> 
     <ContentPresenter x:Name="HeaderContentPresenter" Grid.Row="0" Style="{StaticResource HeaderContentPresenterStyle}" Margin="{ThemeResource TextControlHeaderMarginThemeThickness}" 
          Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" /> 
     <ScrollViewer x:Name="ContentElement" Grid.Row="1" MinHeight="{ThemeResource TextControlThemeMinHeight}" 
         HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" 
         HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" 
         VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" 
         VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" 
         IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" 
         IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" 
         IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" Margin="{TemplateBinding BorderThickness}" 
         Padding="{TemplateBinding Padding}" IsTabStop="False" ZoomMode="Disabled" 
         AutomationProperties.AccessibilityView="Raw"/> 
     <ContentControl x:Name="PlaceholderTextContentPresenter" Grid.Row="1" Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}" 
         FontSize="{ThemeResource ContentControlFontSize}" Margin="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}" 
         IsTabStop="False" Content="{TemplateBinding PlaceholderText}" /> 
     </Grid> 
    </ControlTemplate> 
    </Setter.Value> 
</Setter>

接下來，添加名字改裝風格：

<Style x:Name="CustomTextBlock" TargetType="TextBox">

並申請它的控制，如：

<TextBlock Style="{StaticResource CustomTextBlock}"/>

下面是透明的文本框（WinRT的/通用應用程序）的樣本樣式：

<Style x:Key="TransparentTextBox" 
      TargetType="TextBox"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="TextBox"> 
        <Grid Background="Transparent"> 
         <Grid.RowDefinitions> 
          <RowDefinition Height="Auto" /> 
          <RowDefinition Height="*" /> 
         </Grid.RowDefinitions> 
         <VisualStateManager.VisualStateGroups> 
          <VisualStateGroup x:Name="CommonStates"> 
           <VisualState x:Name="Disabled"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" 
                     Storyboard.TargetName="BorderElement"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{ThemeResource TextBoxDisabledBorderThemeBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" 
                     Storyboard.TargetName="ContentElement"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" 
                     Storyboard.TargetName="PlaceholderTextContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{ThemeResource TextBoxDisabledForegroundThemeBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" 
                     Storyboard.TargetName="HeaderContentPresenter"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{ThemeResource TextBoxDisabledHeaderForegroundThemeBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Normal"> 
            <Storyboard> 
             <DoubleAnimation Duration="0" 
                 To="{ThemeResource TextControlBorderThemeOpacity}" 
                 Storyboard.TargetProperty="Opacity" 
                 Storyboard.TargetName="BorderElement" /> 
            </Storyboard> 
           </VisualState> 
           <VisualState x:Name="Focused"> 
            <Storyboard> 
             <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" 
                     Storyboard.TargetName="BorderElement"> 
              <DiscreteObjectKeyFrame KeyTime="0" 
                    Value="{ThemeResource TextSelectionHighlightColorThemeBrush}" /> 
             </ObjectAnimationUsingKeyFrames> 
             <DoubleAnimation Duration="0" 
                 To="0" 
                 Storyboard.TargetProperty="Opacity" 
                 Storyboard.TargetName="PlaceholderTextContentPresenter" /> 
            </Storyboard> 
           </VisualState> 
          </VisualStateGroup> 
         </VisualStateManager.VisualStateGroups> 
         <Border x:Name="BorderElement" 
           BorderBrush="{TemplateBinding BorderBrush}" 
           BorderThickness="{TemplateBinding BorderThickness}" 
           Grid.Row="1" /> 
         <ContentPresenter x:Name="HeaderContentPresenter" 
              ContentTemplate="{TemplateBinding HeaderTemplate}" 
              Content="{TemplateBinding Header}" 
              Margin="{ThemeResource TextControlHeaderMarginThemeThickness}" 
              Grid.Row="0" 
              Style="{StaticResource HeaderContentPresenterStyle}" /> 
         <ScrollViewer x:Name="ContentElement" 
             AutomationProperties.AccessibilityView="Raw" 
             HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}" 
             HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}" 
             IsTabStop="False" 
             IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}" 
             IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}" 
             IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}" 
             Margin="{TemplateBinding BorderThickness}" 
             MinHeight="{ThemeResource TextControlThemeMinHeight}" 
             Padding="{TemplateBinding Padding}" 
             Grid.Row="1" 
             VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}" 
             VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}" 
             ZoomMode="Disabled" /> 
         <ContentControl x:Name="PlaceholderTextContentPresenter" 
             Content="{TemplateBinding PlaceholderText}" 
             Foreground="{ThemeResource TextBoxPlaceholderTextThemeBrush}" 
             FontSize="{ThemeResource ContentControlFontSize}" 
             IsTabStop="False" 
             Margin="{TemplateBinding BorderThickness}" 
             Padding="{TemplateBinding Padding}" 
             Grid.Row="1" /> 
        </Grid> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style>

此外，還可以使用混合（工具與Visual Studio安裝），修改的控制更容易。HERE是微軟虛擬學院樣品教程如何在VS2013中使用它。

來源

2015-10-26 18:19:37 marcinax

感謝您的答覆，我希望我沒有複製整個默認樣式只是改變這種輕微的財產：/ –

恐怕是不可能的，以改變單一的財產集中控制的背景下，因爲文本框有很多州（如你所見）。在_Focused_狀態下設置透明度的最簡單方法是修改默認樣式。你可以把它放到不同的文件_Resource Dictionary_中並隨時使用。我與透明度，你可以申請所需文本框添加文本框編輯我的答案。 – marcinax

您可以使用樣式很像CSS，並將它們只適用於相關的控制：

<Style x:Key="TransparentTextBox" TargetType="{x:Type TextBox}"> 
     <Setter Property="Background" Value="Transparent" /> 
</Style>

，然後在控制引用您要使用的樣式：

<TextBox Style="{StaticResource TransparentTextBox}" />

希望這有助於。

來源

2015-10-26 18:16:42

我想，如果有需要改變，只有當控制集中的背景是不夠的。可能有必要修改特定的控制狀態（正如我在下面以更長的回答描述的那樣）。 – marcinax

這不起作用。我使用的背景取其值與白色覆蓋的情況下控制獲得焦點。 –

覆蓋ThemeResource特定控制

回答

相關問題