Fix #5170 [Feature Request]: Display some kind of loading animation/graphic when topics are loading in Home Page

[Vishwajith-Shettigar]

Explanation

Fix #5170. Added progressbar to the home fragment to show loading.

Essential Checklist

• The PR title and explanation each start with "Fix #bugnum: " (If this PR fixes part of an issue, prefix the title with "Fix part of #bugnum: ...".)
• Any changes to scripts/assets files have their rationale included in the PR explanation.
• The PR follows the style guide.
• The PR does not contain any unnecessary code changes from Android Studio (reference).
• The PR is made from a branch that's not called "develop" and is up-to-date with "develop".
• The PR is assigned to the appropriate reviewers (reference).

For UI-specific PRs only

Light mode

WhatsApp.Video.2023-10-14.at.9.08.07.AM.mp4

Darkmode

WhatsApp.Video.2023-10-14.at.9.08.06.AM.mp4

If your PR includes UI-related changes, then:

• Add screenshots for portrait/landscape for both a tablet & phone of the before & after UI changes
• For the screenshots above, include both English and pseudo-localized (RTL) screenshots (see RTL guide)
• Add a video showing the full UX flow with a screen reader enabled (see accessibility guide)
• Add a screenshot demonstrating that you ran affected Espresso tests locally & that they're passing

[adhiamboperes]

Closing this since the issue has been moved to design team.

[seanlip]

@Vishwajith-Shettigar Out of interest, could you show a video of your proposed changes here?

[Vishwajith-Shettigar]

@Vishwajith-Shettigar Out of interest, could you show a video of your proposed changes here?

@seanlip I have attached screen recording in PR description

[seanlip]

Thanks @Vishwajith-Shettigar. Actually, this seems quite a reasonable interim fix, so I'm reopening this PR.

@adhiamboperes Feel free to accept this if you feel that it looks good from a technical perspective. It looks fine to me from the PM side. Thanks!

[adhiamboperes]

@Vishwajith-Shettigar this should be reasonably completed if you add tests for the progressbar being shown and hidden as intended, and also demonstrate that it displays with the correct colors in light mode.

[Vishwajith-Shettigar]

@adhiamboperes, PTAL

[adhiamboperes]

Thanks @Vishwajith-Shettigar!

From your videos, I noticed that the progressbar is blue in color. The color should be green, and it should be defined per oppia color guidelines for darkmode support. The correct color to use here is @color/color_def_oppia_green

[oppiabot]

Unassigning @adhiamboperes since the review is done.

[Vishwajith-Shettigar]

Thanks @Vishwajith-Shettigar!

From your videos, I noticed that the progressbar is blue in color. The color should be green, and it should be defined per oppia color guidelines for darkmode support. The correct color to use here is @color/color_def_oppia_green

I made changes, PTAL

[oppiabot]

Unassigning @Vishwajith-Shettigar since a re-review was requested. @Vishwajith-Shettigar, please make sure you have addressed all review comments. Thanks!

[adhiamboperes]

Thanks @Vishwajith-Shettigar! This LGTM.