Search code examples
wpflabelcontroltemplateexpander

Label and Expander control with rounded corners


Hi I try make a style with rounded corners for label and expander control.

Label style:

        <Style x:Key="InfoLabelStyle" TargetType="{x:Type Label}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Label}">
                        <Border Name="Border" Background="#BFE3FE" BorderBrush="#BFE3FE" BorderThickness="1" CornerRadius="7" Padding="3">
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Setter Property="FontSize" Value="12"/>
            <Setter Property="FontWeight" Value="Normal"/>
            <Setter Property="Height" Value="25"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="BorderThickness" Value="1"/>
            <Setter Property="BorderBrush" Value="#BFE3FE"/>
            <Setter Property="Background" Value="#BFE3FE"/>
            <Setter Property="Margin" Value="2,4,0,1" />
            <Setter Property="Padding" Value="4,0,0,0" />
        </Style>

I use multibinding on this style in view:

                 <Label Style="{StaticResource InfoLabelStyle}">
                        <Label.Content>
                            <MultiBinding StringFormat="{}{0}, {1} rokov">
                                <Binding Path="Oponent.Info.Sex" Converter="{StaticResource sexConverter}"/>
                                <Binding Path= "Oponent.Info.Age"/>
                            </MultiBinding>
                        </Label.Content>
                      </Label>

But if I run app, content of this label is empty, binding is good, I try it on textBox control and work.

Second problem is, I would like have also rounded corners on expander control.

I try same way as in label style:

        <Style x:Key="InfoExpanderStyle" TargetType="{x:Type Expander}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Expander}">
                        <Border Name="Border" Background="#BFE3FE" BorderBrush="#BFE3FE" BorderThickness="1" CornerRadius="7" Padding="3">
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

Applu style on Expander control:

     <Expander Name="InfoExapnder" 
                      Header="{Binding Path=Oponent.Info.Nick, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
                      Style="{StaticResource InfoExpanderStyle}"
                      IsExpanded="True"
                      FontSize="18"
                      FontWeight="Normal"
                      Background="#ECEBEB" 
                      Margin="3,0,3,0"
                      Grid.Row="0">
                <Grid>
</Grid>

But result is same, empty content of the control.

What I do bad?


Solution

  • The label is empty because you've re-templated it but not specified where the content should be placed. You want something like:

                    <ControlTemplate TargetType="{x:Type Label}">
                        <Border Name="Border" Background="#BFE3FE" BorderBrush="#BFE3FE" BorderThickness="1" CornerRadius="7" Padding="3">
                            <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}"/>
                        </Border>
                    </ControlTemplate>