Skip to content
This repository has been archived by the owner on Dec 28, 2023. It is now read-only.

Can not scroll to first item in CircleListView after updating to CircularUI 1.5 #335

Closed
axa88 opened this issue Jun 21, 2020 · 5 comments
Closed
Labels
sos-masters Samsung Open Source Masters Program

Comments

@axa88
Copy link

axa88 commented Jun 21, 2020

Describe the bug
Can no longer scroll to first item in CircleListView of a CirclePage after updating from CircularUI 1.4 to 1.5

Previously using CircularUI 1.4 using a CircleListView on a CirclePage allowed scrolling to the first item in the list:
image

Then updating to CircularUI 1.5 with no code changes you can no longer scroll to the first item:
image

Here only the second item to the top can be scrolled to.
Also it appears rendering of the header and cells have changed.

To Reproduce
Steps to reproduce the behavior:

  1. Create CircleListView on a CirclePage in CircularUI 1.5
  2. Populate list with items
  3. Attempt to scroll to first item
  4. Notice you can not scroll to first item

Expected behavior
It understood CirclePage is depricated in CircularUI 1.5, but it might is expected that the same code would at least produce the same results even if no further improvments will be made to CirclePage

Environment (please complete the following information):

  • Target Product [e.g. Galaxy Watch, Gear S3,...]
    image

  • Tizen Platform Version [e.g. Tizen 5.5]

  • Tizen.CircularUI Version [1.4.0 > 1.5.0]

@axa88 axa88 added the bug Something isn't working label Jun 21, 2020
@rookiejava
Copy link
Contributor

Can you share the package reference of the project file you are using?

@rookiejava rookiejava added the sos-masters Samsung Open Source Masters Program label Jun 22, 2020
@axa88
Copy link
Author

axa88 commented Jun 23, 2020

Can you share the package reference of the project file you are using?

<PackageReference Include="Tizen.Wearable.CircularUI" Version="1.5.0" />

@rookiejava
Copy link
Contributor

Can you share the package reference of the project file you are using?

<PackageReference Include="Tizen.Wearable.CircularUI" Version="1.5.0" />

Thank you for sharing. Didn't you add specific version of Xamarin.Forms to the package reference separately?

@rookiejava
Copy link
Contributor

I think I found the reason.

To understand this problem, it is necessary to understand the FishEye effect , one of the basic UX policies of list view provided by the Tizen wearable platform. This effect is designed to look more natural and beautiful when an item in the list view is selected, moved or highlighted. And, this effect was designed by assuming 3 items in the list on one screen basically. Circular UI 1.5 is designed to follow these platform UX policies.

It was a complicated but to make long story short, we recommend that the height of each item (including headers or footers) can be used to occupy at least one third of the screen (at least 115~120). Perhaps in your app, the height of the header and footer (or item) is set to a bit smaller. (Because the screenshot you uploaded shows 4 items including the header)

We will improve the guide documentation on these constraints to help developers minimize confusion when developing apps.

Thank you.

@rookiejava rookiejava removed the bug Something isn't working label Jun 24, 2020
@axa88
Copy link
Author

axa88 commented Jun 24, 2020

perhaps in your app, the height of the header and footer (or item) is set to a bit smaller.

Perhaps this is true, i created Header containing a single Label with no specified size.
Adding HeightRequest = 120 to Label forced Header large enough to repair issue as was suggeted

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
sos-masters Samsung Open Source Masters Program
Projects
None yet
Development

No branches or pull requests

2 participants