We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
I am working on a chat application. When my chat window Loaded I executing "ListView_Loaded" in code behind it takes me to the bottom of the listview. when I click on the send message button my command executes in viewmodel there I am not able to scroll to the bottom of the listview. I have shared my code please have a look.
How do I use the Sflistview component in my ViewModel I have tried this solution but it's not worked.
Viewmodel:
//internal Syncfusion.ListView.XForms.SfListView ListView;
void SendMessage(object obj)
{
var scrollView = obj as Syncfusion.ListView.XForms.SfListView;
if (!string.IsNullOrWhiteSpace(MessageText))
{
var msg = new ChatMessage
{
MessageFrom = userFrom,
MessageTo = userTo,
Message = MessageText,
TimeStamp = DateTime.UtcNow,
RoomId = roomId
};
wrapper.SendMessageAsync(msg);
MessageText = string.Empty;
if (ChatGrouped.Count != 0)
{
Device.BeginInvokeOnMainThread(() =>
{
//(ListView.LayoutManager as LinearLayout).ScrollToRowIndex(ChatGrouped.Count - 1, Syncfusion.ListView.XForms.ScrollToPosition.Start);
(scrollView.LayoutManager as LinearLayout).ScrollToRowIndex(ChatGrouped.IndexOf(ChatGrouped.Last()), Syncfusion.ListView.XForms.ScrollToPosition.End);
});
}
}
}
Xaml
<Grid Padding="5" BackgroundColor="White">
<ScrollView x:Name="scrollView" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<syncfusion:SfListView x:Name="listView" IsStickyFooter="true" ItemSize="100"
ItemTemplate="{StaticResource MessageTemplateSelector}"
ItemsSource="{Binding ChatGrouped}"
SelectionMode="None"
FocusBorderThickness="0"
RowSpacing="12" ColumnSpacing="0"
LoadMoreOption="Auto"
LoadMorePosition="Top"
LoadMoreCommand="{Binding LoadMoreItemsCommand}"
LoadMoreCommandParameter="{Binding Source={x:Reference Name=listView}}"
Loaded="ListView_Loaded"
AutoFitMode="Height">
<syncfusion:SfListView.FooterTemplate>
<DataTemplate>
<Frame Padding="0"
OutlineColor="#9080eb"
IsClippedToBounds="True"
Margin="10,0,10,10"
CornerRadius="8"
VerticalOptions="FillAndExpand"
BackgroundColor="#EFEFF4"
HorizontalOptions="FillAndExpand"
Grid.Row="1">
<Frame.HasShadow>
<OnPlatform x:TypeArguments="x:Boolean">
<On Platform="iOS">False</On>
<On Platform="Android">False</On>
</OnPlatform>
</Frame.HasShadow>
<Grid x:Name="MessageControls" RowSpacing="1" ColumnSpacing="2" BackgroundColor="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<control:BorderlessEntry Grid.Column="0"
x:Name="chatTextInput"
Margin="7,0,0,0"
FontSize="Small"
Placeholder="Type Something"
Text="{Binding MessageText, Mode=TwoWay}" />
<Button Grid.Column="1" Text="Send" TextColor="AliceBlue" BackgroundColor="#9080eb"
x:Name="MessageButton"
CommandParameter="{Binding Source={x:Reference Name=listView}}"
Command="{Binding SendMessageCommand}" >
<Button.WidthRequest>
<OnPlatform x:TypeArguments="x:Double">
<On Platform="Android" Value="100"/>
<On Platform="iOS" Value="80"/>
</OnPlatform>
</Button.WidthRequest>
</Button>
</Grid>
</Frame>
</DataTemplate>
</syncfusion:SfListView.FooterTemplate>
</syncfusion:SfListView>
</ScrollView>
</Grid>
