Compact mode for bottom navigation

[nvllz]

To make the bottom menu more compact, I'd like to make it smaller. More experienced users don't need to see the name of the active tab, and such an option could free up space some on some screens, such as the ruler. In some cases, this may be critical.

[kylecorry31]

Good idea, I'll look into adding a compact mode under settings (default to off)

[AlessandroFrangiamone]

Hi @kylecorry31, I would like to help with this improvement. Before I start working on it I would like to understand the desired: Is the goal simply to have a smaller bottom navbar but with the same amount of buttons? If so, will the setting be activated from the 'Theme' tab with a switch button?

[nvllz]

Hey, my original idea referred to having a switch in the app settings which would hide the text labels under all tab items on the bottom navigation bar. I am not sure how the app looked back then, but now only the active tab item is presented with a label. I wanted to have a toggle which would get rid of them, making the bar compact.

[kylecorry31]

Hi @kylecorry31, I would like to help with this improvement. Before I start working on it I would like to understand the desired: Is the goal simply to have a smaller bottom navbar but with the same amount of buttons? If so, will the setting be activated from the 'Theme' tab with a switch button?

Thank you, I will gladly accept a contribution for this issue. As @nvllz mentioned, the original goal of this was to have a way to hide the text labels, which in theory will make the navbar smaller because it no longer needs to allocate room for the text. Optionally, it could also be a reduction of the padding of the bottom bar so it more closely matches the height of the icons without text (if that doesn't automatically happen when the text label is removed).

A switch button in the theme section of the settings would be good (default to off / not compact), and yes the same amount of buttons (with the expectation that there will be up to 5 buttons present in the future).

[AlessandroFrangiamone]

@kylecorry31, @nvllz thank you for the explanation! What do you think about the result?

https://github.com/kylecorry31/Trail-Sense/assets/34175360/c7153842-307b-4a5e-a67e-2a132a07f3ad

@kylecorry31 Some code clarifications:

• To readjust the bottom bar size (optional part you mentioned) I had to exploit a workaround because by default the BottomNavigationView element does not readjust the height of the component if you remove the labels associated with the icon items. The workaround is simply to set the height via layoutparams programmatically to a fixed size (obviously based on the pixel density of the specific device) when the compact mode is set. What do you think about this approach?

• I have now used the "palette" icon, which is also used for dynamic colours. Which icon should I use for the functionality in settings?

Apart from these points if you like the result I can start opening the specific PR.

[nvllz]

It looks great! But I think you could make it even smaller. Try to compare it yourself for tools such as Ruler, where additional space would benefit the end user and tell if it's better.

Compact vs normal in Signal:

Also for better user experience it'd be better to remember the screen position on switch tap, to make setting it feel more seamless.

Thanks for your work.

[kylecorry31]

Thanks, that looks really good. I agree it can probably be a bit smaller if possible - if not, I'll accept that as is.

As for the icon, I think this will work: https://pictogrammers.com/library/mdi/icon/page-layout-footer/

(I already have the license in Licenses to this icon pack, so you can just download the android drawable file)

[kylecorry31]

I also wouldn't worry too much about the scroll position - I have more work around that (it does the same thing when changing theme and backup/restore). Unless you have the time to resolve that as well (which would be awesome)

[AlessandroFrangiamone]

Thanks for the feedback, I have added the indicated icon and reduced the bottom bar, I attach video:

https://github.com/kylecorry31/Trail-Sense/assets/34175360/89139803-3d89-47a3-b343-63294d3d03f3

@kylecorry31 I opened the PR: https://github.com/kylecorry31/Trail-Sense/pull/2212

Regarding the improvement of the screen position storage, I have seen the following issue open: https://github.com/kylecorry31/Trail-Sense/issues/1750 I can try to take care of this in the next few days as well, but since they are two unrelated improvements I propose to treat it as a different PR.

[kylecorry31]

Thanks for the feedback, I have added the indicated icon and reduced the bottom bar, I attach video:

Screen.Recording.2024-02-10.at.17.36.17.mp4 @kylecorry31 I opened the PR: #2212

Regarding the improvement of the screen position storage, I have seen the following issue open: #1750 I can try to take care of this in the next few days as well, but since they are two unrelated improvements I propose to treat it as a different PR.

Thanks, that sounds good - and I'm fine with those being two PRs. I left a comment on your PR about potentially not needing to recreate the activity, which I believe would resolve the losing of scroll position there.

[AlessandroFrangiamone]

I confirm that removing the recreation of the activity also solved the scroll position problem for this case. I have updated the PR.

[kylecorry31]

Your PR has been merged and this will be included in the February release, thank you!