需要菜单帮助的WPF布局 [英] WPF layout with menu assistance required

查看：53
本文介绍了需要菜单帮助的WPF布局的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我是编程世界的新手，并希望从WPF开始。

我正在尝试创建一个具有静态侧面菜单的自助服务终端类型应用程序。主窗口最初将具有带有当前时间的指令中心屏幕。我当时想要做的是取决于菜单上按下什么按钮，即设置，主要内容区域更新与设置等相关的屏幕。我不确定我需要阅读/研究的术语是什么。我希望保持屏幕的交换使用侧面菜单。



有人能指出我正确的方向吗？





这里是我到目前为止..



<前lang =HTML> < Window x：Class = MainScreen

xmlns = < span class =code-keyword> http://schemas.microsoft.com/winfx/2006/xaml/presentation
< span class =code-attribute>
xmlns：x = http://schemas.microsoft.com/winfx/2006/xaml

标题 = MainWindow 高度 = 768 宽度 = 1366 >
< Grid >
< DockPanel < span class =code-attribute> LastChildFill = True >
< TextBlock FontSize = 50 TextWrapping = 换行 > 这个我需要在哪里定位主要内容。 tHIS将更改依赖于从侧栏选择的菜单< / TextBlock >
< / DockPanel >

< DockPanel LastChildFill = 错误 >
< < span class =code-leadattribute> Border DockPanel.Dock = 右 宽度 = 100 保证金 = 0 不透明度 = 。9 >
< Border.Background >
< LinearGradientBrush EndPoint = 0.504,1.5 StartPoint = 0.504,0.20 >
< GradientStop 颜色 = ＃FF4B4343 Offset = 0 / >
< GradientStop 颜色 = ＃FFACB0B0 偏移量 = 0.567 / >
< / LinearGradientBrush >
< / Border.Background >
< StackPanel 保证金 = 20 >
< 按钮 保证金 = 0,10， 0,0 宽度 = 50 高度 = 50 > 菜单1 < /按钮 >
< 按钮 保证金 = 0,10,0,0 宽度 = 50 高度 = 50 > 菜单2 < /按钮 >
< 按钮 保证金 = 0,10,0,0 宽度 = 50 高度 = 50 < span class =code-keyword>> 菜单3 < /按钮 < span class =code-keyword>>
< 按钮 保证金 = 0,10,0,0 宽度 = 50 高度 = 50 > 菜单4 < /按钮 >
< 按钮 < span class =code-attribute> 保证金 = 0,10,0,0 宽度 = 50 高度 = 50 > 菜单5 < /按钮 >
< / StackPanel >
< / Border < span class =code-keyword>>
< Border DockPanel.Dock = 底部 填充 = 20 保证金 = 20 宽度 = < span class =code-keyword> 300 Horizo​​ntalAlignment = 左 CornerRadius = 10 已删除 = 黑色 不透明度 = 0.7 >
< TextBlock FontSize = 50 Foreground = 白色 TextAlignment = 中心 > 10:50 < / TextBlock >
< /边框 >
< / DockPanel >

< / Grid >

< / Window >

解决方案

您有两种选择。



使用导航框架或手动将控件添加到主窗口。基本上，我会做后者。为此，您需要创建一个主窗口或用户控件。在此处添加内容控件。然后，您将在代码中将其他用户控件添加到内容控件。



这是一个非常基本和高概述。请看下面的一些链接，这将有所帮助。



谢谢



WPF-A-Beginner-s-Guide-Part-1-of-n [ ^ ]



如果没有太多想法，我建议你开始用WPF了解MVVM。我还建议使用一个框架来处理你最终编写的许多锅炉板或复合代码。



以下是一些推荐的链接：



http://cinch.codeplex.com [ ^ ]

http ：//compositewpf.codeplex.com/ [ ^ ]



我使用Prism框架。我的学习曲线很大，但样本下载和随附的文档非常好。



最后我还建议盒装 - MVVM培训 [ ^ ]



更新：

好​​的，将3个wpf用户控件添加到你的解决方案中，名为view1，view2和view3。



