Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/GuOrg/Gu.Wpf.FlipView
A flipview for WPF, handles touch & mouse swipe.
https://github.com/GuOrg/Gu.Wpf.FlipView
Last synced: 3 months ago
JSON representation
A flipview for WPF, handles touch & mouse swipe.
- Host: GitHub
- URL: https://github.com/GuOrg/Gu.Wpf.FlipView
- Owner: GuOrg
- License: mit
- Created: 2014-09-18T14:35:23.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2023-12-25T15:26:30.000Z (11 months ago)
- Last Synced: 2024-06-16T00:38:29.652Z (5 months ago)
- Language: C#
- Homepage:
- Size: 737 KB
- Stars: 53
- Watchers: 4
- Forks: 10
- Open Issues: 8
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-wpf - Gu.Wpf.FlipView - (FREE, OPEN SOURCE) A flipview for WPF, handles touch & mouse swipe. (UI Controls / Individual Controls)
README
# Gu.Wpf.FlipView
[](LICENSE)
[](https://www.nuget.org/packages/Gu.Wpf.FlipView/)
[](https://dev.azure.com/guorg/Gu.Wpf.FlipView/_build/latest?definitionId=12&branchName=master)
[](https://ci.appveyor.com/project/JohanLarsson/gu-wpf-flipview/branch/master)
A flipview for WPF, handles touch & mouse swipe.
# Table of contents
- [FlipView](#flipview)
- [IncreaseInAnimation](#increaseinanimation)
- [IncreaseOutAnimation](#increaseoutanimation)
- [DecreaseInAnimation](#decreaseinanimation)
- [DecreaseOutAnimation](#decreaseoutanimation)
- [CurrentInAnimation](#currentinanimation)
- [CurrentOutAnimation](#currentoutanimation)
- [ShowIndex](#showindex)
- [IndexPlacement](#indexplacement)
- [IndexItemStyle](#indexitemstyle)
- [ShowArrows](#showarrows)
- [ArrowPlacement](#arrowplacement)
- [ArrowButtonStyle](#arrowbuttonstyle)
- [Samples](#samples)
- [TransitionControl](#transitioncontrol)
- [ContentChangedEvent](#contentchangedevent)
- [OldContent](#oldcontent)
- [OldContentStyle](#oldcontentstyle)
- [OutAnimation](#outanimation)
- [NewContentStyle](#newcontentstyle)
- [InAnimation](#inanimation)
- [GesturePanel](#gesturepanel)
- [Gestured](#gestured)
- [GestureTracker](#gesturetracker)
# FlipView
A selector that transitions when selecteditem changes.
Has bindings to `NavigationCommands.BrowseBack` and `NavigationCommands.BrowseForward`
## IncreaseInAnimation
The animation to use for animating in new content when selected index increased.
## IncreaseOutAnimation
The animation to use for animating out old content when selected index increased.
## DecreaseInAnimation
The animation to use for animating in new content when selected index decreased.
## DecreaseOutAnimation
The animation to use for animating out old content when selected index decreased.
## CurrentInAnimation
The resulting animation to use for animating in new content.
## CurrentOutAnimation
The resulting animation to use for animating out old content.
## ShowIndex
If the index should be visible
## IndexPlacement
Where the index should be rendered
## IndexItemStyle
A style with `TargetType="ListBoxItem"` for how to render items in the index.
## ShowArrows
Specifies if navigation buttons should be visible.
## ArrowPlacement
Specifies where navigation buttons are rendered.
## ArrowButtonStyle
A style with `TargetType="RepeatButton"` for how to render navigation buttons.
## Samples
Sample slideshow images:
```xaml
```
Sample bound itemssource:
```xaml
```
# TransitionControl
A contentcontrol that animates content changes. Used in the `ControlTemplate` for `FlipView`.
The default animation is fade new content in & old content out.
When a transition starts the ContentChangedEvent is raised for `PART_OldContent` and `PART_NewContent` if they are found in the template.
## ContentChangedEvent
Notifies when content changes. When a transition starts the ContentChangedEvent is raised for `PART_OldContent` and `PART_NewContent` if they are found in the template.
## OldContent
This property holds the old content until the transition animation finishes.
## OldContentStyle
The style for the old content. TargetType="ContentPresenter"
## OutAnimation
The storyboard used for animating out old content.
## NewContentStyle
The style for the new and current content. TargetType="ContentPresenter"
## InAnimation
The storyboard used for animating in new content.
## Samples
### Simple with default animation, fade in & out:
```xaml
```
### With custom animations
```xaml
```
# GesturePanel
A contentcontrol that detects gestures such as swipes. Used in the `ContentTemplate` for `FlipView`
## Gestured
A routed event that notifies when a gesture was detected.
## GestureTracker
Plug in a gesture tracker.
The default value is `new TouchGestureTracker()`
Included in the library is
- TouchGestureTracker
- MouseGestureTracker
The MouseGestureTracker can be useful for testing things if no touch device is available.
Sample:
```xaml
```
Sample with custom tracker:
```xaml
```
# Transform
Attached properties for animating transitions.
## RelativeOffsetX
Setting the value to 1 results in `OffsetX` being set to `ActualWidth`. Does not update when size changes as it is only meant to be suwed during transitions.
Animating the value 0 -> 1 means the element animates it's width to the right.
## RelativeOffsetY
Setting the value to 1 results in `OffsetY` being set to `ActualHeight`. Does not update when size changes as it is only meant to be suwed during transitions.
Animating the value 0 -> 1 means the element animates it's height downwards.
## OffsetX
The absolute x value.
## OffsetY
The absolute y value.
## ScaleX
The scale x value.
## ScaleY
The scale y value.
## Sample
Note that the sample below assumes that `TransitionControl.ContentChangedEvent`is raised on the `ContentPresenter` to trigger the animation.
```xaml
<Setter Property="RenderTransform">
<Setter.Value>
<TransformGroup>
<TranslateTransform X="{Binding Path=(attached:Transform.OffsetX), RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}"
Y="{Binding Path=(attached:Transform.OffsetY), RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}" />
<ScaleTransform ScaleX="{Binding Path=(attached:Transform.ScaleX), RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}"
ScaleY="{Binding Path=(attached:Transform.ScaleY), RelativeSource={RelativeSource AncestorType={x:Type ContentPresenter}}}" />
</TransformGroup>
</Setter.Value>
</Setter>
<Style.Triggers>
<EventTrigger RoutedEvent="ContentChanged">
<BeginStoryboard Storyboard="{StaticResource SlideInAnimation}" />
</EventTrigger>
```