Databases
StackOverflow2013
Postsdbo
POWPF Encapsulate rectangle with StaticResource as fill to a CustomControl in WPF
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWPF Encapsulate rectangle with StaticResource as fill to a CustomControl in WPF
    text
    copied!<p>I am using ModernUIIcons that come with MahApps.Metro in a Xaml file as StaticResources. To put one in my UI is very easy, like this:</p> <pre><code>&lt;Rectangle Width="19" Height="19"&gt; &lt;Rectangle.Fill&gt; &lt;VisualBrush Visual="{StaticResource appbar_database}" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; </code></pre> <p>I want to encapsulate all the logic of the rectangle in a CustomControl so I can do something like the following:</p> <pre><code>&lt;cc:MenuItemIcon Source="{StaticResource appbar_page}"/&gt; </code></pre> <p><strong>This is what I got so far:</strong></p> <p>In one project as library, Themes/Generic.xaml:</p> <pre><code>&lt;ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="clr-namespace:AMIGEDM.CustomControls.Menu"&gt; &lt;Style TargetType="{x:Type local:MenuItemIcon}"&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="{x:Type local:MenuItemIcon}"&gt; &lt;Rectangle Width="19" Height="19"&gt; &lt;Rectangle.Fill&gt; &lt;VisualBrush Visual="{TemplateBinding Source}" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;/ResourceDictionary&gt; </code></pre> <p>And in the CS file</p> <pre><code>namespace AMIGEDM.CustomControls.Menu { public class MenuItemIcon : Control { static MenuItemIcon() { DefaultStyleKeyProperty.OverrideMetadata(typeof(MenuItemIcon), new FrameworkPropertyMetadata(typeof(MenuItemIcon))); } public static readonly DependencyProperty SourceProperty = DependencyProperty.Register("Source", typeof(Visual), typeof(MenuItemIcon)); public Visual Source { get { return (Visual)GetValue(SourceProperty); } set { SetValue(SourceProperty, value); } } } } </code></pre> <p>Everything compiles silky smooth, so I go to my TestDummy Project</p> <pre><code>&lt;Window x:Class="AMIGEDM.TestDummy.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525" xmlns:cc="clr-namespace:AMIGEDM.CustomControls.Menu;assembly=AMIGEDM.CustomControls"&gt; &lt;Window.Resources&gt; &lt;ResourceDictionary&gt; &lt;ResourceDictionary.MergedDictionaries&gt; &lt;ResourceDictionary Source="/AMIGEDM.TestDummy;component/Resources/Icons.xaml"/&gt; &lt;ResourceDictionary Source="pack://application:,,,/AMIGEDM.CustomControls;component/Themes/Generic.xaml" /&gt; &lt;/ResourceDictionary.MergedDictionaries&gt; &lt;/ResourceDictionary&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;Menu IsMainMenu="True" SnapsToDevicePixels="True"&gt; &lt;MenuItem Header="_Open"&gt; &lt;MenuItem Header="_File"&gt; &lt;MenuItem.Icon&gt; &lt;cc:MenuItemIcon Source="{StaticResource appbar_page}"/&gt; &lt;/MenuItem.Icon&gt; &lt;/MenuItem&gt; &lt;MenuItem Header="_File"&gt; &lt;MenuItem.Icon&gt; &lt;Rectangle Width="19" Height="19"&gt; &lt;Rectangle.Fill&gt; &lt;VisualBrush Visual="{StaticResource appbar_database}" /&gt; &lt;/Rectangle.Fill&gt; &lt;/Rectangle&gt; &lt;/MenuItem.Icon&gt; &lt;/MenuItem&gt; &lt;/MenuItem&gt; &lt;/Menu&gt; &lt;/Grid&gt; </code></pre> <p></p> <p><strong>The Library puts the Icon using the Rectangle, Rectangle Fill and VisualBrush, but when I try to use the CustomControl it shows nothing</strong> </p> <p><img src="https://i.stack.imgur.com/bNWNP.png" alt="As you see, the icon appears using the complete rectangle but not with my custom control"></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload