search

miquelbeltran / flutter95

Windows95 UI components for Flutter apps. Bring back the nostalgic look and feel of old operating systems with this set of UI components ready to use.
https://pub.dev/packages/flutter95
MIT License
195 stars 23 forks source link

Windows style scrollbars #17

Open miquelbeltran opened 1 year ago

miquelbeltran commented 1 year ago

Tried to implement this but was too complicated, need to look it up again.

image

Taosif7 commented 1 year ago

@miquelbeltran can you discuss the approach you followed?

miquelbeltran commented 1 year ago

@Taosif7 sure! I have three different ideas:

Custom themed Material Scrollbar

The theming options are a bit limited, I can make the "thumb" square and match the background colors, but that's it, no elevated effect, no top and down buttons, etc. Plus, the scrollbar is rendered on top of the ListView, this can be fixed with some padding hack, but otherwise it doesn't look. I tried to work with RawScrollbar but faced similar limitations.

Custom widget

The second idea is to have a custom widget that takes a ScrollCotroller and renders a scrollbar. I haven't explored this one, but I think it is the easiest, just not sure how performant is. This is probably just the way to go. Have a Row with your ListView and the Scrollbar95, and link them two together with a ScrollController.

Custom Scrollbar class

This approach is taking the source code of the Material Scrollbar and reimplementing it. I haven't thought much about it, but I guess too complex for a novelty project like this.

Overall, probably the custom widget approach is the way to go.

Taosif7 commented 1 year ago

Great, I'll explore further on 2nd & 3rd options!

Taosif7 commented 1 year ago

@miquelbeltran I took the 2nd approach and designed a solution around it. Look at PR (https://github.com/miquelbeltran/flutter95/pull/26).

Its works perfectly for now, just a few tiny things that can be improved in future. Also performance looks fine to me, although can be analysed and improved.

Once merged, I can create an issue for all the improvements I have in mind.