CrissCross.MAUI 2.0.6

CrissCross

基于 ReactiveUI 的项目的导航框架

什么是 CrissCross？

CrissCross 是一个基于 ReactiveUI 的项目的导航框架。它旨在与 ReactiveUI 一起使用，但也可以适配用于任何 MVVM 框架。

为什么选择 CrissCross？

CrissCross 被设计成一个简单、轻量级且易于使用的导航框架。它旨在与 ReactiveUI 一起使用。

如何使用 CrissCross？

步骤 1: 安装 CrissCross

CrissCross 可在 NuGet 上使用。您可以使用 NuGet 包管理器安装它

Install-Package CrissCross

或

Install-Package CrissCross.WPF

或

Install-Package CrissCross.XamForms

或

Install-Package CrissCross.MAUI

或

Install-Package CrissCross.Avalonia

或

Install-Package CrissCross.WinForms

步骤 2: 创建 ViewModel

创建一个继承自 RxObject 的 ViewModel。这是用于 MainWindow 的 ViewModel。

    public class MainWindowViewModel : RxObject
    {
        public MainWindowViewModel()
        {
            this.BuildComplete(() =>
            {
                // Do something when the IOC Container is built
            });

            // Setup the IOC Container
            Locator.CurrentMutable.RegisterConstant<MainViewModel>(new());
            Locator.CurrentMutable.Register<IViewFor<MainViewModel>>(() => new MainView());

            Locator.CurrentMutable.RegisterConstant<FirstViewModel>(new());
            Locator.CurrentMutable.Register<IViewFor<FirstViewModel>>(() => new FirstView());
            
            // Notify the application that the IOC Container that it is complete and ready to use.
            Locator.CurrentMutable.SetupComplete();
        }
    }

步骤 3: 创建视图

创建一个继承自 NavigationWindow 的视图。这是用于 MainWindow 的视图。在 XAML 中 Window 继承处添加 xmlns:rxNav="https://github.com/reactivemarbles/CrissCross"。将 Window 更改为 rxNav:NavigationWindow。添加 x:TypeArguments="local:MainWindowViewModel"。

    public partial class MainWindow : NavigationWindow<MainWindowViewModel>
    {
        public MainWindow()
        {
            // Remember to set x:Name in XAML to "mainWindow"
            InitializeComponent();
            
            this.WhenActivated(disposables =>
            {
                // Do something when the View is activated

                // Configure the Navigation for the MainWindow
                NavBack.Command = ReactiveCommand.Create(() => this.NavigateBack(), CanNavigateBack).DisposeWith(d);
                
                // Navigate to the MainViewModel
                this.NavigateToView<MainViewModel>();
            });
        }
    }

步骤 4：创建一个 ViewModel

创建一个继承自 RxObject 的 ViewModel。这是用于 MainView 的 ViewModel。

    public class MainViewModel : RxObject
    {
        public MainViewModel()
        {
            this.BuildComplete(() =>
            {
                // Do something when the IOC Container is built

                // Configure the Navigation for the MainViewModel using, you will pass the name of the Navigation Host Window that you want to navigate with.
                this.NavigateBack("mainWindow")
                this.CanNavigateBack("mainWindow")
                this.NavigateToView<FirstViewModel>("mainWindow")
            });
        }
    }

步骤 5：创建一个视图

创建一个继承自 ReactiveUserControl 的视图。这是用于 MainView 的视图。

    public partial class MainView : ReactiveUserControl<MainViewModel>
    {
        public MainView()
        {
            InitializeComponent();

            this.WhenActivated(disposables =>
            {
                // Do something when the View is activated
            });
        }
    }

步骤 6：需要时为 WPF 应用配置单实例程序

如果您想防止同一时间运行多个应用实例，可以使用 Make.SingleInstance 方法。

    protected override void OnStartup(StartupEventArgs e)
    {
        // This will prevent multiple instances of the application from running at the same time.
        Make.SingleInstance("MyUniqueAppName ddd81fc8-9107-4e33-b848-cac4c3ec3d2a");
        base.OnStartup(e);
    }

步骤 7：运行应用

运行应用，您应该能看到 MainView。

Avalonia

步骤 1: 安装 CrissCross

