Aligning ListBox ContentControl to the right - C# WPF

2.3k views Asked by At

I have a ListBox with text and a corresponding Image. I would Like the Image to align right. How would i alter my XAML to achieve this? We are mainly looking at lbxBuiltInLevels. Thanks.

<Page x:Class="TheseusAndTheMinotaur.ChooseLevelPage"
      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="TheseusAndTheMinotaur"
      mc:Ignorable="d"
    Title="ChooseLevelPage">

    <Grid Margin="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Grid.Background>
            <ImageBrush ImageSource="/TheseusAndTheMinotaur;component/Images/MainBackground.jpg"/>
        </Grid.Background>
        <ListBox x:Name="lbxLevels" HorizontalAlignment="Left" Height="100" Margin="10,78,0,0" VerticalAlignment="Top" Width="100"/>
        <Button x:Name="btnExit" Content="Exit" HorizontalAlignment="Left" Margin="10,208,0,0" VerticalAlignment="Top" Width="75" Click="btnExit_Click"/>
        <Button x:Name="btnLoad" Content="Load" HorizontalAlignment="Left" Margin="10,183,0,0" VerticalAlignment="Top" Width="75" Click="btnLoadCustomLevel_Click"/>
        <Label x:Name="lblSavedLevels" Content="Custom Levels" HorizontalAlignment="Left" Margin="10,20,0,0" VerticalAlignment="Top" FontSize="34" FontFamily="Papyrus" FontWeight="ExtraBold"/>
        <Label x:Name="lblBuiltInLevels" Content="Built-in Levels" Grid.Column="1" HorizontalAlignment="Left" Margin="44,20,0,0" VerticalAlignment="Top" FontSize="34" FontWeight="ExtraBold" FontFamily="Papyrus"/>
        <ListBox x:Name="lbxBuiltInLevels" Grid.Column="1" Margin="10,78,0,0" VerticalAlignment="Top">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <Grid x:Name="gridForLevels">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition/>
                                <ColumnDefinition/>
                            </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" Margin="3" Text="{Binding Str}"/>
                        <ContentControl Grid.Column="1" Margin="0,0,10,0" Content="{Binding Image}" HorizontalAlignment="Right" HorizontalContentAlignment="Right" FlowDirection="RightToLeft"/>
                        </Grid>
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>
</Page>

enter image description here

1

There are 1 answers

0
TMan On BEST ANSWER

Set this code in your listbox:

  HorizontalContentAlignment="Stretch"

Should look like:

  <ListBox x:Name="lbxBuiltInLevels" Grid.Column="1" HorizontalContentAlignment="Stretch" Margin="10,78,0,0" HorizontalContentAlignment="Stretch" VerticalAlignment="Top"