locked
Controls inside ListView

    Question

  • I have a button control and TextBlock inside Listview and I am placing it towards the extreme right. But its positioning depends on the length of the text

    Code:

     <ListView x:Name="lvDiscussions"
                                  Height="Auto"  
                                  Margin="0,10,0,0"
                                  VerticalAlignment="Top" 
                                  IsItemClickEnabled="False" 
                                  ScrollViewer.VerticalScrollBarVisibility="Auto" 
                                  HorizontalAlignment="Stretch" 
                                  IsSynchronizedWithCurrentItem="False"
                                  SelectionChanged="lvDiscussions_SelectionChanged">
                                <ListView.ItemTemplate>
                                    <DataTemplate>
                                        <StackPanel Orientation="Vertical" Margin="20,20,0,0" HorizontalAlignment="Stretch">
                                            <Grid>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition Height="Auto"></RowDefinition>
                                                    <RowDefinition Height="Auto"></RowDefinition>
                                                </Grid.RowDefinitions>
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="*"></ColumnDefinition>
                                                </Grid.ColumnDefinitions>
                                                <Border BorderThickness="0,0,0,1" BorderBrush="Black" HorizontalAlignment="Stretch">
                                                    <StackPanel Orientation="Vertical" Margin="10" HorizontalAlignment="Stretch">
                                                        <Grid>
                                                            <Grid.RowDefinitions>
                                                                <RowDefinition Height="Auto"></RowDefinition>
                                                                <RowDefinition Height="Auto"></RowDefinition>
                                                                <RowDefinition Height="*"></RowDefinition>
                                                            </Grid.RowDefinitions>
                                                            <Grid.ColumnDefinitions>
                                                                <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                                <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                                <ColumnDefinition Width="*"></ColumnDefinition>
                                                            </Grid.ColumnDefinitions>
                                                            <TextBlock Text="{Binding UserName}" Grid.Column="1" HorizontalAlignment="Left" Margin="2,0,0,0"/>
                                                            <TextBlock Text="{Binding Timestamp}" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Left" Margin="2,0,0,0"/>
                                                            <Image Source="{Binding AttachmentFileName}" Height="30" Width="30" HorizontalAlignment="Left" Grid.RowSpan="2" Grid.Column="0"/>
                                                            <Button Grid.RowSpan="2" Grid.Column="2" HorizontalAlignment="Right" Content="Comment" Grid.Row="0" x:Name="btnComment" Tag="{Binding ReplyId}" Click="btnComment_Click"></Button>
                                                            <TextBlock x:Name="tbReply" Text="{Binding Body}" TextWrapping="Wrap" Margin="5,5,0,0" Grid.Row="2" Grid.ColumnSpan="3" TextAlignment="Justify" HorizontalAlignment="Stretch"/>

                                                        </Grid>
                                                    </StackPanel>
                                                </Border>
                                                <ListView 
                                                x:Name="lvComments"
                                                ItemsSource="{Binding Comments}" 
                                                Margin="20,10,0,0" 
                                                Grid.Row="1"
                                                HorizontalAlignment="Stretch"
                                                SelectionChanged="lvComments_SelectionChanged"
                                                IsItemClickEnabled="False"
                                                    SelectionMode="None"
                                                    >
                                                    <ListView.ItemTemplate>
                                                        <DataTemplate>
                                                            <Border Margin="0,30,0,0" BorderBrush="Black" HorizontalAlignment="Stretch">
                                                                <StackPanel Orientation="Vertical" Margin="10">
                                                                    <Grid>
                                                                        <Grid.RowDefinitions>
                                                                            <RowDefinition></RowDefinition>
                                                                            <RowDefinition></RowDefinition>
                                                                        </Grid.RowDefinitions>
                                                                        <Grid.ColumnDefinitions>
                                                                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                                            <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                                        </Grid.ColumnDefinitions>
                                                                        <TextBlock Text="{Binding UserName}" Grid.Column="1" HorizontalAlignment="Left" Margin="2,0,0,0"/>
                                                                        <TextBlock Text="{Binding Timestamp}" Grid.Column="1" Grid.Row="1" HorizontalAlignment="Left" Margin="2,0,0,0"/>
                                                                        <Image Source="{Binding avatar}" Height="30" Width="30" HorizontalAlignment="Left" Grid.RowSpan="2" Grid.Column="0"/>
                                                                    </Grid>
                                                                    <TextBlock x:Name="tbReply" Text="{Binding comment}" TextWrapping="Wrap" TextAlignment="Justify"/>
                                                                </StackPanel>
                                                            </Border>
                                                        </DataTemplate>
                                                    </ListView.ItemTemplate>
                                                </ListView>
                                            </Grid>
                                        </StackPanel>
                                    </DataTemplate>
                                </ListView.ItemTemplate>
                            </ListView>

    Thursday, April 24, 2014 11:31 AM

All replies

  • I'm going to assume that your question is about placing something to the extreme left. In that case, use HorizontalAlignment="Left", or use a grid with cells to explicitly place the content.

    Matt Small - Microsoft Escalation Engineer - Forum Moderator
    If my reply answers your question, please mark this post as answered.

    NOTE: If I ask for code, please provide something that I can drop directly into a project and run (including XAML), or an actual application project. I'm trying to help a lot of people, so I don't have time to figure out weird snippets with undefined objects and unknown namespaces.

    Thursday, April 24, 2014 12:13 PM
    Moderator
  • Even the boder thickness depends on the content inside that border. Eg

    This is my content

    ------------------------

    This is my long , long, long , long, very long content

    -------------------------------------------------------------------

    Now i dont want my border thicness depends on the width of the content inside it. How can i do that.

    Thursday, April 24, 2014 1:58 PM