Improving empty states #5768

grzesiek2010 · 2023-10-05T14:45:57Z

Closes #5730

What has been done to verify that this works as intended?

I've tested the changes manually and added some new tests/updated existing ones.

Why is this the best possible solution? Were any other approaches considered?

Nothing to discuss here.

How does this change affect users? Describe intentional changes to behavior and behavior that could have accidentally been affected by code changes. In other words, what are the regression risks?

We can focus on testing lists (their empty states). Nothing else should be changed.

Do we need any specific form for testing your changes? If so, please attach one.

No.

Does this change require updates to documentation? If so, please file an issue here and include the link below.

No.

Before submitting this PR, please make sure you have:

run ./gradlew checkAll and confirmed all checks still pass OR confirm CircleCI build passes and run ./gradlew connectedDebugAndroidTest locally.
verified that any code or assets from external sources are properly credited in comments and/or in the about file.
verified that any new UI elements use theme colors. UI Components Style guidelines

grzesiek2010 · 2023-10-05T14:47:20Z

@alyblenkin please take a look at the changes I have implemented. I haven't added icons because I don't have them and I don't think I can download them from FIgma? If we want to add those icons could you share them here?

alyblenkin · 2023-10-05T16:39:15Z

Hey @grzesiek2010 - It's looking good! Could we use a medium font weight for the title, and then in the second line, we use a regular font weight to establish more of a visual hierarchy? I think we could also use the same font size as the main menu buttons because we have the space.

You can download the icons from figma, but I think using Google fonts is easier! I'm using the same edit icon as "Drafts" and send icon that we are using for "Ready to send". The only one that is new is the empty inbox for "Sent"

Side note: every time I go to open "Delete from" the app crashes for some reason.

grzesiek2010 · 2023-10-05T16:49:00Z

What about other lists for example the list of blank forms, what icon should be used there?

alyblenkin · 2023-10-05T16:51:28Z

What about other lists for example the list of blank forms, what icon should be used there?

ooooo great point! Adding a mockup for that now.

grzesiek2010 · 2023-10-06T12:58:56Z

@alyblenkin it should be ready for another look.

alyblenkin · 2023-10-06T14:54:56Z

@grzesiek2010 Looks great!

seadowg · 2023-10-16T15:18:45Z

collect_app/src/main/res/values/attrs.xml

@@ -1,5 +1,7 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources>
+    <attr name="icon" format="reference" />


What's this for?

The icon attribute is used in two places and if it's not extracted like that Android studio throws Found item Attr/icon more than one time see: https://stackoverflow.com/questions/4434327/same-named-attributes-in-attrs-xml-for-custom-view or https://medium.com/@bruno.lima/android-custom-views-same-attribute-on-multiple-custom-views-78e9de1ce6c8

seadowg · 2023-10-16T15:19:40Z

collect_app/src/main/res/layout/empty_list_view.xml

+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:textAppearance="?textAppearanceLabelExtraLarge"
+        android:fontFamily="sans-serif-medium"


Is there another text appearance we could use instead of specifying a font here?

Not really but maybe textAppearanceLabelExtraLarge should use that font family by default? textAppearanceLabelLarge does so textAppearanceLabelExtraLarge should as well I guess?

Not really but maybe textAppearanceLabelExtraLarge should use that font family by default?

Maybe! I do wonder if we should be using one of the title tokens here rather than a label one as they're typically for controls (docs here).

srujner · 2023-10-17T10:20:46Z

Icons in Download and Sent tabs are different than in Main Menu. Shouldn't the icons be consistent?

grzesiek2010 · 2023-10-17T11:34:36Z

@alyblenkin what do you think?

alyblenkin · 2023-10-17T15:35:47Z

Icons in Download and Sent tabs are different than in Main Menu. Shouldn't the icons be consistent?

It's a good question - the only two icons I didn't want to make consistent with the main menu are "Start new" and "Sent". For Start new form, I wanted to show a form icon to illustrate the text a bit more. For Sent, I didn't want someone to glance at the empty state and see a checkmark and be confused, so I used the empty inbox.

For download, we should use the same icon.

grzesiek2010 · 2023-10-18T12:03:12Z

For download, we should use the same icon.

Fixed.

srujner · 2023-10-18T13:25:49Z

Tested with Success!

Verified on device with Android 13

Verified cases:

Works toward issue Improving empty states #5730;
Regression check on lists empty states;
Light and Dark mode;
Rotate the screen;
All main menu icons checked;

dbemke · 2023-10-18T13:30:36Z

Tested with Success!

Verified on device with Android 10

grzesiek2010 added 6 commits October 4, 2023 19:12

Updated strings

1473de9

Use simple 'Nothing available to display' in the list of blank forms

8e614dc

Added darker background

