Develop Reference

WPF: Can't change property of custom control inside other control template (+Pictures)

Let's create an empty WPF project.
Add a very simple UserControl (i named it MyUserControl):
<UserControl x:Class="Delete_This_Test.MyUserControl"
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"
mc:Ignorable="d"
Background="Red"
Height="100">
<Grid>
</Grid>
</UserControl>
As you can see, i have changed only 2 properties: Background and Height to "Red" and "100".
Put our created control in MainWindow:
<Window x:Class="Delete_This_Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Delete_This_Test"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<local:MyUserControl Width="100"
Height="200"
Background="Blue">
</local:MyUserControl>
</Grid>
</Window>
Here, i have changed Width, Height and Background to "100", "200" and "Blue".
And it works: Without ControlTemplate Picture
But if we put MyUserControl in some ControlTemplate, for example of Button:
<Window x:Class="Delete_This_Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Delete_This_Test"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Button>
<Button.Template>
<ControlTemplate TargetType="Button">
<local:MyUserControl Width="100"
Height="200"
Background="Blue">
</local:MyUserControl>
</ControlTemplate>
</Button.Template>
</Button>
</Grid>
</Window>
This will not work. Only Width property will changed, because we didn't set it in MyUserControl xaml.
Height and Background will be the same as "100" and "Red":
With ControlTemplate Picture
So my question is: Is it bug of WPF, or i'm missing something obvious?
*
Because i need to use one custom control in different templates, and change some properties, e.g. Background of control

How to get Drop Shadow Effect on Metrowindow WPF

I am using a Metrowindow as my main Window.xaml for my application. However, after trying different results from Google I still can't manage to get my window to drop a shadow effect.
My Code:
Window.xaml
<Metro:MetroWindow x:Class="ROGERS.Windows.Window"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ROGERS.Windows"
xmlns:ViewModels="clr-namespace:ROGERS.Windows.ViewModels"
xmlns:Views="clr-namespace:ROGERS.Windows.Views"
xmlns:Metro="http://metro.mahapps.com/winfx/xaml/controls"
xmlns:MetroIcons="http://metro.mahapps.com/winfx/xaml/iconpacks"
mc:Ignorable="d"
TitleAlignment="Center"
TitlebarHeight="26"
Height="800"
Width="1440"
ShowIconOnTitleBar="False"
WindowStartupLocation="CenterScreen"
WindowTitleBrush= "#0c3868"
BorderBrush="#0c3868"
WindowStyle="None"
BorderThickness="1"
AllowsTransparency="False"
Closing="MetroWindow_Closing">
<Metro:MetroWindow.Effect>
<DropShadowEffect Color="Black" BlurRadius="20" Direction="90" RenderingBias="Quality" ShadowDepth="3"/>
</Metro:MetroWindow.Effect>
<Metro:MetroWindow.DataContext>
<ViewModels:WindowViewModel />
</Metro:MetroWindow.DataContext>
<Frame Source="Views/ReportGenerator.xaml" x:Name="ReportGeneratorFrame" />
</Metro:MetroWindow>
Anyone knows how to get the effect?

The docs for MetroWindow explain how to do it using the GlowBrush property.
https://mahapps.com/docs/controls/metrowindow

How to remove border when WindowStyle="None" AllowsTransparency=“False” and ResizeMode="CanResize"

I have a window with the following properties
WindowState="Maximized"
WindowStyle="None,
AllowsTransparency="False"
ResizeMode="CanResize"
But the problem is a border appears around the window.
How can I fix it without changing any of these properties
When I set AllowsTransparency True some user controls such as PdfViewer,WebBrowser not displaying contents.
<Window x:Class="WpfApplication8.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None"
WindowState="Maximized"
AllowsTransparency="False"
ResizeMode="CanResize"
UseLayoutRounding="True"
Title="MainWindow">
<Grid Background="Red"></Grid>
</Window>

You could use a WindowChrome:
<Window x:Class="WpfApplication8.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None"
AllowsTransparency="False"
ResizeMode="CanResize"
UseLayoutRounding="True"
Title="MainWindow">
<WindowChrome.WindowChrome>
<WindowChrome CaptionHeight="0" ResizeBorderThickness="5" />
</WindowChrome.WindowChrome>
<Grid Background="Red"></Grid>
</Window>

