在Resources中创建一个控件,并在XAML WPF中重用它

时间:2014-04-09 10:47:48

标签: wpf xaml resources

我只是尝试创建一个简单的符号/几何/控件,并在同一窗口的多个位置更改和重用它。

示例:中间有圆圈的黑色方块。

然后圆圈应在红色和绿色之间变换(类似于单光红绿灯)。使用图像可以实现。我尝试将其解析为Window资源,但我不会解开它。

这个想法:我将它写入资源,在这里我尝试使用Canvas:

<Window.Resources>
    <Canvas x:Key="Ampel">
        <Rectangle Fill="Black" HorizontalAlignment="Left" Height="52" Stroke="Black"       VerticalAlignment="Top" Width="50"/>
        <Ellipse x:Name="RedGreen" Fill="Red" HorizontalAlignment="Left" Height="27" Margin="11,12,0,0" Stroke="Black" VerticalAlignment="Top" Width="28" RenderTransformOrigin="0.214,0.256"/>
    </Canvas>
</Window.Resources>

然后我想将它放在网格或面板中,但我该如何引用它?

<Canvas x:Name="RedGreen1" Height="50" Width="50" DataContext="{DynamicResource Ampel}" /> 

这不会返回编译器错误,但在窗口中不显示任何内容。它也不适用于WrapPanel或其他任何东西。

如果它可以工作,我怎么能在代码behing中引用它来改变圆的颜色。像RedGreen1.RedGreen.Fill=Brushes.Green

这样的东西

我阅读了关于红绿灯的文章。是否真的有必要创建一个UserControl,还是有办法用window.resources来解决它?

应用程序的一般概念是拥有一个参数列表。每个输入正确的都标记为绿色,只有所有参数都标记为绿色才能启动计算。

即使我使用红色/绿色图像运行它,我也会尝试更好地理解WPF / XAML并学习一些东西。

谢谢。

3 个答案:

答案 0 :(得分:23)

Resources中定义任意控件时,您可以在将来使用它,它具有属性Content并派生自Control类。这些是以下内容:ContentControlLabelContentPresenter等。

如果你想在许多控件中使用这个资源,你必须为资源设置x:Shared="False",因为默认情况下x:Shared="True"然后一个资源对所有人都是通用的 - 在这种情况下,系统发誓重复的内容。当x:Shared="False"何时为每个元素的请求创建资源时。引自MSDN

  

设置为 false 时,修改WPF资源检索行为,以便对属性资源的请求为每个请求创建一个新实例,而不是为所有请求共享同一个实例。

示例:

<Window.Resources>
    <Canvas x:Key="Ampel" x:Shared="False">
        <Rectangle Fill="Black" HorizontalAlignment="Left" Height="52" Stroke="Black" VerticalAlignment="Top" Width="50"/>
        <Ellipse x:Name="RedGreen" Fill="Red" HorizontalAlignment="Left" Height="27" Margin="11,12,0,0" Stroke="Black" VerticalAlignment="Top" Width="28" />
    </Canvas>
</Window.Resources>

<Grid>
    <ContentControl Name="MyContentControl" Content="{StaticResource Ampel}" HorizontalAlignment="Left" />        
    <Label Name="MyLabel" Content="{StaticResource Ampel}" HorizontalAlignment="Center" />
    <ContentPresenter Name="MyContentPresenter" Content="{StaticResource Ampel}" HorizontalAlignment="Center" VerticalAlignment="Center" />
</Grid>

要在代码隐藏中更改Ellipse的Fill,您可以这样:

private void ChangeBackground_Click(object sender, RoutedEventArgs e)
{
    var canvas = MyContentControl.Content as Canvas;

    if (canvas != null)
    {
        foreach (var item in canvas.Children)
        {
            if (item is Ellipse)
            {
                ((Ellipse)item).Fill = Brushes.Green;
            }
        }
    }
}

答案 1 :(得分:4)

canvas没有模板属性,这就是我们在这里使用contentcontrol的原因。

<Window.Resources>
    <ControlTemplate x:Key="Ampel" TargetType="ContentControl">
        <Canvas>
            <Rectangle Fill="Black" HorizontalAlignment="Left" Height="52" Stroke="Black" VerticalAlignment="Top" Width="50"/>
            <Ellipse x:Name="RedGreen" Fill="{Binding Path=Tag, RelativeSource={RelativeSource TemplatedParent}}" HorizontalAlignment="Left" Height="27" Margin="11,12,0,0" Stroke="Black" VerticalAlignment="Top" Width="28" RenderTransformOrigin="0.214,0.256"/>
        </Canvas>
    </ControlTemplate>
</Window.Resources >

<ContentControl  Template="{StaticResource Ampel}" Tag="Red" ></ContentControl>
<ContentControl  Template="{StaticResource Ampel}" Tag="Green" ></ContentControl>
<ContentControl  Template="{StaticResource Ampel}" Tag="Blue" ></ContentControl>

<强>输出

enter image description here

答案 2 :(得分:-1)

您可以使用遗产的C#代码:

public class customBottum : Buttom
{
        int var1;
        bool var2;

        public customBottum()
        {
            InitializeComponent();
        }

        other function ...
}