CrissCross 可在 NuGet 上使用。您可以使用 NuGet 包管理器安装它

Install-Package CrissCross.Avalonia

步骤 2: 创建 ViewModel

创建一个继承自 RxObject 的 ViewModel。这是用于 MainWindow 的 ViewModel。

    public class MainWindowViewModel : RxObject
    {
        public MainWindowViewModel()
        {
            this.BuildComplete(() =>
            {
                // Do something when the IOC Container is built
            });

            // Setup the IOC Container
            Locator.CurrentMutable.RegisterConstant<MainViewModel>(new());
            Locator.CurrentMutable.Register<IViewFor<MainViewModel>>(() => new MainView());

            Locator.CurrentMutable.RegisterConstant<FirstViewModel>(new());
            Locator.CurrentMutable.Register<IViewFor<FirstViewModel>>(() => new FirstView());
            
            // Notify the application that the IOC Container that it is complete and ready to use.
            Locator.CurrentMutable.SetupComplete();
        }
    }

步骤 3：创建一个导航视图

创建一个继承自 NavigationWindow 或 NavigationUserControl 的视图。这是用于 MainWindow 的视图。在 XAML 中添加 xmlns:rxNav="https://github.com/reactivemarbles/CrissCross"。将 Window 更改为 rxNav:NavigationWindow。或将 UserControl 更改为 rxNav:NavigationUserControl。

由于 Avalonia 有两种操作模式，您需要为您的应用选择正确的模式。

    public partial class MainWindow : NavigationWindow<MainWindowViewModel>
    {
        public MainWindow()
        {
            // Remember to set x:Name in XAML to "mainWindow"
            InitializeComponent();
            
            this.WhenActivated(disposables =>
            {
                // Do something when the View is activated

                // Configure the Navigation for the MainWindow
                NavBack.Command = ReactiveCommand.Create(() => this.NavigateBack(), CanNavigateBack).DisposeWith(d);
                
                // Navigate to the MainViewModel
                this.NavigateToView<MainViewModel>();
            });
        }
    }

步骤 4：创建一个 ViewModel

创建一个继承自 RxObject 的 ViewModel。这是用于 MainView 的 ViewModel。

    public class MainViewModel : RxObject
    {
        public MainViewModel()
        {
            this.BuildComplete(() =>
            {
                // Do something when the IOC Container is built

                // Configure the Navigation for the MainViewModel using, you will pass the name of the Navigation Host Window that you want to navigate with.
                this.NavigateBack("mainWindow")
                this.CanNavigateBack("mainWindow")
                this.NavigateToView<FirstViewModel>("mainWindow")
            });
        }
    }

步骤 5：创建一个视图

创建一个继承自 ReactiveUserControl 的视图。这是用于 MainView 的视图。

    public partial class MainView : ReactiveUserControl<MainViewModel>
    {
        public MainView()
        {
            InitializeComponent();

            this.WhenActivated(disposables =>
            {
                // Do something when the View is activated
            });
        }
    }

CrissCross.WPF.Plot

CrissCross.WPF.Plot 是一个为 WPF 应用提供简单数据绘图方式的库。它设计用于与 CrissCross 一起使用。

Adriana Segher 提出了创建一个可以接受反应式数据源的 Plot 之初的概念。然后发展成为用于 CrissCross Wpf 的库。

这个库基于 ScottPlot 构建，为 WPF 应用提供了一种简单绘制反应式数据的方式。

该库可在 NuGet 上找到。您可以使用 NuGet 包管理器安装它。

Install-Package CrissCross.WPF.Plot

当前功能

• 从反应式数据源绘制数据
• 从带有多个系列（目前限制为 9 个）的反应式数据源数组绘制数据
• 通过标尺跟踪
• 缩放和平移
• 拖动缩放区域
• 图的可见性
• 自动缩放/手动缩放
• 启用/禁用图表交互
• 多个 Y 轴

未来功能

• 超过 9 个系列
• 通过属性对话框配置图表
• 轴配置、颜色配置、缩放配置、线条配置
• 具有差异分析的多个标尺
• XY 图的多个 X 轴
• 从大型数据源（如动态数据源）中选择可绘制的数据