sidebar with materialIcons - wpf

Question

I have a custom control, that I mad, for hosting the name, and icon of the panel, and made triggers, so it will change colors when I hover the icon or select it
public class NavButton : ListBoxItem {
static NavButton() {
DefaultStyleKeyProperty.OverrideMetadata(typeof(NavButton),
new FrameworkPropertyMetadata(typeof(NavButton)));
}
public Uri NavLink {
get { return (Uri)GetValue(NavLinkProperty); }
set { SetValue(NavLinkProperty, value); }
}
// This property will hold specifics on where to navigate within our appreciation
public static readonly DependencyProperty NavLinkProperty =
DependencyProperty.Register(
"NavLink", typeof(Uri),
typeof(NavButton),
new PropertyMetadata(null));
// This property will hold specifics on the icon
public Label Icon {
get { return (Label)GetValue(IconProperty); }
set { SetValue(IconProperty, value); }
}
// Using a DependencyProperty as the backing store for Icon. This enables animation, styling, binding, etc...
public static readonly DependencyProperty IconProperty =
DependencyProperty.Register("Icon",
typeof(Label),
typeof(NavButton),
new PropertyMetadata(null));
The problem is, that whenever I call this control in my main, I always get this error
I am calling it like this
<custom:NavButton
Padding="6"
FontFamily="{StaticResource Material}"
Icon="{x:Static fonts:IconFont.VolumeHigh}"/>
And this is the recourse dictionary for the label
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<FontFamily x:Key="Material">/Fonts/Material.ttf#Material Design Icons</FontFamily>
</ResourceDictionary>
<Style TargetType="{x:Type local:NavButton}">
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type local:NavButton}">
<Border
x:Name="back"
Padding="{TemplateBinding Padding}"
Background="Transparent"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="8">
<Label
x:Name="icon"
Content="{TemplateBinding Icon}"
FontFamily="{StaticResource Material}"
FontSize="48"
Foreground="#7b8793" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="back" Property="Background" Value="#d0ebff" />
<Setter TargetName="icon" Property="Foreground" Value="#2a84f1" />
</Trigger>
<Trigger Property="IsSelected" Value="True">
<Setter TargetName="back" Property="Background" Value="#d0ebff" />
<Setter TargetName="icon" Property="Foreground" Value="#2a84f1" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>

Answer 1

error message clearly says, that you have a type mismatch. Icon DP should not have type Label. it should have the same type as IconFont.VolumeHigh. or it could simple be object:
// This property will hold specifics on the icon
public object Icon {
get { return (Label)GetValue(IconProperty); }
set { SetValue(IconProperty, value); }
}
// Using a DependencyProperty as the backing store for Icon. This enables animation, styling, binding, etc...
public static readonly DependencyProperty IconProperty =
DependencyProperty.Register("Icon",
typeof(object),
typeof(NavButton),
new PropertyMetadata(null));