Samsung / Tizen.CircularUI

Tizen Wearable CircularUI project is to develop an open source software motivate software developer to creating Tizen Wearable Xamarin Forms app more easily and efficiently.
Other
80 stars 32 forks source link

CircleListView with grouping is very slow in 1.5.2 #356

Open EmilAlipiev opened 3 years ago

EmilAlipiev commented 3 years ago

When I have a listview with grouping, on my galaxy active watch 2 with tizen 5.5, listview is loading fast but i cannot scroll immediately. there is a huge delay. i have to wait like 5-10secs and if i pull from the middle of the watch still not working, only way to start scrolling is to use Bezel. Once i scroll with Bezel, touch scroll is also working. on active watch, there is no physical Brezel but what i mean is i can only do the first scroll from the edges like Brezel. if I remove the grouping, everything works fine. My template is very basic as below. Data is not matter, i tried with 5 items to 300 items, result is the same.

To Reproduce Steps to reproduce the behavior:

use this template with some simple list of objects

 <cui:CircleListView
            x:Name="List"
            AbsoluteLayout.LayoutFlags="All"
            GroupDisplayBinding="{Binding Key}"
            HasUnevenRows="True"
            IsGroupingEnabled="True"
            ItemLongPressed="OnItemLongPressed"
            ItemsSource="{Binding Items}"
            SelectedItem="{Binding SelectedWorkoutLog, Mode=OneWayToSource}">
            <cui:CircleListView.Header>
                <Label
                    cui:CircleListView.CancelEffect="True"
                    FontAttributes="Bold"
                    HorizontalTextAlignment="Center"
                    Text="{Binding TotalCount}"
                    TextColor="Red"
                    VerticalOptions="Center"
                    VerticalTextAlignment="Center" />
            </cui:CircleListView.Header>
            <cui:CircleListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout
                            BackgroundColor="DeepSkyBlue"
                            HorizontalOptions="FillAndExpand"
                            Orientation="Horizontal"
                            VerticalOptions="StartAndExpand">
                            <Label
                                HorizontalOptions="Center"                      
                                Text="{Binding Key}"
                                VerticalOptions="Center" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </cui:CircleListView.GroupHeaderTemplate>
            <cui:CircleListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                              <Grid
                                Margin="5,0"
                                AbsoluteLayout.LayoutBounds="0, 0, 1, 1"
                                AbsoluteLayout.LayoutFlags="All"
                                HeightRequest="130"
                                HorizontalOptions="FillAndExpand"
                                RowDefinitions="Auto,*"
                                VerticalOptions="CenterAndExpand">
                                <Label
                                    Grid.Row="0"
                                    IsVisible="False"
                                    Text="{Binding Key}" />                              
                                <Label
                                    Grid.Row="1"
                                    Margin="2,5"
                                    FontSize="Large"
                                    HorizontalOptions="CenterAndExpand"
                                    Text="{Binding Name}"
                                    VerticalOptions="Center" />

                            </Grid>

                    </ViewCell>
                </DataTemplate>
            </cui:CircleListView.ItemTemplate>

        </cui:CircleListView>

Environment (please complete the following information):

rookiejava commented 3 years ago

Thank you for reporting and sorry for late response. we'll take look this.

rookiejava commented 3 years ago

@EmilAlipiev could you test with below group header template instead? When I tested it only seems to be a problem for the StackLayout set to Horizontal. (Orientation="Horizontal") I've confirmed that the Grid or Vertical Stack layout works well.

            <cui:CircleListView.GroupHeaderTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout
                            BackgroundColor="DeepSkyBlue"
                            HorizontalOptions="FillAndExpand"
                            VerticalOptions="StartAndExpand">
                            <Label
                                HorizontalOptions="Center"
                                Text="{Binding Key}"
                                VerticalOptions="Center" />
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </cui:CircleListView.GroupHeaderTemplate>
EmilAlipiev commented 3 years ago

This didnt help me unfortunately. it still very slow on the watch. In the device logs, i see this warning "XamarinLogListener.cs: Warning(15) > [ListView] GroupHeaderTemplate and GroupDisplayBinding can not be set at the same time, setting GroupDisplayBinding to null" But i am not sure what it exactly means. if I dont use GroupDisplayBinding, it is not working. Btw, how is collectionview for watch, is it usable?

EmilAlipiev commented 3 years ago

Actually warning was correct. removing GroupDisplayBinding completely, solved the problem. Example in the documentation below is just confusing. maybe needs to updated.

EDIT: It was just coincidence that it worked once. i was too fast to update. it is still slow even without using GroupDisplayBinding.

https://samsung.github.io/Tizen.CircularUI/guide/CircleListView.html#add-group-list-as-list-contents

rookiejava commented 3 years ago

In the device logs, i see this warning "XamarinLogListener.cs: Warning(15) > [ListView] GroupHeaderTemplate and >GroupDisplayBinding can not be set at the same time, setting GroupDisplayBinding to null" But i am not sure what it exactly means. if I dont use GroupDisplayBinding, it is not working.

This log literally means that 'GroupHeaderTemplate' and 'GroupDisplayBinding' cannot be used at the same time, and even if is 'GroupDisplayBinding' set while 'GroupHeaderTemplate' is set, 'GroupDisplayBinding' is ignored. Nothing changes.

https://github.com/xamarin/Xamarin.Forms/blob/503f3df3b6954529b12af948f3f72589e2cddecd/Xamarin.Forms.Core/ListView.cs#L572-L580

As a result of my analysis, this is not a problem of Xamarin.Forms or CirularUI, but an internal issue of Tizen Native UI FW. It works well on 4.0 devices and seems to be reproduced only on 5.5 or higher. As mentioned above, this symptom occurs when the Horizontal StackLayout is used internally when the ViewCell is used in the DataTemplate of the ListView. (Not only the GroupHeaderTemplate, but also the HeaderTemplate, ItemTemplate, and so on.)

If you are using Horizontal StackLayout in GroupHeaderTemplate, ItemTempate, etc. that are being used in your app, please change it's orientation to Vertical. Of course, I know this is not a solution, and I'll get back as soon as we find more detailed causes and solutions.