Adding a WPF UserControl programmatically has no style

Question

I'm trying to create a button-like UserControl which consists of a border and a label. When adding this UserControl directly in the XAML of MainWindow, it renders correctly (it is put in a WrapPanel), but if I add it programmatically it doesn't look the same at all. There is no border, no background color, the text size of the label is wrong and so is the text color.

This is my user control:

<UserControl x:Class="Jishi.SonosPartyMode.UserControls.Player"
             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" 
             d:DesignHeight="150" d:DesignWidth="300"
             Width="200"
             Height="100">
    <Border BorderBrush="#086EAA" CornerRadius="8,8,8,8"  BorderThickness="4" Margin="15" Padding="15px" VerticalAlignment="Center" Background="#0A4069">
        <Label Name="PlayerName" TextElement.Foreground="White" TextElement.FontSize="20px">asdasdasd</Label>
    </Border>
</UserControl>

when adding it, I just invoke it like this:

var button = new Player { Content = player.Properties.RoomName, DataContext = player.Properties.UDN };
PlayerList.Children.Add( button );

PlayerList is the actual WrapPanel and Player is my UserControl. I have tried finding information regarding this, but I don't find anything. If you have another approach that I can take, please come with suggestions. All I want is a clickable area with some rounded corners that can contain text (one or more rows).

I can apply styles programatically, but the styles defined in the xaml for the UserControl isn't preserved (Border, Margins, colors etc).

Not to sound critical, but why not just use a Button with a TextBlock as its content, as that would be what you said you want? — benjer3
I'm a total newbie in WPF so any suggestions are welcome. How would I solve the CornerRadius with a button? I need to wrap it with a Border, doesn't I? — jishi
Yeah, that's simple. All you need to do is create a style for your buttons that includes setting the template to a Custom ControlTemplate. In that ControlTemplate, you have a Border that defines the shape of the control. See here for an example. With this example you can set the CornerRadius of the Border to whatever you want. You can also customize colors, etc. — benjer3
In my current project, I modified the glass button style found here, and it looks really good. — benjer3

Artem Makarov Artem Makarov · Accepted Answer · 2012-06-18T02:53:45

First of all, you don't need to create a custom control for this, you can easily do

var button = new Border { *border properties*, Content = new Lable {Content="dfsdfsdfsd"}};

And if you use PlayerList.Children.Add( button ); then it adds to the end of Wrappanel and in XAML code you add it not as the last element (maybe)..

And the last idea is that you lost some properties that you added in XAML when test it (like aligment, margin, etc.)

Hope this helps.

Adding a WPF UserControl programmatically has no style

1 Answers