Clarify/clean up UI

[AndreiMiculita]

Hello, I believe the file transfer UI can be improved in some regards:

• Fix username showing up as "null" if it's not loaded yet. To most users "null" doesn't mean anything special like it does in programming. They'll think it's another username. You can show a skeleton element instead if the username/hostname are not known yet.

Screenshot

• Fix text overflow for long username@hostname (similar to Long username@hostname in available devices isn't shortened #32)

Screenshot

• Add a text label for the "Send" button. It's unclear atm and the UI is bare anyway, so there is no risk of overcluttering.

Screenshot

• Add text labels for the options "File" and "Folder". Currently, this looks very vague and takes a bit of guesswork to see that a taller rectangle is a file and a wider one is a folder. Grey out the "Upload" button or do something to show it is not available when the two options are expanded.

Screenshot

• Allow swiping downloads to the side to dismiss. Maybe also add a label to the button that dismisses them (bottom-left).

• Fix toast only pushing up the "Dismiss all" button but not the "Send" button

Screenshot

Thanks!

[slowscript]

Thanks for the well-written feedback. Having it in points makes it easy to go through. I fixed some of the points in 1.7.1. Swiping away transfers will be done when I have some more time.

I am however not sure about adding labels to everything. Floating action button with a label looks like this and to me it does not seem suitable for this use case. They are simply too large and given that the screen has many of them it would not look good.

I didn't gray out the upload button when it is expanded because tapping it again makes it collapse back. It now changes icon to make this more clear.

[AndreiMiculita]

Wrt labels, I understand trying to keep it minimal but this also makes it harder to give indications to most users. Compare the readability of these two tutorials and which you'd rather be reading over a phone call:

• Press "Send", then press "Send file"
• Press the button on the bottom right with an arrow pointing up, then press the button with the taller rectangle

Also for the two popup FABs, they can be made smaller to indicate visual hierarchy. The MD3 design guidelines seem to advise that.

Or how about doing what Google Calendar does and show the labels after you click on the button?

Like this image, but instead of "Event" you have "Send file" and only one secondary button that says "Send folder"

[raresvanca]

Hi guys!

Just wanted to let you know that, out of a mix of boredom, a need to practice Jetpack Compose, and love for this app, I’ve decided to rewrite the UI (again!).

This time, I'm using the Material 3 Expressive design language and Jetpack Compose. I’m taking all the design suggestions from this thread into consideration(so anyone, if you have an idea/suggestion, please write it). I've already started working on swipe gestures for actions like deleting old transfers.

Already planned improvements:

• New FAB Menu to address one of the issues mentioned by Andrei
• New animations
• Dynamic layouts for larger devices (Tablets/ChromeOS)
• Pull to refresh (rescan devices) on the home page
• Full M3 Expressive compliance

A note on the code: I won't be submitting a PR anytime soon. The changes are massive (including Kotlin migrations and project restructuring) and would be a nightmare to review and follow right now. (I also took a lot of opinionated UI&UX decisions, which need to be discussed)

I might suggest a separate branch in the main repo in the future, but for now, I don't want to clutter the project. If you're curious, feel free to check out my fork!

See the attached previews below.

New remote widgets that are swipeable to add to favourites (favourites are marked by the non-rotating clover):

Screen_recording_20251222_001132.mp4

Screen_recording_20251221_235318.mp4

[raresvanca]

For those interested in providing feedback or monitoring development progress, here is a status update on the UI rewrite:

1. Manual Connection & QR Optimization

The Manual Connection Dialog has been enhanced with an updated icon, new layout and significant rendering performance improvements:

• Optimization: QR code generation now runs using modern Coroutines.
• Memory Efficiency: We now use Bitmap.Config.ALPHA_8. Since QR codes only contain black/transparent pixels, this minimizes memory footprint. Color tinting is applied via a color Filter during the render pass.
• Visual Quality: By reducing the render size and applying FilterQuality.None, the output is now crisp and pixel-perfect, avoiding the blurriness of bilinear filtering.
• UX: Added "Smart Paste" logic. If the clipboard contains a valid warpinator:// URI, it is automatically validated and added to the list. Added an empty state for when no recent remotes exist.

Screen_recording_20260111_140002.mp4

2. Adaptive Layouts

The home screen now implements the Material 3 List-Detail canonical layout. This ensures optimal functionality on tablets, foldables, and landscape modes.

Screen_Recording_20260111_144250_Warpinator.mp4

And here is the layout on mobile devices featuring the new expandable transfer tiles.

Screen_recording_20260111_142347.mp4

3. Rescan & Settings page

• Refresh Indicator: Added a Material 3 pull-to-refresh indicator to also trigger a rescan of remotes
• Settings Screen: Now using segmented list tiles like the Settings app on Android 16
• Profile Picture Dialog: Redesigned as a full-screen interface with more colors options based on a simplified version of the Material 3 tonal palette algorithm.

Screen_recording_20260111_142427.mp4

4. States

• State Feedback: Worked on clearer visual representations for different service/app states:

Screen_recording_20260111_152930.mp4