WPF Modern UI中链接如何向新开标签页传数据并动态创建页面？

我之前在项目里正好碰到过类似的需求，用Modern UI实现动态IP列表点击加载专属页面，完全不需要预先创建页面，给你分享下具体的实现思路和代码示例，应该能直接适配你的场景。

核心思路 #

Modern UI的ModernFrame支持直接设置Content属性来加载页面，我们可以利用这一点：

• 先定义一个通用的IP详情页模板（UserControl），通过依赖属性接收IP地址参数
• 动态生成ModernList的链接项，把IP地址存在Link的Tag属性里
• 点击列表项时，实例化详情页模板，传入对应IP，然后直接赋值给ModernFrame的Content

具体实现步骤 #

1. 创建通用IP详情页模板：做一个可复用的UserControl，用来展示单个IP的专属内容，通过依赖属性接收IP参数
2. 动态构建ModernList数据源：把动态发现的IP列表转换成Link对象集合，绑定到ModernList
3. 处理列表点击事件：点击时取出对应IP，动态实例化详情页并加载到右侧ModernFrame

代码示例 #

1. 通用IP详情页（IpDetailPage.xaml）

这是我们的动态页面模板，后续每个IP都会生成这个控件的实例：

<UserControl x:Class="YourProjectNamespace.IpDetailPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid Padding="20">
        <StackPanel>
            <TextBlock Text="IP地址详情" FontSize="28" FontWeight="Bold" Margin="0 0 0 10"/>
            <TextBlock Text="{Binding IpAddress}" FontSize="24" Foreground="#FF2196F3"/>
            <!-- 这里可以添加更多IP相关的展示内容，比如设备信息、连接状态等 -->
        </StackPanel>
    </Grid>
</UserControl>

2. 详情页后台代码（IpDetailPage.xaml.cs）

定义依赖属性来接收IP参数，方便绑定和赋值：

using System.Windows;
using System.Windows.Controls;

namespace YourProjectNamespace
{
    public partial class IpDetailPage : UserControl
    {
        // 定义依赖属性，用于接收IP地址
        public static readonly DependencyProperty IpAddressProperty =
            DependencyProperty.Register(nameof(IpAddress), typeof(string), typeof(IpDetailPage), new PropertyMetadata(string.Empty));

        public string IpAddress
        {
            get => (string)GetValue(IpAddressProperty);
            set => SetValue(IpAddressProperty, value);
        }

        public IpDetailPage()
        {
            InitializeComponent();
            DataContext = this; // 把自身设为数据上下文，方便绑定
        }
    }
}

3. 主页面（带ModernList和ModernFrame）

主页面用来展示IP列表和右侧内容区域：

<UserControl x:Class="YourProjectNamespace.MainIpListPage"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mui="http://firstfloorsoftware.com/ModernUI">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="280"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <!-- 左侧IP列表 -->
        <mui:ModernList x:Name="IpModernList" 
                        Grid.Column="0"
                        Margin="10"
                        SelectedItemChanged="IpModernList_SelectedItemChanged"
                        DisplayMemberPath="DisplayName"/>

        <!-- 右侧内容展示区域 -->
        <mui:ModernFrame x:Name="ContentFrame" 
                         Grid.Column="1"
                         Margin="10"
                         NavigationUIVisibility="Hidden"/> <!-- 隐藏默认导航按钮，不需要的话可以去掉 -->
    </Grid>
</UserControl>

4. 主页面后台代码（动态加载IP+处理点击）

using System.Collections.Generic;
using System.Windows;
using System.Windows.Controls;
using FirstFloor.ModernUI.Presentation;

namespace YourProjectNamespace
{
    public partial class MainIpListPage : UserControl
    {
        public MainIpListPage()
        {
            InitializeComponent();
            // 页面加载时动态获取并绑定IP列表
            LoadDynamicIpAddresses();
        }

        private void LoadDynamicIpAddresses()
        {
            // 这里替换成你的动态IP发现逻辑，比如扫描局域网获取IP
            var discoveredIps = new List<string>
            {
                "192.168.1.101",
                "192.168.1.102",
                "192.168.1.103",
                "192.168.1.104"
            };

            // 把IP转换成ModernList需要的Link对象，用Tag存IP地址
            var ipLinks = discoveredIps.Select(ip => new Link
            {
                DisplayName = ip,
                Source = new Uri("/Dummy", UriKind.Relative), // 随便填个Uri，我们不用默认导航逻辑
                Tag = ip
            }).ToList();

            IpModernList.ItemsSource = ipLinks;
        }

        private void IpModernList_SelectedItemChanged(object sender, SelectionChangedEventArgs e)
        {
            // 取出选中的IP
            if (IpModernList.SelectedItem is Link selectedLink && selectedLink.Tag is string targetIp)
            {
                // 动态创建详情页实例，传入IP参数
                var detailPage = new IpDetailPage
                {
                    IpAddress = targetIp
                };

                // 把详情页设置到右侧Frame的Content里
                ContentFrame.Content = detailPage;
            }
        }
    }
}

额外说明 #

• 如果你的IP列表是实时更新的（比如不断发现新IP），只需要重新调用LoadDynamicIpAddresses()或者直接更新IpModernList.ItemsSource即可，ModernList会自动刷新
• 这种方式完全不需要预先在Modern UI的导航系统里注册页面，所有页面都是动态生成的
• 如果需要保留导航历史，可以手动操作ContentFrame.Journal添加条目，但大多数场景下直接替换Content就足够了

内容的提问来源于stack exchange，提问作者shaked nissanov