接下来尝试：



 <  窗口 < span class =code-attribute>   x：Class   =  TestWPFApplication.MainWindow  
   
                   xmlns   =  http://schemas.microsoft.com/winfx/2006/xaml/presentation < span class =code-attribute> 
   
    < span class =code-attribute>               xmlns：x   =  http://schemas.microsoft.com/ winfx / 2006 / xaml  
   
                  标题  =   MainWindow  
   
                  宽度  = < span class =code-keyword> 800  
   
                  高度  =  600 >  
 < ;  网格 >  
  <   Grid.ColumnDefinitions  >  
 <   ColumnDefinition    宽度  =  250    /  >  
 <   ColumnDefinition    宽度  =  *    /  >  
 <   / Grid.ColumnDefinitions  >  
 <  边框   保证金  =  10  
   
          < span class =code-attribute>                         BorderBrush   =  BlueViolet  
   
                                   BorderThickness   =  2  
   
                                   CornerRadius   = < span class =code-keyword> 8 >  
 <   StackPanel    方向  = 垂直 >  
 <  按钮   名称  =  Btn1   保证金  =  10   标签  =  1   点击  =  MenuBtn_OnClick > 查看1 <   /按钮 >  
 <  按钮   名称  =  Btn2   保证金  =   10   标记  =  2   点击  =  MenuBtn_OnClick > 查看2 <   /按钮 >  
 <  按钮   名称  =  Btn3   保证金  =  10   标签  =  3   点击  =  MenuBtn_OnClick  > 查看2 <   /按钮 >  
 <   / StackPanel  >  
 <   / Border  >  
 <   Border     Grid.Column   =  1  
   
                    < span class =code-attribute>              保证金  =  10  
   
                        < span class =code-attribute>           BorderBrush   =  Chartreuse  
   
                                   BorderThickness   =  2  
   
                                   CornerRadius   =  8 >  
 <   ContentControl    名称  =  CcMainContent    /  >  
 <   / Border  >  
 <   / Grid  >  
 <   / Window  >





然后在代码后面的代码如下：



 命名空间 Te stWPFApplication 
 {
  ///   <  摘要 >  
   ///   MainWindow.xaml的交互逻辑
   ///   </summary> 
     public partial class MainWindow : Window 
     { 
         public MainWindow() 
         { 
 InitializeComponent(); 
  
             Loaded += (s, e) => LoadView(1); 
         } 
  
         public void LoadView(int viewId) 
         { 
             switch (viewId) 
             { 
                 case 1: 
                     CcMainContent.Content = new View1(); 
  break ; 
                 case 2: 
                     CcMainContent.Content = new View2(); 
  break ; 
                 case 3: 
                     CcMainContent.Content = new View3(); 
  break ; 
             } 
         } 
  
         private void MenuBtn_OnClick(object sender, RoutedEventArgs e) 
         { 
             Button menuButton = sender as Button; 
  
             if (menuButton != null) 
             { 
                 LoadView(Convert.ToInt32(menuButton.Tag)); 
             } 
         } 
     } 
 }





UPDATE 2: AND IN VB!

