如何在modernUI WPF应用程序中嵌套ModernMenu?

时间:2018-02-08 18:40:25

标签: wpf modern-ui

我正在使用ModernUI框架创建WPF应用程序,而且我在MainWindow类中嵌套了ModernMenu控件。这是我最初为MainWindow所做的事情:

<mui:ModernWindow x:Class="MyApp.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:mui="http://firstfloorsoftware.com/ModernUI"
    xmlns:local="clr-namespace:MyApp"
    mc:Ignorable="d"
    Title="MyApp" IsTitleVisible="True" Height="350" Width="525" WindowState="Maximized" ContentSource="/Views/SourcePage1.xaml">

<mui:ModernWindow.MenuLinkGroups >
    <mui:LinkGroup x:Name="sourceGroup" DisplayName="Source">
        <mui:LinkGroup.Links>
            <mui:Link x:Name="sourceLink1" DisplayName="File" Source="/Views/SourcePage1.xaml"/>
            <mui:Link x:Name="sourceLink2" DisplayName="Instrumentation" />
        </mui:LinkGroup.Links>
    </mui:LinkGroup>
</mui:ModernWindow.MenuLinkGroups>

在&#34; SourcePage1.xaml&#34;我尝试添加第二个子菜单(ModernMenu的一个实例):

<UserControl x:Class="MyApp.Views.SourcePage1"
         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:mui="http://firstfloorsoftware.com/ModernUI"
         xmlns:local="clr-namespace:MyApp.Views"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">

<Grid x:Name="mainGrid" Margin="0,10,0,0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="2*"/>
        <ColumnDefinition Width="4"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Border x:Name="initialSpacer" Grid.Column="0" Background="Transparent" BorderBrush="DimGray" BorderThickness="2">
        <Grid>
            <Label Content="Ready" FontSize="40" Foreground="DimGray" HorizontalAlignment="Center" VerticalAlignment="Center"/>
        </Grid>
    </Border>

    <GridSplitter Grid.Column="1" Width="4" HorizontalAlignment="Center" VerticalAlignment="Stretch"/>

        <mui:ModernMenu Grid.Column="2">
            <mui:ModernMenu.LinkGroups>
                <mui:LinkGroup DisplayName="Catagory1">
                    <mui:LinkGroup.Links>
                        <mui:Link x:Name="catagory1Link" DisplayName="name1" Source="/Views/SettingsPage.xaml"/>
                        <mui:Link DisplayName="insert" />
                    </mui:LinkGroup.Links>
                </mui:LinkGroup>
                <mui:LinkGroup DisplayName="Catagory2">
                    <mui:LinkGroup.Links>
                        <mui:Link DisplayName="name1" />
                        <mui:Link DisplayName="name2" />
                        <mui:Link DisplayName="name3" />
                    </mui:LinkGroup.Links>
                </mui:LinkGroup>
                <mui:LinkGroup DisplayName="Catagory3">
                    <mui:LinkGroup.Links>
                        <mui:Link DisplayName="name1" />
                    </mui:LinkGroup.Links>
                </mui:LinkGroup>
            </mui:ModernMenu.LinkGroups>
        </mui:ModernMenu>

</Grid>

Where&#34; SettingsPage.xaml&#34;仅用于测试:

<UserControl x:Class="MyApp.Views.SettingsPage"
         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:mui="http://firstfloorsoftware.com/ModernUI"
         xmlns:local="clr-namespace:MyApp.Views"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">

<Grid x:Name="mainGrid" Margin="0,10,0,0">
      <Label Content = "Hi there!"/>     
</Grid>

MainWindows&#39; ModernMenu出现并运作良好。同样,ModernMenu on&#34; SourcePage1.xaml&#34;也显示很好,但我似乎无法分配任何源内容。当我点击已分配内容的任何链接(例如&#34; catagory1Link&#34;)时,不会显示任何内容。这可能是什么问题?我不允许像这样嵌套菜单吗?

2 个答案:

答案 0 :(得分:2)

如你所说,ModernMenu并没有自动导航框架。您可以使用ModernTab,但它会设置另一个ModernFrame,该框架是链接设置源的框架。

ModernMenu确实有一个SelectedLink DependencyProperty。如果将其绑定到usercontrol上的属性,则可以检测链接单击并自行导航框架。

SourcePage1.xaml

<mui:ModernMenu Grid.Column="1" SelectedLink="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=UserControl}, Path=MenuSelectedLink, Mode=OneWayToSource}">

SourcePage1.xaml.cs

using System.ComponentModel;
using System.Runtime.CompilerServices;
using System.Windows.Controls;
using FirstFloor.ModernUI.Presentation;

namespace WpfApp17
{
    public partial class SourcePage1 : UserControl, INotifyPropertyChanged
    {
        public SourcePage1()
        {
            InitializeComponent();
        }

        #region Property Link MenuSelectedLink
        private Link _MenuSelectedLink;
        public Link MenuSelectedLink { get { return _MenuSelectedLink; } set { SetProperty(ref _MenuSelectedLink, value); OnMenuSelectedLinkChanged(); } }
        #endregion

        private void OnMenuSelectedLinkChanged()
        {
            if (MenuSelectedLink == null || MenuSelectedLink.Source == null)
                return;

            // Navigate the frame to the source. 
            var frame = FirstFloor.ModernUI.Windows.Navigation.NavigationHelper.FindFrame(null, this);
            if (frame != null)
            {
                if (frame.Source != MenuSelectedLink.Source)
                    frame.Source = MenuSelectedLink.Source;
            }
        }

        #region INotifyPropertyChanged
        public event PropertyChangedEventHandler PropertyChanged;
        protected bool SetProperty<T>(ref T field, T value, [CallerMemberName]string name = null)
        {
            if (Equals(field, value))
            {
                return false;
            }
            field = value;
            this.OnPropertyChanged(name);
            return true;
        }
        protected void OnPropertyChanged([CallerMemberName]string name = null)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(name));
        }
        #endregion
    }
}

答案 1 :(得分:0)

J.H。的解决方案是正确的,我已将其标记为正确。我只改变了一些东西以获得我正在寻找的行为:我创建了一个新的UserControl,其中包含一个&#34; ModernMenu&#34;网格第一行中的对象和&#34; ModernFrame&#34;在第二行。该框架命名为&#34; pageFrame&#34;。然后,我只是在新的UserControls菜单链接发生变化时直接将内容添加到pageFrame中。代码隐藏文件:

        private void OnMenuSelectedLinkChanged()
    {
        if (MenuSelectedLink == null || MenuSelectedLink.Source == null)
            return;

        // Navigate the frame to the source. 
        pageFrame.Source = MenuSelectedLink.Source;
    }