b492b54

Make sure all empty state messages take the whole available space

03f20b5

Make sure messages are centered

2802a59

Add padding to the empty state messages

dc84856

grzesiek2010 added 2 commits October 5, 2023 19:59

Use MaterialTextView

651092f

Added new icons

07fe0ce

grzesiek2010 force-pushed the COLLECT-5730 branch 3 times, most recently from d9acbc0 to 6e40004 Compare October 6, 2023 10:35

grzesiek2010 added 4 commits October 6, 2023 12:46

Implemented custom view for empty states

57b58dc

Added tests

3756545

Added new strings

4201cb1

Use the new custom EmptyListView instaed of plain TextViews in lists

c2498e7

grzesiek2010 force-pushed the COLLECT-5730 branch from 6e40004 to 2f9de4d Compare October 6, 2023 10:46

grzesiek2010 added 2 commits October 6, 2023 14:57

Fixed tests

5af4b7d

Removed unused strings

7368fc0

grzesiek2010 force-pushed the COLLECT-5730 branch from 2f9de4d to 7368fc0 Compare October 6, 2023 12:57

grzesiek2010 marked this pull request as ready for review October 6, 2023 12:58

grzesiek2010 requested a review from alyblenkin October 6, 2023 12:58

alyblenkin approved these changes Oct 6, 2023

View reviewed changes

grzesiek2010 requested a review from seadowg October 7, 2023 14:14

seadowg approved these changes Oct 16, 2023

View reviewed changes

seadowg added the needs testing label Oct 16, 2023

grzesiek2010 requested a review from seadowg October 16, 2023 22:55

Updated the icon used when the list of forms to download is empty

e496e25

dbemke added behavior verified and removed needs testing labels Oct 18, 2023

grzesiek2010 merged commit 037196f into getodk:master Oct 18, 2023
6 checks passed

alyblenkin mentioned this pull request Nov 3, 2023

Empty states: Copy changes #5820

Closed

dbemke mentioned this pull request Nov 14, 2023

Empty states in search results #5834

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Improving empty states #5768

Improving empty states #5768

grzesiek2010 commented Oct 5, 2023 •

edited

Loading

grzesiek2010 commented Oct 5, 2023

alyblenkin commented Oct 5, 2023

grzesiek2010 commented Oct 5, 2023 •

edited

Loading

alyblenkin commented Oct 5, 2023

grzesiek2010 commented Oct 6, 2023

alyblenkin commented Oct 6, 2023

seadowg Oct 16, 2023

grzesiek2010 Oct 16, 2023 •

edited

Loading

seadowg Oct 16, 2023

grzesiek2010 Oct 16, 2023 •

edited

Loading

seadowg Oct 17, 2023

srujner commented Oct 17, 2023

grzesiek2010 commented Oct 17, 2023

alyblenkin commented Oct 17, 2023

grzesiek2010 commented Oct 18, 2023

srujner commented Oct 18, 2023

dbemke commented Oct 18, 2023

Improving empty states #5768

Improving empty states #5768

Conversation

grzesiek2010 commented Oct 5, 2023 • edited Loading

What has been done to verify that this works as intended?

Why is this the best possible solution? Were any other approaches considered?

How does this change affect users? Describe intentional changes to behavior and behavior that could have accidentally been affected by code changes. In other words, what are the regression risks?

Do we need any specific form for testing your changes? If so, please attach one.

Does this change require updates to documentation? If so, please file an issue here and include the link below.

Before submitting this PR, please make sure you have:

grzesiek2010 commented Oct 5, 2023

alyblenkin commented Oct 5, 2023

grzesiek2010 commented Oct 5, 2023 • edited Loading

alyblenkin commented Oct 5, 2023

grzesiek2010 commented Oct 6, 2023

alyblenkin commented Oct 6, 2023

seadowg Oct 16, 2023

Choose a reason for hiding this comment

grzesiek2010 Oct 16, 2023 • edited Loading

Choose a reason for hiding this comment

seadowg Oct 16, 2023

Choose a reason for hiding this comment

grzesiek2010 Oct 16, 2023 • edited Loading

Choose a reason for hiding this comment

seadowg Oct 17, 2023

Choose a reason for hiding this comment

srujner commented Oct 17, 2023

grzesiek2010 commented Oct 17, 2023

alyblenkin commented Oct 17, 2023

grzesiek2010 commented Oct 18, 2023

srujner commented Oct 18, 2023

dbemke commented Oct 18, 2023

grzesiek2010 commented Oct 5, 2023 •

edited

Loading

grzesiek2010 commented Oct 5, 2023 •

edited

Loading

grzesiek2010 Oct 16, 2023 •

edited

Loading

grzesiek2010 Oct 16, 2023 •

edited

Loading