Code Monkey home page Code Monkey logo

Comments (9)

obiwanzenobi avatar obiwanzenobi commented on May 10, 2024

I found a widget that acts like you described: https://gist.github.com/tomaszpolanski/cf0edb7961d2304c2f293da9971cd4c9

from sliver_tools.

Kavantix avatar Kavantix commented on May 10, 2024

@obiwanzenobi thanks for linking that gist.
I think I already looked at this one, it indeed might be a good starting point.
Can I assume you are looking for a widget with this behavior?
If so do you perhaps have input on the two questions I posed?

from sliver_tools.

pavittarsingh315 avatar pavittarsingh315 commented on May 10, 2024

Was about to open an enhancement request till I saw this. Is there any such functionality like this within the sliver_tools package?

I have a NestedScrollView whose headerSliverBuilder returns a SliverPersistentHeader and a SliverPinnedHeader but I want the pinned header to hide when we scroll to the bottom but show itself when we scroll to the top. This is basically the floating functionality on SliverAppBar and the functionality described here.

I tried using the gist provided but its fairly outdated and didn't seem to work.

from sliver_tools.

ABausG avatar ABausG commented on May 10, 2024

I actually use this to achieve a certain behaviour. Regarding your questions I think it already behaves like I would expect it.

Regarding your questions

What if this is combined with a regular pinned header before/after it
If all FloatingHeader are in a Group of PersistentHeaders (Pinned, Floating) In that case the FloatingHeader should scroll away but not be effecting by Overscroll Effects when dragging down For example

What should the behavior be when multiple of these headers are added to a viewport
If there is a non persistent Sliver between multiple of these headers it should behave more or less like a SliverToBoxAdapter

from sliver_tools.

marcoredz avatar marcoredz commented on May 10, 2024

Was about to open an enhancement request till I saw this. Is there any such functionality like this within the sliver_tools package?

I have a NestedScrollView whose headerSliverBuilder returns a SliverPersistentHeader and a SliverPinnedHeader but I want the pinned header to hide when we scroll to the bottom but show itself when we scroll to the top. This is basically the floating functionality on SliverAppBar and the functionality described here.

I tried using the gist provided but its fairly outdated and didn't seem to work.

I tried the example in the gist of tomaszpolanski and for me it actually works well.
In fact I merged the SliverPinnedHeader of this package and the code of that gist and created an hybrid that takes a parameter named floating that triggers the floating behavior.
I used it in a real scenario with the first sliver header set as floating and the second one pinned (without setting floating: true) and it works fine.

Here the new widget that I named SliverFlexibleHeader: https://gist.github.com/marcoredz/b2a37ff2cd11f81fa4ff7fb004fbb0ab

@Kavantix any opinions about this? maybe it could be a nice feature to add to your package

from sliver_tools.

Kavantix avatar Kavantix commented on May 10, 2024

@marcoredz I took a quick look at your implementation and it looks like a good starting point.
You can open a PR for it if you want

from sliver_tools.

marcoredz avatar marcoredz commented on May 10, 2024

@Kavantix what do you suggest between: taking the existing SliverPinnedHeader and editing it, or creating a new widget?

from sliver_tools.

Kavantix avatar Kavantix commented on May 10, 2024

I would create a new one for this

from sliver_tools.

AlaaEldeenYsr avatar AlaaEldeenYsr commented on May 10, 2024

It doesn't work when it's put inside MultiSliver or SliverMainAxisGroup

from sliver_tools.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.