Windows Phone 8.1 Action Center 类似页面设计答案

【问题标题】：Windows Phone 8.1 Action Center like page designWindows Phone 8.1 Action Center 类似页面设计
【发布时间】：2015-04-14 21:18:50
【问题描述】：

我正在尝试使用平移变换在用户手指移动时从上到下移动页面表单中的对象。我们应该看到页面内容，因为条形图从页面向下并位于底部。

就像 windows phone 8.1 中的操作中心一样。

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

【问题讨论】：

标签： xaml windows-phone-8.1

【解决方案1】：

好问题！

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

编辑： 好的，这就是你可以做的。

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

然后创建一个private void cn_ManipulationDelta(object sender, System.Windows.Input.ManipulationDeltaEventArgs e) 事件并让它设置画布的高度。我还添加了一个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;  
            }
        }

当然，您可以添加更平滑的动画，让它慢慢回到折叠视图或填满整个页面。我希望这会有所帮助！

【讨论】：

我已经尝试使用这些事件，问题是完整的矩形将沿 Y 移动，我需要一个带有底部栏的页面，该底部栏沿 Y 移动。就像操作中心栏一样。
尝试改变矩形的高度而不是 Y 位置。
谢谢，但我无法得到预期的结果。如何让网格视图显示内容并移动网格视图页脚。最初它应该只显示页脚，当用户按住并向下移动页脚时，它应该显示网格视图的内容。可能吗。我希望我已经正确地向您传达了这个问题。
考虑使用画布而不是网格视图，以获得像操作中心一样的“显示”效果。只需更改 Canvas 的高度，其中包含所有按钮、TextView 等。
谢谢:)。在代码中进行了一些小的编辑以支持电话属性。