private void Image_ImageOpened(object sender, RoutedEventArgs e)
{
TitleGridMargin.X = Image.ActualWidth + 48;
Col1.Width = new GridLength(Image.ActualWidth);
ToolbarTitle.Margin = new Thickness(Image.ActualWidth * 80 / 200 + 32, 8, 0, 8);
var scrollviewer = SongList.GetScrollViewer();
var _scrollerPropertySet = ElementCompositionPreview.GetScrollViewerManipulationPropertySet(scrollviewer);
var _compositor = _scrollerPropertySet.Compositor;
var moving = 80f;
// Get references to our property sets for use with ExpressionNodes
var scrollingProperties = _scrollerPropertySet.GetSpecializedReference <ManipulationPropertySetReferenceNode>();
var horiMovingAni = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
horiMovingAni = EF.Lerp(0, (float)((80f / ImageGrid.ActualHeight * ImageGrid.ActualWidth) - ImageGrid.ActualWidth), horiMovingAni);
var scaleAnimation = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
var textScaleAnimation = EF.Lerp(1, (float)(ToolbarTitle.ActualHeight / TitleText.ActualHeight), scaleAnimation);
var titleVisual = ElementCompositionPreview.GetElementVisual(Title);
titleVisual.StopAnimation("offset.X");
titleVisual.StartAnimation("Offset.X", horiMovingAni);
}
private void Image_ImageOpened(object sender, RoutedEventArgs e)
{
TitleGridMargin.X = Image.ActualWidth + 48;
Col1.Width = new GridLength(Image.ActualWidth);
ToolbarTitle.Margin = new Thickness(Image.ActualWidth * 80 / 200 + 32, 8, 0, 8);
var scrollviewer = SongList.GetScrollViewer();
var _scrollerPropertySet = ElementCompositionPreview.GetScrollViewerManipulationPropertySet(scrollviewer);
var _compositor = _scrollerPropertySet.Compositor;
var moving = 80f;
// Get references to our property sets for use with ExpressionNodes
var scrollingProperties = _scrollerPropertySet.GetSpecializedReference <ManipulationPropertySetReferenceNode>();
var horiMovingAni = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
horiMovingAni = EF.Lerp(0, (float)((80f / ImageGrid.ActualHeight * ImageGrid.ActualWidth) - ImageGrid.ActualWidth), horiMovingAni);
var scaleAnimation = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
var textScaleAnimation = EF.Lerp(1, (float)(ToolbarTitle.ActualHeight / TitleText.ActualHeight), scaleAnimation);
var titleVisual = ElementCompositionPreview.GetElementVisual(Title);
titleVisual.StopAnimation("offset.X");
titleVisual.StartAnimation("Offset.X", horiMovingAni);
Task.Run(async() =>
{
await Dispatcher.RunAsync(Windows.UI.Core.CoreDispatcherPriority.High, () =>
{
var ani = ConnectedAnimationService.GetForCurrentView().GetAnimation(Consts.AlbumItemConnectedAnimation + "_1");
if (ani != null)
{
ani.TryStart(Title, new UIElement[] { Details });
}
ani = ConnectedAnimationService.GetForCurrentView().GetAnimation(Consts.AlbumItemConnectedAnimation + "_2");
if (ani != null)
{
ani.TryStart(Image);
}
});
});
}
private void SongList_Loaded(object sender, RoutedEventArgs e)
{
var ani = ConnectedAnimationService.GetForCurrentView().GetAnimation(Consts.AlbumItemConnectedAnimation + "_1");
if (ani != null)
{
ani.TryStart(Title, new UIElement[] { Details });
}
ani = ConnectedAnimationService.GetForCurrentView().GetAnimation(Consts.AlbumItemConnectedAnimation + "_2");
if (ani != null)
{
ani.TryStart(HeaderBG);
}
var scrollviewer = SongList.GetScrollViewer();
_scrollerPropertySet = ElementCompositionPreview.GetScrollViewerManipulationPropertySet(scrollviewer);
_compositor = _scrollerPropertySet.Compositor;
_props = _compositor.CreatePropertySet();
_props.InsertScalar("progress", 0);
_props.InsertScalar("clampSize", (float)Title.ActualHeight + 64);
_props.InsertScalar("scaleFactor", 0.5f);
// Get references to our property sets for use with ExpressionNodes
var scrollingProperties = _scrollerPropertySet.GetSpecializedReference <ManipulationPropertySetReferenceNode>();
var props = _props.GetReference();
var progressNode = props.GetScalarProperty("progress");
var clampSizeNode = props.GetScalarProperty("clampSize");
var scaleFactorNode = props.GetScalarProperty("scaleFactor");
// Create and start an ExpressionAnimation to track scroll progress over the desired distance
ExpressionNode progressAnimation = EF.Clamp(-scrollingProperties.Translation.Y / ((float)Header.Height - clampSizeNode), 0, 1);
_props.StartAnimation("progress", progressAnimation);
// Get the backing visual for the header so that its properties can be animated
Visual headerVisual = ElementCompositionPreview.GetElementVisual(Header);
// Create and start an ExpressionAnimation to clamp the header's offset to keep it onscreen
ExpressionNode headerTranslationAnimation = EF.Conditional(progressNode < 1, scrollingProperties.Translation.Y, -(float)Header.Height + (float)Title.ActualHeight + 64);
headerVisual.StartAnimation("Offset.Y", headerTranslationAnimation);
//// Create and start an ExpressionAnimation to scale the header during overpan
//ExpressionNode headerScaleAnimation = EF.Lerp(1, 1.25f, EF.Clamp(scrollingProperties.Translation.Y / 50, 0, 1));
//headerVisual.StartAnimation("Scale.X", headerScaleAnimation);
//headerVisual.StartAnimation("Scale.Y", headerScaleAnimation);
////Set the header's CenterPoint to ensure the overpan scale looks as desired
//headerVisual.CenterPoint = new Vector3((float)(Header.ActualWidth / 2), (float)Header.ActualHeight, 0);
var titleVisual = ElementCompositionPreview.GetElementVisual(Title);
var titleshrinkVisual = ElementCompositionPreview.GetElementVisual(TitleShrink);
var fixAnimation = EF.Conditional(progressNode < 1, -scrollingProperties.Translation.Y, (float)Header.Height - ((float)Title.ActualHeight + 64));
titleVisual.StartAnimation("Offset.Y", fixAnimation);
titleshrinkVisual.StartAnimation("Offset.Y", fixAnimation);
var detailsVisual = ElementCompositionPreview.GetElementVisual(Details);
var opacityAnimation = EF.Clamp(1 - (progressNode * 8), 0, 1);
detailsVisual.StartAnimation("Opacity", opacityAnimation);
var headerbgVisual = ElementCompositionPreview.GetElementVisual(HeaderBG);
var bgBlurVisual = ElementCompositionPreview.GetElementVisual(BGBlur);
var bgOpacityAnimation = EF.Clamp(1 - progressNode, 0, 1);
var bgblurOpacityAnimation = EF.Clamp(progressNode, 0, 1);
titleshrinkVisual.StartAnimation("Opacity", bgblurOpacityAnimation);
titleVisual.StartAnimation("Opacity", bgOpacityAnimation);
headerbgVisual.StartAnimation("Opacity", bgOpacityAnimation);
bgBlurVisual.StartAnimation("Opacity", bgblurOpacityAnimation);
}
private void SongList_Loaded(object sender, RoutedEventArgs e)
{
var scrollviewer = SongList.GetScrollViewer();
var _scrollerPropertySet = ElementCompositionPreview.GetScrollViewerManipulationPropertySet(scrollviewer);
var _compositor = _scrollerPropertySet.Compositor;
// Get references to our property sets for use with ExpressionNodes
var scrollingProperties = _scrollerPropertySet.GetSpecializedReference <ManipulationPropertySetReferenceNode>();
var headerHeight = (float)(HeaderGroup.ActualHeight);
var finalHeight = (float)TitleBG.ActualHeight;
var progressAnimation = EF.Conditional(-scrollingProperties.Translation.Y > headerHeight, EF.Conditional(-scrollingProperties.Translation.Y > headerHeight + finalHeight, 0, -scrollingProperties.Translation.Y - headerHeight - finalHeight), -finalHeight);
// 0~1
progressAnimation = (progressAnimation + finalHeight) / finalHeight;
var toolbarVisual = ElementCompositionPreview.GetElementVisual(Toolbar);
toolbarVisual.StartAnimation("Offset.Y", progressAnimation * 16 - 16);
var offset = toolbarVisual.GetReference().GetScalarProperty("Offset.Y");
toolbarVisual.StartAnimation("Opacity", progressAnimation);
var moving = 80f;
var movingAnimation = EF.Conditional(-scrollingProperties.Translation.Y > moving, 0f, moving + scrollingProperties.Translation.Y);
var horiMovingAni = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
horiMovingAni = EF.Lerp(0, (float)((80f / ImageGrid.ActualHeight * ImageGrid.ActualWidth) - ImageGrid.ActualWidth), horiMovingAni);
var scaleAnimation = EF.Clamp(-scrollingProperties.Translation.Y / moving, 0, 1);
var textScaleAnimation = EF.Lerp(1, (float)(ToolbarTitle.ActualHeight / TitleText.ActualHeight), scaleAnimation);
var titleVisual = ElementCompositionPreview.GetElementVisual(Title);
titleVisual.StartAnimation("Offset.Y", movingAnimation);
titleVisual.StartAnimation("Offset.X", horiMovingAni);
var titleTextVisual = ElementCompositionPreview.GetElementVisual(TitleText);
titleTextVisual.CenterPoint = new Vector3(32f, (float)TitleText.ActualHeight / 2, 0);
titleTextVisual.StartAnimation("Scale.X", textScaleAnimation);
titleTextVisual.StartAnimation("Scale.Y", textScaleAnimation);
var bgVisual = ElementCompositionPreview.GetElementVisual(TitleBG);
bgVisual.StartAnimation("Opacity", scaleAnimation);
var marginTop = (float)((TitleBG.ActualHeight - 80f) / 2);
var imgMovingAnimation = EF.Conditional(-scrollingProperties.Translation.Y > (moving - marginTop), marginTop, moving + scrollingProperties.Translation.Y);
var imageScaleAnimation = EF.Lerp(1, (float)(80f / ImageGrid.ActualHeight), scaleAnimation);
var imageVisual = ElementCompositionPreview.GetElementVisual(ImageGrid);
imageVisual.CenterPoint = new Vector3(32f, 0, 0);
imageVisual.StartAnimation("Scale.X", imageScaleAnimation);
imageVisual.StartAnimation("Scale.Y", imageScaleAnimation);
imageVisual.StartAnimation("Offset.Y", imgMovingAnimation);
}
private async void HeaderGroup_PointerReleased(object sender, Windows.UI.Xaml.Input.PointerRoutedEventArgs e)
{
await SongList.GetScrollViewer().ChangeViewAsync(null, 0, false);
}
