Windows Phone 8.1 Action Center就像页面设计一样

Question

我正在尝试使用translate transform将页面窗体中的对象从上到下移动到用户手指移动。我们应该看到页面内容，因为栏位于页面下方并位于底部。

就像Windows Phone 8.1中的Action Center一样。

请让我知道我们如何设计的任何想法。感谢。

Answer 1

好问题！

我的第一个想法是做this之类的事情。 您可以获取触摸输入位置，然后从屏幕顶部移动一个矩形，并根据触摸输入的Y线将其平移。

修改 好的，这就是你能做的。

创建一个画布并将其放置在顶部的某个位置（我在折叠状态下给它高度为14）。

然后创建一个private void cn_ManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e)事件并设置Canvas的高度。我还添加了一个float i，以便稍后如果用户在拉动事件期间放手，则可以快速恢复或覆盖整个屏幕。

private void cn_ManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e)
        {
            cn.Height += e.DeltaManipulation.Translation.Y;
            i = (float)e.CumulativeManipulation.Translation.Y;

        }

就是这样。您还可以添加此事件以使其快速恢复或在用户离开时覆盖整个屏幕。

private void cn_ManipulationCompleted(object sender, System.Windows.Input.ManipulationCompletedEventArgs e)
        {
            if(i < 100)
            {
                cn.Height = 14; 
            }
            else
            {
                cn.Height = Application.Current.Host.Content.ActualHeight;  
            }
        }

当然，您可以添加更流畅的动画，使其慢慢返回折叠视图或填充整个页面。 我希望这有帮助！