首页 > 解决方案 > 无论背景属性如何,WPF UserControl 都是透明的

问题描述

我想制作一个具有透明背景的控件,但我希望 Background 属性定义一些内部控件背景。这样我就可以使用背景属性。

通常我只是将背景绑定到 UserControl 背景。但是,无论 Background 属性如何,如何让整个控件背景透明。

<UserControl 
x:Class="HLab.Base.DateEx"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:base="clr-namespace:HLab.Base"
mc:Ignorable="d" Background="Transparent">
<UserControl.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Calendar.xaml"/>
        </ResourceDictionary.MergedDictionaries>

        <Style TargetType="base:NumTextBox">
            <Setter Property="HorizontalAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="BorderBrush" Value="#80000000"/>

        </Style>
        <Style TargetType="Label">
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="HorizontalAlignment" Value="Center"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
        </Style>
    </ResourceDictionary>

</UserControl.Resources>
<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="2*"/>
        <ColumnDefinition Width="Auto"/>
    </Grid.ColumnDefinitions>
    <Grid Grid.Column="1">
        <base:NumTextBox 
            x:Name="TextDay"
            MinValue="0"
            MaxValue="31"
            Background="{Binding RelativeSource={RelativeSource AncestorType=UserControl}, Path=Background, Mode=OneWay}"
            ValueChanged="OnValueChange"
        /><Popup 
            Name="Popup" 
            StaysOpen="False">
            <Calendar 
                Name="Calendar" 
                SelectedDatesChanged="Calendar_OnSelectedDatesChanged"/>
        </Popup>
    </Grid>

    <base:NumTextBox 
        Margin ="3,0,0,0"
        Background="{Binding RelativeSource={RelativeSource AncestorType=UserControl}, Path=Background, Mode=OneWay}"
        x:Name="TextMonth" 
        Grid.Column="2"
        MinValue="0"
        MaxValue="12"
        ValueChanged="OnValueChange"
        />

    <base:NumTextBox 
        Margin ="3,0,0,0"
        Background="{Binding RelativeSource={RelativeSource AncestorType=UserControl}, Path=Background, Mode=OneWay}"
        x:Name="TextYear" 
        Grid.Column="3"
        MinValue="0"
        MaxValue="9999"
        HorizontalContentAlignment="Center"
        ValueChanged="OnValueChange"
        />

    <Button 
        Margin ="3,0,0,0"
        HorizontalAlignment="Left"
        Grid.Column="4"
        Name="Button" 
        Width="15"
        Click="Button_OnClick"
        Background="Transparent">
        <Button.Template>
            <ControlTemplate TargetType="Button">
                <Grid Background="Transparent">
                    <ContentControl Content="{StaticResource Calendar}"/>
                </Grid>
           </ControlTemplate>
        </Button.Template>
    </Button>
    <Border  
        x:Name="Mandatory" 
        Grid.Row="0" 
        Grid.Column="1"  
        Visibility="Collapsed" 
        Grid.ColumnSpan="3" Background="#10FF0010" IsHitTestVisible="False" BorderThickness="1" Opacity="0.5" BorderBrush="DarkRed"/>
        <ContentControl x:Name="IconMandatory" 
            Grid.Row="0" Visibility="Collapsed" 
            Grid.Column="0"  
            Margin="5,0,0,0" 
            IsHitTestVisible="False" 
            Content="{StaticResource Edit}" Foreground="DarkRed" Height="15"/>
</Grid>

如果我使用它:

<DateEx Background="Red"/>

我希望按钮不要获得红色背景,而只有 NumTextBoxes。

标签: c#wpf

解决方案


如果你想改变这样的东西,你必须修改ControlTemplate你的控件。

UserControl通常在您只有一堆现有控件想要通过一些逻辑组合在一起时使用。但是当您需要更多的可定制性时,您需要所谓的“自定义控件”。“自定义控件”直接继承自Control(而不是UserControl),并要求您Style使用ControlTemplate.

完整的官方文档在这里:控制创作概述。那里有很多,但也许您可以挑选出您真正需要的信息和示例。
对于更简单的演练还有这个:WPF - 自定义控件 - 教程点(向下滚动到“自定义控件”标题)。


推荐阅读