This repository has been archived by the owner on May 20, 2022. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 8
/
GalleryPage.detailsPanel.ux
67 lines (67 loc) · 2.94 KB
/
GalleryPage.detailsPanel.ux
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<!--Details view -->
<Panel ux:Name="detailsPanel" HitTestMode="LocalBoundsAndChildren" Visibility="Hidden">
<ScrollView ux:Name="detailsScrollView" Alignment="VerticalCenter" AllowedScrollDirections="Vertical" ClipToBounds="false">
<StackPanel Orientation="Vertical">
<!-- Top decorations -->
<ux:Include File="GalleryPage.titleGrid.ux" />
<!-- Placeholder -->
<Panel>
<Panel ux:Name="hiresPanel" Visibility="Hidden">
<Spinner ux:Name="hiresSpinner" Width="50" Height="50" IsEnabled="false" StrokeWidth="3" Opacity="0" />
<ImageView ux:Name="hiresPhoto" ImageMemoryPolicy="UnloadUnused">
<WhileLoading>
<Change hiresSpinner.Opacity="1" />
<Change hiresSpinner.IsEnabled="true" />
</WhileLoading>
<WhileFailed>
<RaiseUserEvent EventName="Error">
<UserEventArg Name="message" StringValue="Error Loading Image" />
</RaiseUserEvent>
</WhileFailed>
</ImageView>
</Panel>
<Image ux:Name="placeholderImage">
<Timeline ux:Name="zoomTimeline">
<Move ux:Name="zoomMove" RelativeTo="PositionOffset" Vector="1" Duration="0.4" Easing="BackOut" EasingBack="BackIn" />
<Resize ux:Name="zoomScale" RelativeTo="Size" Vector="1" Duration="0.4" Easing="BackOut" EasingBack="BackIn" />
</Timeline>
</Image>
</Panel>
</StackPanel>
<!-- ScrollingAnimation triggers -->
<ScrollingAnimation Range="SnapMin">
<Set detailsMode.Value="false" AtProgress="0.75" />
</ScrollingAnimation>
<ScrollingAnimation Range="SnapMax">
<Set detailsMode.Value="false" AtProgress="0.75" />
</ScrollingAnimation>
<!-- Details mode trigger -->
<WhileTrue ux:Name="detailsMode">
<!-- Cancel download -->
<Set hiresPhoto.ImageUrl="" Direction="Backward" />
<!-- Faded background -->
<Change IsCoverPanelVisible.Value="true" Duration="0" Delay="0" DurationBack="0" DelayBack="0" />
<!-- Layout -->
<Change hiresPanel.Visibility="Visible" Delay="0.45" DelayBack="0" />
<Change titleGrid.Opacity="1" Delay="0.4" DelayBack="0" />
<Change isNavigationDisabled.Value="true" />
<Change detailsPanel.Visibility="Visible" Delay="0" Duration="0" DelayBack="0.4" DurationBack="0" />
<!-- Play animation -->
<PulseBackward Target="zoomTimeline" Direction="Forward" />
<PulseForward Target="zoomTimeline" Direction="Backward" />
<!-- Show/hide selected image -->
<ResourceVisibility Target="Image" Value="Hidden" Direction="Forward" AtProgress="0" />
<ResourceVisibility Target="Image" Value="Visible" Direction="Backward" AtProgress="0" />
</WhileTrue>
</ScrollView>
<Tapped>
<Set detailsMode.Value="false" />
</Tapped>
<WhileVisible>
<Set detailsScrollView.ScrollPosition="0" />
<!-- Android Back button handler -->
<OnKeyPress Key="BackButton">
<Set detailsMode.Value="false" />
</OnKeyPress>
</WhileVisible>
</Panel>