feat(installer): redesign utility options

[validcube]

✨ Redesign utility options

This replace the 3 dots menu with buttons, improve visibility

Save APK
Share Log

This also removed the share option from the installer

[Ushie]

Use contained tonal icon buttons https://m3.material.io/components/icon-buttons/overview

[Ushie]

Also @PalmDevs could you take a look at this?

[PalmDevs]

I'd personally suggest using the already-existing Bottom App Bar component.

[Ushie]

I'd completely forgotten about that, looks perfect

[ILoveOpenSourceApplications]

#886 can be closed if this is implemented right?

[Ushie]

#886 can be closed if this is implemented right?

Yes

[Ushie]

Use Bottom App Bar for the patch result options

[Ushie]

@PalmDevs Need a bit of help, what should the copy logs button do?:

• Copy logs as text
• Copy file uri with the logs as the content
• Open share menu (current behavior)

[Ushie]

Also, should the Install FAB contain a label? or should it be Icon only

[PalmDevs]

@PalmDevs Need a bit of help, what should the copy logs button do?:

• Copy logs as text
• Copy file uri with the logs as the content
• Open share menu (current behavior)

[Screenshot]

I think the best choice would be to open a file picker to let the user save the logs. The user (if they want to share) can access their file manager and share it from there.

[PalmDevs]

The icons should also be changed. The icon for exporting the APK should be "Save" (floppy disk icon), and the icon for saving log should be "Post add" icon. References are found on Google's Icons website.

[Ushie]

[ILoveOpenSourceApplications]

This looks good but it would look even better if the style is similar to that of how bottom app bar is in Gmail app. When scrolling down the container disappears and when scrolled up the container reappears. Also the installation button can be similar to the compose button in Gmail app. When still will show the icon and "Install" text next to it and scrolling down will shrink it to just the icon.

Demo:

screen-20230809-213152.3.mp4

[Ushie]

The FAB in BottomAppBar can't be shown separetely, its part of the BottomAppBar, if the BottomAppBar gets hidden then the FAB does too, your gmail example shows Navigation Bar, instead of BottomAppBar which is why its different

[ILoveOpenSourceApplications]

Under scrolling in guidelines, my opinion is represented and can be seen in action. Please have a look at it. This FAB implementation can also benefit throughout the UI. When clicking the "Storage" button, "Patch" button and now "Install" button.

[ILoveOpenSourceApplications]

Also in the attached images, why are the icons already having a background? I'm not sure if it's because it's an image, but it shouldn't have the background unless the user taps on the respective icons right? Just asking out of curiosity.

[Ushie]

Under scrolling in guidelines, my opinion is represented and can be seen in action. Please have a look at it. This FAB implementation can also benefit throughout the UI. When clicking the "Storage" button, "Patch" button and now "Install" button.

Working on it

[Ushie]

Also in the attached images, why are the icons already having a background? I'm not sure if it's because it's an image, but it shouldn't have the background unless the user taps on the respective icons right? Just asking out of curiosity.

I thought it looked nice, I don;t think there's a specification to what type of button we're allowed to use there, but I'll try a normal IconButton and think about it then

[Ushie]

I looked into hiding on scroll, and I think the implementation is rather annoying just for something I personally think has no use in this context

Maybe if @validcube wants to add hide on scroll, they can but I personally wont (I dont know flutter enough to do it in a way I think is good code)

As for using Tonal IconButtons, I tried both standard and tonal versions and I prefer tonal, I don't see specs that speak against using it