Xaml 实现Windows Phone的搜索界面

我四处查看了一下，但是找不到一个很好的参考资料来说明如何为windows phone应用程序实现搜索覆盖。我想模拟搜索是如何在商店、音乐和其他系统类型的应用程序中实现的

我用图标创建了应用程序栏，但不确定单击按钮时会发生什么。似乎页面顶部的某些覆盖被转换。我可以对此进行模拟，但由于这似乎是一个常见的场景，我希望有一个指南来支持跨应用程序的一致体验

带搜索按钮的应用程序栏：

覆盖：

---

没有官方的控制来为你做这件事。在我的应用程序中，我执行以下操作来覆盖此场景：

1-将搜索按钮添加到应用程序栏

2-单击按钮时，导航到新页面（例如SearchPage.xaml）：

3-将焦点设置为该页面上已加载事件中的搜索框以打开键盘（例如，在OnNavigatedTo中执行此操作将不起作用）：

4-使用“到”。我使用以下动画，创建了与内置搜索页面非常相似的动画样式：

<toolkit:TransitionService.NavigationInTransition>
    <toolkit:NavigationInTransition>
        <toolkit:NavigationInTransition.Forward>
             <toolkit:SlideTransition Mode="SlideUpFadeIn" />
        </toolkit:NavigationInTransition.Forward>
        <toolkit:NavigationInTransition.Backward>
            <toolkit:SlideTransition Mode="SlideUpFadeIn" />
        </toolkit:NavigationInTransition.Backward>
    </toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>

<toolkit:TransitionService.NavigationOutTransition>
    <toolkit:NavigationOutTransition>
        <toolkit:NavigationOutTransition.Backward>
            <toolkit:SlideTransition Mode="SlideDownFadeOut" />
        </toolkit:NavigationOutTransition.Backward>
        <toolkit:NavigationOutTransition.Forward>
            <toolkit:SlideTransition Mode="SlideDownFadeOut" />
        </toolkit:NavigationOutTransition.Forward>
    </toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>

---

单击按钮后，导航到搜索页面并在文本框上设置焦点。有关转换，请查看Windows Phone工具包。

mySearchTextbox.Focus();

<toolkit:TransitionService.NavigationInTransition>
    <toolkit:NavigationInTransition>
        <toolkit:NavigationInTransition.Forward>
             <toolkit:SlideTransition Mode="SlideUpFadeIn" />
        </toolkit:NavigationInTransition.Forward>
        <toolkit:NavigationInTransition.Backward>
            <toolkit:SlideTransition Mode="SlideUpFadeIn" />
        </toolkit:NavigationInTransition.Backward>
    </toolkit:NavigationInTransition>
</toolkit:TransitionService.NavigationInTransition>

<toolkit:TransitionService.NavigationOutTransition>
    <toolkit:NavigationOutTransition>
        <toolkit:NavigationOutTransition.Backward>
            <toolkit:SlideTransition Mode="SlideDownFadeOut" />
        </toolkit:NavigationOutTransition.Backward>
        <toolkit:NavigationOutTransition.Forward>
            <toolkit:SlideTransition Mode="SlideDownFadeOut" />
        </toolkit:NavigationOutTransition.Forward>
    </toolkit:NavigationOutTransition>
</toolkit:TransitionService.NavigationOutTransition>