ListBox given Telerik style ignores HorizontalContentAlignment

[James]

Hello,

I think I've found a bug with applying a Telerik style to a ListBox - with the style applied, ListBox items appear as though the ListBox had HorizontalContentAlignment="Left", even when I specify HorizontalContentAlignment="Stretch" .

I've made a little test project to demonstrate, and attached a screen shot of what the app looks like. The only bit omitted is the code-behind - in the window's constructor I add a single empty string to each listbox's items.

You can see that the border on the un-styled listbox extends all the way across the list box, but the border for the telerik styled version is left aligned. Does anyone know why this might be occuring/if there is a workaround I could use?

<Window x:Class="RadControlsWpfApp1.MainWindow"
                xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style TargetType="ListBox" x:Key="TelerikListBoxStyle" BasedOn="{StaticResource {telerik:ThemeResourceKey ThemeType=telerik:Office_BlueTheme, ElementType=ListBox}}"/>
    </Window.Resources>

    <StackPanel Orientation="Vertical">
        <ListBox Style="{StaticResource TelerikListBoxStyle}" x:Name="telerikStyledListBox" HorizontalContentAlignment="Stretch">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Label Content="telerik style" BorderThickness="1" BorderBrush="Black"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <ListBox x:Name="listBox" HorizontalContentAlignment="Stretch">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Label Content="standard style" BorderThickness="1" BorderBrush="Black"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </StackPanel>
</Window>

Regards,
James.

[Vanya Pavlova]

Hi James,

 

The styles used in our themes are theme specific. As fas as I can see from the snippet provided you create a style based on Office_Blue theme, however the approach is a bit different. You may directly create a style for the ListBoxItems and set their HorizontalContentAlignment as shown below:

<Window.Resources>
    <Style x:Key="TelerikListBoxStyle" TargetType="ListBoxItem">
        <Setter Property="telerik:StyleManager.Theme" Value="Office_Blue"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    </Style>
    </Window.Resources>
    <StackPanel Orientation="Vertical" DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <ListBox ItemsSource="{Binding Collection}" telerik:StyleManager.Theme="Office_Blue" ItemContainerStyle="{StaticResource TelerikListBoxStyle}" Height="100" x:Name="telerikStyledListBox" HorizontalContentAlignment="Stretch" DataContext="{Binding}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Label Content="telerik style" FontSize="15" BorderThickness="1" BorderBrush="Black"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
        <ListBox x:Name="listBox" ItemsSource="{Binding Collection}" HorizontalContentAlignment="Stretch">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Label Content="standard style" BorderThickness="1" BorderBrush="Black"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </StackPanel>
</Window>

Will you verify how this works for you? 

Kind regards,
Vanya Pavlova
the Telerik team

[James]

Hi Vanya,

That works perfectly, thank you for your prompt reply.

I'm sorry I couldn't check your solution sooner, things have been very busy.

James.