Added scrolling to chat

Arcidev · Aug 21, 2024 · ca428d6 · ca428d6
1 parent fb2392f
commit ca428d6
Showing 1 changed file with 33 additions and 24 deletions.
diff --git a/Client.UI/Views/Game/Chat.xaml b/Client.UI/Views/Game/Chat.xaml
@@ -3,13 +3,15 @@
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
+        xmlns:i="http://schemas.microsoft.com/xaml/behaviors"
         xmlns:resx="clr-namespace:Client.UI.Resources"
         xmlns:enums="clr-namespace:Client.UI.Enums"
         xmlns:viewmodels="clr-namespace:Client.UI.ViewModels.MainGame"
         mc:Ignorable="d"
         Title="{x:Static resx:Texts.Chat}"
-        d:DesignHeight="200" d:DesignWidth="300">
-    <Grid d:DataContext="{d:DesignInstance Type=viewmodels:ChatViewModel}">
+        d:DesignHeight="200" d:DesignWidth="300"
+        d:DataContext="{d:DesignInstance Type=viewmodels:ChatViewModel}">
+    <Grid>
         <Grid.ColumnDefinitions>
             <ColumnDefinition MaxWidth="250" />
             <ColumnDefinition Width="3*"/>
@@ -34,28 +36,35 @@
                 <RowDefinition />
                 <RowDefinition Height="Auto"/>
             </Grid.RowDefinitions>
-            <ItemsControl ItemsSource="{Binding Messages}" AlternationCount="2">
-                <ItemsControl.ItemTemplate>
-                    <DataTemplate>
-                        <TextBlock Text="{Binding Text, Mode=OneWay}" TextWrapping="Wrap" x:Name="MessageTextBlock">
-                            <TextBlock.Style>
-                                <Style TargetType="TextBlock">
-                                    <Style.Triggers>
-                                        <DataTrigger Binding="{Binding Type}" Value="{x:Static enums:ChatMessageType.System}">
-                                            <Setter Property="Foreground" Value="OrangeRed"/>
-                                        </DataTrigger>
-                                    </Style.Triggers>
-                                </Style>
-                            </TextBlock.Style>
-                        </TextBlock>
-                        <DataTemplate.Triggers>
-                            <Trigger Property="ItemsControl.AlternationIndex" Value="1">
-                                <Setter Property="Background" Value="#F1F1F1" TargetName="MessageTextBlock" />
-                            </Trigger>
-                        </DataTemplate.Triggers>
-                    </DataTemplate>
-                </ItemsControl.ItemTemplate>
-            </ItemsControl>
+            <ScrollViewer VerticalScrollBarVisibility="Visible" x:Name="ChatScrollViewer">
+                <ItemsControl ItemsSource="{Binding Messages}" AlternationCount="2">
+                    <i:Interaction.Triggers>
+                        <i:EventTrigger SourceObject="{Binding Messages}" EventName="CollectionChanged">
+                            <i:CallMethodAction MethodName="ScrollToEnd" TargetObject="{Binding ElementName=ChatScrollViewer}" />
+                        </i:EventTrigger>
+                    </i:Interaction.Triggers>
+                    <ItemsControl.ItemTemplate>
+                        <DataTemplate>
+                            <TextBlock Text="{Binding Text, Mode=OneWay}" TextWrapping="Wrap" x:Name="MessageTextBlock">
+                                <TextBlock.Style>
+                                    <Style TargetType="TextBlock">
+                                        <Style.Triggers>
+                                            <DataTrigger Binding="{Binding Type}" Value="{x:Static enums:ChatMessageType.System}">
+                                                <Setter Property="Foreground" Value="OrangeRed"/>
+                                            </DataTrigger>
+                                        </Style.Triggers>
+                                    </Style>
+                                </TextBlock.Style>
+                            </TextBlock>
+                            <DataTemplate.Triggers>
+                                <Trigger Property="ItemsControl.AlternationIndex" Value="1">
+                                    <Setter Property="Background" Value="#F1F1F1" TargetName="MessageTextBlock" />
+                                </Trigger>
+                            </DataTemplate.Triggers>
+                        </DataTemplate>
+                    </ItemsControl.ItemTemplate>
+                </ItemsControl>
+            </ScrollViewer>
             <Grid Grid.Row="1">
                 <Grid.ColumnDefinitions>
                     <ColumnDefinition />