WPF how to stop DropShadowEffect to propagate to child?

I have a borderless Window with a Border as root node and Canvas as child.
The canvas is used to draw Polyline by MouseMove.
The border have a DropShadowEffect and this cause a significant drop of performance to draw on Canvas.
I have already seen that some others post suggest to put the Border and Canvas in 2 separate Grid, but this will not work for my case since if I put the Border inside a Grid I lose the shadow effect around the Window.
There is another way to prevent the propagation of the Effect?
This is the xaml code:
<Window x:Class="Test.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:Test"
mc:Ignorable="d"
Title="Test"
Height="600" Width="1000"
Background="{x:Null}"
BorderThickness="0"
BorderBrush="Black"
AllowsTransparency="True"
WindowStyle="None">
<WindowChrome.WindowChrome>
<WindowChrome
CaptionHeight="0"
ResizeBorderThickness="5,5,20,20"/>
</WindowChrome.WindowChrome>
<Border x:Name="borderShadow" Margin="0,0,15,15" BorderThickness="2,1" BorderBrush="Black" Background="#FF355870">
<Border.Effect>
<DropShadowEffect Color="Black"
Direction="315"
BlurRadius="15"
ShadowDepth="10"/>
</Border.Effect>
<Grid Background="#FF355870">
<Canvas x:Name="canvasBoard" Background="#00000000" MouseMove="canvasBoard_MouseMove" MouseDown="canvasBoard_MouseDown" MouseUp="canvasBoard_MouseUp"/>
</Grid>
</Border>
</Window>

You can put the Border alone inside a Grid in this way:
<Grid>
<Border x:Name="borderShadow" Margin="0,0,15,15" BorderThickness="2,1" BorderBrush="Black" Background="#FF355870">
<Border.Effect>
<DropShadowEffect Color="Black"
Direction="315"
BlurRadius="15"
ShadowDepth="10"/>
</Border.Effect>
</Border>
<Grid Background="#FF355870">
<Canvas x:Name="canvasBoard" Background="#00000000" MouseMove="canvasBoard_MouseMove" MouseDown="canvasBoard_MouseDown" MouseUp="canvasBoard_MouseUp"/>
</Grid>
</Grid>

WPF page content not setting to window's size

I made a WPF application in which. I placed a rectangle. The page is covering whole window but the size(width) of rectangle is not equal to the page.
here is the pic.
here is the source code of my application:
<Page x:Class="TestWpfApplication.Page1"
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:local="clr-namespace:TestWpfApplication"
mc:Ignorable="d"
d:DesignHeight="350" d:DesignWidth="525"
Title="Page1" Background="#FF7ACBBC" ShowsNavigationUI="False">
<Grid>
<Rectangle Fill="#FFF4F4F5" HorizontalAlignment="Left" Height="100" Stroke="Black" VerticalAlignment="Top" Width="525"/>
<Label x:Name="label" Content="Heading" HorizontalAlignment="Left" Margin="222.006,25,0,0" VerticalAlignment="Top" FontFamily="Tahoma" FontSize="22"/>
<TextBlock x:Name="textBlock" HorizontalAlignment="Left" Margin="160,155,0,0" TextWrapping="Wrap" Text="And rest of the content goes here" VerticalAlignment="Top" FontFamily="Tahoma" FontSize="14"/>
</Grid>
And
<Window x:Class="TestWpfApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:TestWpfApplication"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<local:Page1/>
</Grid>
At last App.xaml
<Application x:Class="TestWpfApplication.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TestWpfApplication"
StartupUri="page1.xaml">
<Application.Resources>
</Application.Resources>
Please help me....

Set SizeToContent Property of Window to SizeToContent="WidthAndHeight"
SizeToContent

Page1.Xaml.cs:
public Page1()
{
InitializeComponent();
this.SizeToContent = SizeToContent.WidthAndHeight;
}
For more Info, See Window.SizeToContent Property

I don't know why you specified size parameters for rectangle and expect it to fit your page's size. Just remove all these parameters and it will stretch.
<Rectangle Fill="#FFF4F4F5"/>