Namespace TestWPFApplication 
     ''' <summary> 
     ''' Interaction logic for MainWindow.xaml 
     ''' </summary> 
     Partial Public Class MainWindow 
         Inherits Window 
         Public Sub New() 
             InitializeComponent() 
             AddHandler Loaded, AddressOf MainWindow_Loaded 
         End Sub 
  
         Private Sub MainWindow_Loaded(sender As Object, e As RoutedEventArgs) 
             LoadView(1) 
         End Sub 
  
         Public Sub LoadView(viewId As Integer) 
             Select Case viewId 
                 Case 1 
                     CcMainContent.Content = New View1() 
                 Case 2 
                     CcMainContent.Content = New View2() 
                 Case 3 
                     CcMainContent.Content = New View3() 
             End Select 
         End Sub 
  
         Private Sub MenuBtn_OnClick(sender As Object, e As RoutedEventArgs) 
             Dim menuButton As Button = TryCast(sender, Button) 
  
             If menuButton IsNot Nothing Then 
                 LoadView(Convert.ToInt32(menuButton.Tag)) 
             End If 
         End Sub 
     End Class 
 End Namespace


I''m new to The world of programming and was looking to start with WPF.
I''m trying to create a kiosk type app which will have a static side menu. The main window will initially have an instruction centre screen with current time. What I then want to do is depending what button is pressed on the menu, ie settings, the main content area update with a screen relating to settings etc. I''m not sure what the terms are that I need to read/research. I was hoping to keep the swapping of the screens down to the use of the side menu.

Can anyone point me in the right direction?


Here is what I have so far..

<Window x:Class="MainScreen"

    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

    Title="MainWindow" Height="768" Width="1366">
<Grid>
        <DockPanel LastChildFill="True">
           <TextBlock FontSize="50" TextWrapping="Wrap">THIS IS WHERE I NEED TO POSITION THE MAIN CONTENT.  tHIS WILL CHANGE DEPENDING ON WHAT MENU IS SELECTED FROM THE SIDE BAR</TextBlock>
        </DockPanel>

        <DockPanel LastChildFill="False">
            <Border DockPanel.Dock="Right" Width="100" Margin="0" Opacity=".9" >
                <Border.Background>
                    <LinearGradientBrush EndPoint="0.504,1.5" StartPoint="0.504,0.20">
                        <GradientStop Color="#FF4B4343" Offset="0"/>
                        <GradientStop Color="#FFACB0B0" Offset="0.567"/>
                    </LinearGradientBrush>
                </Border.Background>
                <StackPanel Margin="20">
                    <Button Margin="0,10,0,0" Width="50" Height="50">Menu 1</Button>
                    <Button Margin="0,10,0,0" Width="50" Height="50">Menu 2</Button>
                    <Button Margin="0,10,0,0" Width="50" Height="50">Menu 3</Button>
                    <Button Margin="0,10,0,0" Width="50" Height="50">Menu 4</Button>
                    <Button Margin="0,10,0,0" Width="50" Height="50">Menu 5</Button>
                </StackPanel>
            </Border>
            <Border DockPanel.Dock="Bottom" Padding="20" Margin="20" Width="300" HorizontalAlignment="Left" CornerRadius="10" removed="Black" Opacity="0.7">
                <TextBlock FontSize="50" Foreground="White" TextAlignment="Center">10:50</TextBlock>
            </Border>
        </DockPanel>

    </Grid>
   
</Window>

解决方案

You have two options.

Using the navigation framework or manually adding the controls to the main window. Basically, I would do the latter. To do this you need to create a main window or user control. In this you add a content control. You would then in code, add other user controls to the content control.

This is a very basic and high overview. Please see some links below that will help.

thanks

WPF-A-Beginner-s-Guide-Part-1-of-n[^]

Without blowing your mind too much, I recommend you start to understand MVVM with WPF. I would also recommend using a framework that handles many of the boiler plate or comlex code that you end up writing.

Here are some recommended links:

http://cinch.codeplex.com[^]
http://compositewpf.codeplex.com/[^]

I use the Prism framework. I big learning curve, but the sample downloads and the accompanying documentation are really good.

Finally I would also recommend In the Box – MVVM Training[^]

UPDATE:
Ok, Add 3 wpf usercontrols to your solution called view1,view2 and view3.

Next try:

<Window x:Class="TestWPFApplication.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="MainWindow"

        Width="800"

        Height="600">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="250" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Border Margin="10"

                BorderBrush="BlueViolet"

                BorderThickness="2"

                CornerRadius="8">
            <StackPanel Orientation="Vertical">
                <Button Name="Btn1" Margin="10" Tag="1" Click="MenuBtn_OnClick">View 1</Button>
                <Button Name="Btn2" Margin="10" Tag="2" Click="MenuBtn_OnClick">View 2</Button>
                <Button Name="Btn3" Margin="10" Tag="3" Click="MenuBtn_OnClick">View 2</Button>
            </StackPanel>
        </Border>
        <Border Grid.Column="1"

                Margin="10"

                BorderBrush="Chartreuse"

                BorderThickness="2"

                CornerRadius="8">
            <ContentControl Name="CcMainContent" />
        </Border>
    </Grid>
</Window>



then in code behind something like:

namespace TestWPFApplication
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            Loaded += (s, e) => LoadView(1);
        }

        public void LoadView(int viewId)
        {
            switch (viewId)
            {
                case 1:
                    CcMainContent.Content = new View1();
                    break;
                case 2:
                    CcMainContent.Content = new View2();
                    break;
                case 3:
                    CcMainContent.Content = new View3();
                    break;
            }
        }

        private void MenuBtn_OnClick(object sender, RoutedEventArgs e)
        {
            Button menuButton = sender as Button;

            if (menuButton != null)
            {
                LoadView(Convert.ToInt32(menuButton.Tag));
            }
        }
    }
}



UPDATE 2: AND IN VB!

Namespace TestWPFApplication
    ''' <summary>
    ''' Interaction logic for MainWindow.xaml
    ''' </summary>
    Partial Public Class MainWindow
        Inherits Window
        Public Sub New()
            InitializeComponent()
            AddHandler Loaded, AddressOf MainWindow_Loaded
        End Sub

        Private Sub MainWindow_Loaded(sender As Object, e As RoutedEventArgs)
            LoadView(1)
        End Sub

        Public Sub LoadView(viewId As Integer)
            Select Case viewId
                Case 1
                    CcMainContent.Content = New View1()
                Case 2
                    CcMainContent.Content = New View2()
                Case 3
                    CcMainContent.Content = New View3()
            End Select
        End Sub

        Private Sub MenuBtn_OnClick(sender As Object, e As RoutedEventArgs)
            Dim menuButton As Button = TryCast(sender, Button)

            If menuButton IsNot Nothing Then
                LoadView(Convert.ToInt32(menuButton.Tag))
            End If
        End Sub
    End Class
End Namespace


这篇关于需要菜单帮助的WPF布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发语言最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