在聊天中对齐 ListView 项目
Align ListView items in a chat
现在这个聊天机器人将它的所有显示文本都向左对齐。用户输入应该向右对齐，但不确定如何做到这一点。我尝试将 HorizontalAlignment="Right" 添加到 ListView，但它会将整个 bot/user 聊天列表移到右侧。我只希望用户输入文本右对齐。但是怎么办？我还为 ListView 查找了不同的 ItemTemplate 选择，但 none 有我需要的。我会接受 XAML 中的解决方案或 C# 中的编程方式。
MainPage.xaml
<Page
x:Class="StudyBot.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StudyBot"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<Grid HorizontalAlignment="Center" VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.3*"/>
<ColumnDefinition Width="5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="0.9*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Background="#2f5cb6"/>
<Border Grid.Column ="1" Background="#1f3d7a"/>
<Border Grid.Row="1" Grid.ColumnSpan="2" Background="#152951"/>
<StackPanel Grid.Column="1" >
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" HorizontalAlignment="Center" Height="380" Width="900" Margin="20,25,15,0" VerticalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="20*"/>
<RowDefinition Height="300*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="60*"/>
</Grid.RowDefinitions>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" />
<TextBox x:Name="NewMessageTextBox" Grid.Row="2" KeyUp="NewMessageTextBox_KeyUp" VerticalAlignment="Center" />
<Button x:Name="button" Content="SEND" Foreground="#2f5cb6" Margin="15,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" Click="Button_Send" Grid.Row="3" />
<Button BorderBrush="Transparent" Margin="779,0,20,0" Grid.Row="3" HorizontalAlignment="Right" Click="Button_Mic">
<SymbolIcon Symbol="Microphone" Foreground="#2f5cb6"/>
</Button>
</Grid>
</StackPanel>
<StackPanel Grid.Row="1" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="20,20,20,20">
<Pivot x:Name="rootPivot" HorizontalAlignment="Center" VerticalAlignment="Top" Height="Auto" Width="1150">
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Foreground="White" />
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
<Pivot.RightHeader>
<CommandBar ClosedDisplayMode="Compact">
<AppBarButton Icon="Back" Label="Previous" Click="BackButton_Click"/>
<AppBarButton Icon="Forward" Label="Next" Click="NextButton_Click"/>
</CommandBar>
</Pivot.RightHeader>
<PivotItem Header="Encyclopedia">
<WebView x:Name="Encyclopedia" HorizontalAlignment="Center" VerticalAlignment="Stretch" Width="1150" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" >
</WebView>
</PivotItem>
<PivotItem Header="Microsoft Academic">
<WebView x:Name="MicrosoftAcademic" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" LoadCompleted="Journals_LoadCompleted" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
<PivotItem Header="News / Blogs">
<WebView x:Name="NewsBlogs" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
</Pivot>
</StackPanel>
<Image Width="160" Source="Assets/robot-face.png" HorizontalAlignment="Center" Margin="15,60,10,10" VerticalAlignment="Center" Height="160" />
<TextBlock Foreground="White" FontSize="38" HorizontalAlignment="Center" Margin="15,70,10,10" Text="Study Bot"/>
</Grid>
</Page>
已更新MainPage.xaml
<Page
x:Class="StudyBot.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StudyBot"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Left" Visibility="{Binding IsUserText, Converter={StaticResource InverserBoolToVisibilityConverter}}" Margin="5, 5, 5, 5" />
</Border>
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Right" Visibility="{Binding IsUserText, Converter={StaticResource BoolToVisibilityConverter}}" Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<Grid HorizontalAlignment="Center" VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.3*"/>
<ColumnDefinition Width="5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="0.9*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Background="#2f5cb6"/>
<Border Grid.Column ="1" Background="#1f3d7a"/>
<Border Grid.Row="1" Grid.ColumnSpan="2" Background="#152951"/>
<StackPanel Grid.Column="1" >
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" HorizontalAlignment="Center" Height="380" Width="900" Margin="20,25,15,0" VerticalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="20*"/>
<RowDefinition Height="300*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="60*"/>
</Grid.RowDefinitions>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" />
<TextBox x:Name="NewMessageTextBox" Grid.Row="2" KeyUp="NewMessageTextBox_KeyUp" VerticalAlignment="Center" />
<Button x:Name="button" Content="SEND" Foreground="#2f5cb6" Margin="15,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" Click="Button_Send" Grid.Row="3" />
<Button BorderBrush="Transparent" Margin="779,0,20,0" Grid.Row="3" HorizontalAlignment="Right" Click="Button_Mic">
<SymbolIcon Symbol="Microphone" Foreground="#2f5cb6"/>
</Button>
</Grid>
</StackPanel>
<StackPanel Grid.Row="1" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="20,20,20,20">
<Pivot x:Name="rootPivot" HorizontalAlignment="Center" VerticalAlignment="Top" Height="Auto" Width="1150">
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Foreground="White" />
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
<Pivot.RightHeader>
<CommandBar ClosedDisplayMode="Compact">
<AppBarButton Icon="Back" Label="Previous" Click="BackButton_Click"/>
<AppBarButton Icon="Forward" Label="Next" Click="NextButton_Click"/>
</CommandBar>
</Pivot.RightHeader>
<PivotItem Header="Encyclopedia">
<WebView x:Name="Encyclopedia" HorizontalAlignment="Center" VerticalAlignment="Stretch" Width="1150" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" >
</WebView>
</PivotItem>
<PivotItem Header="Microsoft Academic">
<WebView x:Name="MicrosoftAcademic" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" LoadCompleted="Journals_LoadCompleted" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
<PivotItem Header="News / Blogs">
<WebView x:Name="NewsBlogs" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
</Pivot>
</StackPanel>
<Image Width="160" Source="Assets/robot-face.png" HorizontalAlignment="Center" Margin="15,60,10,10" VerticalAlignment="Center" Height="160" />
<TextBlock Foreground="White" FontSize="38" HorizontalAlignment="Center" Margin="15,70,10,10" Text="Study Bot"/>
</Grid>
</Page>
您可以在您的模型中添加一个额外的 属性，例如 IsUserText，然后创建两个 TextBlock，一个左对齐，另一个右对齐，您可以设置 Visibility 的 TextBlock 基于 IsUserText 属性.
您的 DataTemplate 应如下所示：
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Left" Visibility={Binding IsUserText, Converter={StaticResource InverserBoolToVisibilityConverter}} Margin="5, 5, 5, 5" />
</Border>
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Right" Visibility={Binding IsUserText, Converter={StaticResource BoolToVisibilityConverter}} Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
编辑：
此外，如果您不想使用两个 TextBlock's，您可以为 HorizontalAlignment 编写转换器，并可以根据 [=] 设置 Left 或 Right 20=]属性
找到了有效的 C# 组合，XAML。我将此添加到我的 MainPage():
// Add an event handler for the ContainerContentChanging event of the ListView
MessagesList.ContainerContentChanging += OnContainerContentChanging;
在同一个文件中添加了这个函数：
private void OnContainerContentChanging(ListViewBase sender, ContainerContentChangingEventArgs args)
{
if (args.InRecycleQueue) return;
// Currently we are adding messages to the ListView.ItemSource as Activity objects
// since this handler is called when the content changes (an item is added)
// intercept the item as an activity and set its horizontal alignment accordingly
Activity message = args.Item as Activity;
args.ItemContainer.HorizontalAlignment = (message.From.Name == botHandle) ? HorizontalAlignment.Right : HorizontalAlignment.Left;
}
以上代码对应于上述文件XAML中我的ListView（及其模板）：
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="TextB" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" MaxWidth="500" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" Margin="5, 5, 5, 15"/>
现在这个聊天机器人将它的所有显示文本都向左对齐。用户输入应该向右对齐，但不确定如何做到这一点。我尝试将 HorizontalAlignment="Right" 添加到 ListView，但它会将整个 bot/user 聊天列表移到右侧。我只希望用户输入文本右对齐。但是怎么办？我还为 ListView 查找了不同的 ItemTemplate 选择，但 none 有我需要的。我会接受 XAML 中的解决方案或 C# 中的编程方式。
MainPage.xaml
<Page
x:Class="StudyBot.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StudyBot"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<Grid HorizontalAlignment="Center" VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.3*"/>
<ColumnDefinition Width="5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="0.9*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Background="#2f5cb6"/>
<Border Grid.Column ="1" Background="#1f3d7a"/>
<Border Grid.Row="1" Grid.ColumnSpan="2" Background="#152951"/>
<StackPanel Grid.Column="1" >
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" HorizontalAlignment="Center" Height="380" Width="900" Margin="20,25,15,0" VerticalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="20*"/>
<RowDefinition Height="300*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="60*"/>
</Grid.RowDefinitions>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" />
<TextBox x:Name="NewMessageTextBox" Grid.Row="2" KeyUp="NewMessageTextBox_KeyUp" VerticalAlignment="Center" />
<Button x:Name="button" Content="SEND" Foreground="#2f5cb6" Margin="15,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" Click="Button_Send" Grid.Row="3" />
<Button BorderBrush="Transparent" Margin="779,0,20,0" Grid.Row="3" HorizontalAlignment="Right" Click="Button_Mic">
<SymbolIcon Symbol="Microphone" Foreground="#2f5cb6"/>
</Button>
</Grid>
</StackPanel>
<StackPanel Grid.Row="1" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="20,20,20,20">
<Pivot x:Name="rootPivot" HorizontalAlignment="Center" VerticalAlignment="Top" Height="Auto" Width="1150">
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Foreground="White" />
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
<Pivot.RightHeader>
<CommandBar ClosedDisplayMode="Compact">
<AppBarButton Icon="Back" Label="Previous" Click="BackButton_Click"/>
<AppBarButton Icon="Forward" Label="Next" Click="NextButton_Click"/>
</CommandBar>
</Pivot.RightHeader>
<PivotItem Header="Encyclopedia">
<WebView x:Name="Encyclopedia" HorizontalAlignment="Center" VerticalAlignment="Stretch" Width="1150" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" >
</WebView>
</PivotItem>
<PivotItem Header="Microsoft Academic">
<WebView x:Name="MicrosoftAcademic" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" LoadCompleted="Journals_LoadCompleted" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
<PivotItem Header="News / Blogs">
<WebView x:Name="NewsBlogs" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
</Pivot>
</StackPanel>
<Image Width="160" Source="Assets/robot-face.png" HorizontalAlignment="Center" Margin="15,60,10,10" VerticalAlignment="Center" Height="160" />
<TextBlock Foreground="White" FontSize="38" HorizontalAlignment="Center" Margin="15,70,10,10" Text="Study Bot"/>
</Grid>
</Page>
已更新MainPage.xaml
<Page
x:Class="StudyBot.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StudyBot"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Left" Visibility="{Binding IsUserText, Converter={StaticResource InverserBoolToVisibilityConverter}}" Margin="5, 5, 5, 5" />
</Border>
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Right" Visibility="{Binding IsUserText, Converter={StaticResource BoolToVisibilityConverter}}" Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<Grid HorizontalAlignment="Center" VerticalAlignment="Stretch" >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.3*"/>
<ColumnDefinition Width="5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="0.9*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Border Background="#2f5cb6"/>
<Border Grid.Column ="1" Background="#1f3d7a"/>
<Border Grid.Row="1" Grid.ColumnSpan="2" Background="#152951"/>
<StackPanel Grid.Column="1" >
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" HorizontalAlignment="Center" Height="380" Width="900" Margin="20,25,15,0" VerticalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="20*"/>
<RowDefinition Height="300*"/>
<RowDefinition Height="50*"/>
<RowDefinition Height="60*"/>
</Grid.RowDefinitions>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" />
<TextBox x:Name="NewMessageTextBox" Grid.Row="2" KeyUp="NewMessageTextBox_KeyUp" VerticalAlignment="Center" />
<Button x:Name="button" Content="SEND" Foreground="#2f5cb6" Margin="15,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Center" Click="Button_Send" Grid.Row="3" />
<Button BorderBrush="Transparent" Margin="779,0,20,0" Grid.Row="3" HorizontalAlignment="Right" Click="Button_Mic">
<SymbolIcon Symbol="Microphone" Foreground="#2f5cb6"/>
</Button>
</Grid>
</StackPanel>
<StackPanel Grid.Row="1" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Top" Margin="20,20,20,20">
<Pivot x:Name="rootPivot" HorizontalAlignment="Center" VerticalAlignment="Top" Height="Auto" Width="1150">
<Pivot.HeaderTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Foreground="White" />
</Grid>
</DataTemplate>
</Pivot.HeaderTemplate>
<Pivot.RightHeader>
<CommandBar ClosedDisplayMode="Compact">
<AppBarButton Icon="Back" Label="Previous" Click="BackButton_Click"/>
<AppBarButton Icon="Forward" Label="Next" Click="NextButton_Click"/>
</CommandBar>
</Pivot.RightHeader>
<PivotItem Header="Encyclopedia">
<WebView x:Name="Encyclopedia" HorizontalAlignment="Center" VerticalAlignment="Stretch" Width="1150" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" >
</WebView>
</PivotItem>
<PivotItem Header="Microsoft Academic">
<WebView x:Name="MicrosoftAcademic" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" LoadCompleted="Journals_LoadCompleted" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
<PivotItem Header="News / Blogs">
<WebView x:Name="NewsBlogs" Width="1150" HorizontalAlignment="Center" VerticalAlignment="Stretch" MinHeight="500" UseLayoutRounding="False" d:LayoutRounding="Auto" />
</PivotItem>
</Pivot>
</StackPanel>
<Image Width="160" Source="Assets/robot-face.png" HorizontalAlignment="Center" Margin="15,60,10,10" VerticalAlignment="Center" Height="160" />
<TextBlock Foreground="White" FontSize="38" HorizontalAlignment="Center" Margin="15,70,10,10" Text="Study Bot"/>
</Grid>
</Page>
您可以在您的模型中添加一个额外的 属性，例如 IsUserText，然后创建两个 TextBlock，一个左对齐，另一个右对齐，您可以设置 Visibility 的 TextBlock 基于 IsUserText 属性.
您的 DataTemplate 应如下所示：
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="Text" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Left" Visibility={Binding IsUserText, Converter={StaticResource InverserBoolToVisibilityConverter}} Margin="5, 5, 5, 5" />
</Border>
<Border BorderThickness="2" BorderBrush="deepskyblue" CornerRadius="7">
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" HorizontalAlignment="Right" Visibility={Binding IsUserText, Converter={StaticResource BoolToVisibilityConverter}} Margin="5, 5, 5, 5" />
</Border>
</Grid>
</DataTemplate>
编辑：
此外，如果您不想使用两个 TextBlock's，您可以为 HorizontalAlignment 编写转换器，并可以根据 [=] 设置 Left 或 Right 20=]属性
找到了有效的 C# 组合，XAML。我将此添加到我的 MainPage():
// Add an event handler for the ContainerContentChanging event of the ListView
MessagesList.ContainerContentChanging += OnContainerContentChanging;
在同一个文件中添加了这个函数：
private void OnContainerContentChanging(ListViewBase sender, ContainerContentChangingEventArgs args)
{
if (args.InRecycleQueue) return;
// Currently we are adding messages to the ListView.ItemSource as Activity objects
// since this handler is called when the content changes (an item is added)
// intercept the item as an activity and set its horizontal alignment accordingly
Activity message = args.Item as Activity;
args.ItemContainer.HorizontalAlignment = (message.From.Name == botHandle) ? HorizontalAlignment.Right : HorizontalAlignment.Left;
}
以上代码对应于上述文件XAML中我的ListView（及其模板）：
<Page.Resources>
<DataTemplate x:Key="MessagesListDataTemplate">
<Grid x:Name="TextB" Background="White" VerticalAlignment="Center" Margin="5, 5, 5, 5">
<Border>
<TextBlock Text="{Binding Text}" TextWrapping="Wrap" MaxWidth="500" />
</Border>
</Grid>
</DataTemplate>
</Page.Resources>
<ListView x:Name="MessagesList" Grid.Row="1" ItemTemplate="{StaticResource MessagesListDataTemplate}" Margin="5, 5, 5, 15"/>