Helps you create a "pull to reload" interaction with a
It is implemented as a
ScrollingAnimation, with a set of properties that let you bind different states that should be triggered during different stages of interaction:
Pulling - Active when the user is actively pulling down beond the top of the content
PulledPastThreshold - Active when the user has pulled down enough to activate loading
Loading - Active when the "loading" has started. Loading starts when the user has pulled past the threshold, and then leaves the threshold area.
Rest - Active when the user has pulled down the content, but their last movement was upwards. In addition, you have a callback,
ReloadHandler, which is called when the
PullToReloadinherits from ScrollingAnimation and therefore can be tweaked further using its properties. Here is an example of how we can tweak it to be pulled from the bottom instead using the
<PullToReload Range="SnapMax"> ... </PullToReload>
See the Pull to reload, for a complete example on how to use it.
The following example flashes the app background in different colors as the different states of the
<ScrollView> <PullToReload> <Timeline ux:Name="redFlash"> <Change color.Color="#F00" Duration="1"/> </Timeline> <Timeline ux:Name="pinkFlash"> <Change color.Color="#FFC0DB" Duration="1"/> </Timeline> <Timeline ux:Name="greenFlash"> <Change color.Color="#0F0" Duration="1"/> </Timeline> <Timeline ux:Name="blueFlash"> <Change color.Color="#00F" Duration="1"/> </Timeline> <State ux:Binding="Pulling"> <Cycle Target="redFlash.Progress" Low="0" High="1" Frequency="1" /> </State> <State ux:Binding="PulledPastThreshold"> <Cycle Target="pinkFlash.Progress" Low="0" High="1" Frequency="1" /> </State> <State ux:Binding="Loading"> <Cycle Target="greenFlash.Progress" Low="0" High="1" Frequency="1" /> </State> <State ux:Binding="Rest"> <Cycle Target="blueFlash.Progress" Low="0" High="1" Frequency="1" /> </State> </PullToReload> <StackPanel> <Text Margin="20">The quick brown fox</Text> <Text Margin="20">Jumps over the lazy dog</Text> </StackPanel> <SolidColor ux:Name="color" Color="#FFF"/> </ScrollView>
- Fuse.Controls.ScrollView 1.9.0
Interface of PullToReload
PulledPastThreshold : State ux
Inherited from ScrollingAnimation
Inherited from Trigger
A list of actions that execute with the trigger. These may react on simple direction changes, or at specific time offsets.
Bypass : TriggerBypassMode ux
CrossFadeDuration : double ux
If there is a transition between forward/backward playback and two timeilnes are being used (implicit or explicit) this specifies the cross-fade time.
HasActions : bool uno
HasAnimators : bool uno
HasBackwardAnimation : bool uno
true if there is an explicit backward animation.
Play the trigger from where it currently is to the end.
Indicates the trigger is bound to the layout of a visual. This will keep the trigger in Bypass mode until after the first layout of the element is obtained. This is required since layout does not happen in the same root grouping/update phase as the creation of the element, yet not having a layout should qualify as part of the rooting period.
StretchDuration : double ux
Stretches the duration of the animation to fill up this period of time.
TimeMultiplier : double ux
Specifies a multiplier to the elapsed time for animation playback.
Inherited from NodeGroupBase
FindTemplate(string) : Template uno
Nodes : IList of Node ux
Nodes to add to the Parent when this trigger is any non-deactivated state (Progress > 0)
Inherited from Node
Bindings : IList of Binding ux
The list of bindings belonging to this node.
ContextParent : Node uno
The context parent is the semantic parent of this node. It is where non-UI structure should be resolved, like looking for the DataContext, a Navigation, or other semantic item.
FindByType<T> : T uno
Finds the first node with a given name that satisfies the given acceptor. The serach algorithm works as follows: Nodes in the subtree are matched first, then it matches the nodes in the subtrees ofthe ancestor nodes by turn all the way to the root. If no matching node is found, the function returns null.
GetNearestAncestorOfType<T> : T uno
IsRootingCompleted : bool uno
Whether rooting for this node is completed. Returns false if unrooting has started.
IsRootingStarted : bool uno
Whether rooting of this node has started. Note that even if this property returns true, rooting may not yet be completed for the node. See also IsRootingCompleted.
Run-time name of the node. This property is automatically set using the ux:Name attribute.
NextSibling<T> : T uno
Returns the next sibling node of the given type.
If you override
OnRooted you must call
base.OnRooted() first in your derived class. No other processing should happen first, otherwise you might end up in an undefined state.
The parent Visual of this node. Will return null if the node is not rooted.
PreviousSibling<T> : T uno
Returns the next sibling node of the given type.
Properties : Properties uno
A linked list holding data for extrinsic properties.
Remove(Binding) : bool uno
SourceFileName : string ux
SourceLineNumber : int ux
SubtreeToString : string uno
Inherited from PropertyObject
Inherited from object
Equals(object) : bool uno
GetHashCode : int uno
Attached UX Attributes
Interface for objects that can have a script engine representation