Search code examples
c#xamarinxamarin.forms

listview scrolling issue in android 9.0 - xamarin.forms


I am trying to create a chat UI in my xamarin.forms app.I followed this tutorial Xamboy chat UI.The github link is Sample.

In this tutorial to acheive the chat UI,They rotated the ListView and ViewCells main layout to 180 degrees so that the list start from the bottom.

Xaml

 <Grid RowSpacing="0" 
       ColumnSpacing="0">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="1" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <controls:ExtendedListView Grid.Row="0" 
             ItemTemplate="{StaticResource MessageTemplateSelector}" 
             ItemsSource="{Binding Messages}" 
             Margin="0"                
             ItemTapped="OnListTapped"
             Rotation="180" 
             FlowDirection="RightToLeft"                               
             HasUnevenRows="True" x:Name="ChatList"
             VerticalOptions="FillAndExpand" 
             SeparatorColor="Transparent"
             ItemAppearingCommand="{Binding MessageAppearingCommand}"
             ItemDisappearingCommand="{Binding MessageDisappearingCommand}">
     </controls:ExtendedListView>
    <BoxView HorizontalOptions="FillAndExpand"
             HeightRequest="1"
             BackgroundColor="#61427D"
             Grid.Row="1"/>
    <partials:ChatInputBarView Grid.Row="2"
                               Margin="0,0,0,0"
                               x:Name="chatInput"/>
</Grid>

This worked till android 8.0. But in android 9.0, the chat scrolling is stuck and scroll in the wrong direction. How can I solve this. Is there any better solution for implementing chat UI in xamarin forms? Any help is appreciated.

Edit: I removed the rotation of listview and followed this repo. Monkeychat Which worked fine.


Solution

  • You can use the list in normal degrees and change the list orientation from c#.

    Try something like this:

     var list = your message list;
     new ObservableCollection<Model of your list>(list.OrderByDescending(x => 
     x.yourObjectDateTime).ToList());
    

    I presume you use datetime in your Model, if u don't you'll need to implement this to properly order your list.