5、WPF 4.5 in VB 界面切换

5、WPF VB界面切换

WPF 界面切换的方式应当有三种，其一，设计多个窗口；其二，一个窗口使用控件切换；其三，一个窗口使用Page切换。本人对第一种不感兴趣，下面介绍后两种。

5.1 一个窗口使用控件切换

5.1.1 参考资料

参考资料1

http://zhidao.baidu.com/link?url=bD-xnCCPNrX2eDdazN4LnjkynZAXffJyAHpfTlv40ARpaHMq8ZiglyAbl16KSvHz2lHXn6lSLjHIN1EroMPlsa

使用ContentControl控件，然后在button的click事件里动态创建ContentControl的内容（Content属性）

比如你的MainWindow窗口里有如下两个控件，一个ContentControl，一个button

<Grid>
<Button Content="Button" Width="100" Height="40" VerticalAlignment="Top" Margin="0,5,0,5" Click="button1_Click" />
<ContentControl Name="contentControl1" Margin="0,50,0,0" />
</Grid>

然后你在项目中新建一个UserControl名为UserControl1，随便添加一些内容，比如一个椭圆

<Grid>
<Ellipse Fill="Purple" />
</Grid>

最后，设置MainWindow中button的Click事件如下

private void button1_Click(object sender, RoutedEventArgs e)
{
contentControl1.Content = new UserControl1();
}

运行一下，点击button，那么ContentControl里面就切换到UserControl1的界面了！类似的，你可以定义很多自定义控件，设置不同的button分别切换到这些控件内容即可！

上述参考资料在VB中实现的代码如下：

 

<Page x:Class="Page1"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:AlcIteApp1"
      mc:Ignorable="d" 
      d:DesignHeight="600" d:DesignWidth="800"
      Title="Page1">

    <DockPanel Background="{DynamicResource {x:Static SystemColors.ActiveCaptionBrushKey}}" >
        <!-- LEFT -->
        <TreeView HorizontalAlignment="Left" SnapsToDevicePixels="True" Width="120" Background="#FF4486D0" OpacityMask="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" UseLayoutRounding="True">
            <TreeViewItem Header="系统参数" Background="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" IsExpanded="True">
                <TreeViewItem Header="系统参数" HorizontalAlignment="Left" Width="98.4" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
            </TreeViewItem>
            <TreeViewItem Header="输入端口" Background="{DynamicResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" IsExpanded="True">
                <Button Content="A0" HorizontalAlignment="Left" Width="60" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" Click="Button_Click"/>
                <Button Content="A1" HorizontalAlignment="Left" Width="60" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
                <Button Content="A2" HorizontalAlignment="Left" Width="60" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
            </TreeViewItem>             
        </TreeView>
        <!-- RIGHT -->
        <DockPanel DockPanel.Dock="Right" Background="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}" >
            <Border x:Name="MainPicture" BorderBrush="Black" VerticalAlignment="Top" DockPanel.Dock="Top"/>
            <local:ControlRightBarDev VerticalAlignment="Center" UseLayoutRounding="False" DockPanel.Dock="Top"/>
        </DockPanel>
        <!-- MIDDLE -->
        <!-- 驻留页面 -->
        <Border x:Name="MainContent" BorderBrush="Black" HorizontalAlignment="Left"  VerticalAlignment="Top"/>
    </DockPanel>

 

Class Page1
    Private Sub OnLoaded()
        MainContent.Child = New ControlDevSystem()
    End Sub
    Private Sub Button_Click(sender As Object, e As RoutedEventArgs)
        MainContent.Child = New ControlDevAX()

        
    End Sub
End Class

 

 

参考资料2

http://zhidao.baidu.com/question/577069251.html?fr=qrl&index=1&qbl=topic_question_1&word=WPF%20WindowsFormsHost

5.2 一个窗口使用Page切换

5.2.1 参考资料

http://blog.sina.com.cn/s/blog_7a274a540101hdfd.html

该资料使用Treeview控件，用于选择内容项标题，右边是Frame控件用于显示被选择的界面（不是窗口界面，而是Page页面，所以新建项目时应该选择“Page”）。

Treeview控件支持多级标题项设置。将此控件拖入设计界面并选中此控件点右键，从弹出的快捷菜单中选择“添加TreeViewItem”，则添加的是一级标题项，如果选中某一项标题点右键，选择“添加TreeViewItem”，添加的是下一级标题项。

下面的代码选择左边的标题项，使右边的Frame控件中显示相应的页面，实现界面切换：

private void tv12_Selected(object sender, System.Windows.RoutedEventArgs e)
   {
       this.frame.Source=new Uri("/Page2.xaml",UriKind.Relative);
   }

   其中tv12是标题项的名称，使用Treeview的Selected事件，frame是Frame控件的名称。上面的内容在“基于Expression Blend 4中文版 WPF和Silverlight项目设计基础”中有介绍。

5.2.2 VB 代码隐藏和XAML 方式

笔者使用VB，在入口界面上有若干按钮，改组按钮作为一个页面，族留在MainWindow中，点击其中一个进入不同的页面。

驻留页面的语句为：

<!-- **** 4、客户区 ************************** -->
        <!-- 驻留页面 -->
        <Frame DockPanel.Dock="Top"
            Source="Page0.xaml"
               >
        </Frame>
  
    </DockPanel>
</RibbonWindow>

Page0.xaml上有若干个按钮，其中一个的“方法”如下（VB)：

Class Page0

   Private Sub design_Click(ByVal sender As Object, ByVal e As RoutedEventArgs)
        Dim nav As NavigationService
        nav = NavigationService.GetNavigationService(Me)
        nav.Navigate(New System.Uri("Page1.xaml", UriKind.RelativeOrAbsolute))
    End Sub
    
    ...........
End Class

上述代码中，只需要更换“Page1.xaml"。