diff --git a/docs/docs/documentation/getting-started/installation.md b/docs/docs/documentation/getting-started/installation.md index 7105db360..06ddadaa9 100644 --- a/docs/docs/documentation/getting-started/installation.md +++ b/docs/docs/documentation/getting-started/installation.md @@ -53,13 +53,9 @@ Visit [SukiUI on Nuget](https://www.nuget.org/packages/SukiUI) for more informat 5. Select `SukiUI.dll` you downloaded -6. Add a Nuget package `System.Reactive` - ::: tip The package list should be: ![](/getting-started/introduction-final-package-list.webp "package list") - -If installed by referencing `.dll`, there should be a `System.Reactive` here. ::: diff --git a/docs/docs/documentation/getting-started/launch.md b/docs/docs/documentation/getting-started/launch.md index 94d06b160..d6f71483e 100644 --- a/docs/docs/documentation/getting-started/launch.md +++ b/docs/docs/documentation/getting-started/launch.md @@ -66,7 +66,6 @@ public partial class MainWindow : Window Modified `MainWindow.axaml.cs`: - ```csharp using SukiUI.Controls; // [!code highlight] @@ -85,9 +84,6 @@ public partial class MainWindow : SukiWindow // [!code highlight] You're now ready to use SukiUI ! We advise you to theme your app now. Please check the [Theming Page](https://kikipoulet.github.io/SukiUI/documentation/theming/basic.html) and the [SukiWindow Page](https://kikipoulet.github.io/SukiUI/documentation/controls/layout/sukiwindow.html) - - - ::: warning If you encounter the following exception: - `SukiWindow` not found [Issue#265](https://github.com/kikipoulet/SukiUI/issues/265) @@ -98,4 +94,4 @@ If you encounter the following exception: There are two possible solutions to try: - Upgrade or downgrade the version of `Avalonia` and `SukiUI` until the exception is resolved - While ensuring that `Avalonia` is up to date (beta), reference the build `.dll` from [Github Action](https://github.com/kikipoulet/SukiUI/actions/workflows/build.yml) and proceed with the [following steps](/documentation/getting-started/installation#via-github-action) -::: +::: \ No newline at end of file diff --git a/docs/docs/documentation/hosts/dialog.md b/docs/docs/documentation/hosts/dialog.md index 5a1beb8ca..d663db1d4 100644 --- a/docs/docs/documentation/hosts/dialog.md +++ b/docs/docs/documentation/hosts/dialog.md @@ -7,6 +7,7 @@ The host is designed in such a way as to be MVVM friendly and as long as you hav Here is a simple example setup using MVVM: ### View + ```xml @@ -17,6 +18,7 @@ Here is a simple example setup using MVVM: ``` ### ViewModel + ```cs public class ExampleViewModel { @@ -28,6 +30,7 @@ public class ExampleViewModel If you do not wish to use MVVM, or would rather a simpler solution that "just works", then you can choose to implement it like this: ### AXAML + ```xml @@ -36,7 +39,9 @@ If you do not wish to use MVVM, or would rather a simpler solution that "just wo ``` + ### Code-Behind + ```cs public class MainWindow : SukiWindow { @@ -105,11 +110,11 @@ public void DisplayDialog() { dialogManager.CreateDialog() .WithActionButton("Don't Close", _ => { }) - .WithActionButton("Close ", _ => { }, true) // last parameter optional + .WithActionButton("Close ", _ => { }, true) // last parameter optional .TryShow(); } ``` ## MessageBox Style -It is possible to use the `.OfType()` method to cause the dialog to use an included MessageBox style, the styles included are: Information, Success, Warning and Error. \ No newline at end of file +It is possible to use the `.OfType()` method to cause the dialog to use an included MessageBox style, the styles included are: `Information`, `Success`, `Warning` and `Error`. \ No newline at end of file diff --git a/docs/docs/zh/documentation/getting-started/installation.md b/docs/docs/zh/documentation/getting-started/installation.md index 6d9dc692c..2bd916918 100644 --- a/docs/docs/zh/documentation/getting-started/installation.md +++ b/docs/docs/zh/documentation/getting-started/installation.md @@ -48,12 +48,8 @@ dotnet add package SukiUI --version 6.0.0 5. 选择刚刚下载的 `SukiUI.dll` 并添加 -6. 添加 Nuget 包 `System.Reactive` - ::: tip 最终，你的包列表应为： ![](/getting-started/introduction-final-package-list.webp "package list") - -如果你是以引用`dll`的方式安装的，此处应有 `System.Reactive` ::: \ No newline at end of file diff --git a/docs/docs/zh/documentation/getting-started/launch.md b/docs/docs/zh/documentation/getting-started/launch.md index 716dd6a18..7869b5bd2 100644 --- a/docs/docs/zh/documentation/getting-started/launch.md +++ b/docs/docs/zh/documentation/getting-started/launch.md @@ -15,6 +15,10 @@ ``` +::: warning +如果没有设置主题颜色 `ThemeColor`，创建的窗口和许多控件都将完全透明 +::: + ## 将 MainWindow 更改为 SukiWindow 原来的 `MainWindow.axaml`: @@ -60,7 +64,6 @@ public partial class MainWindow : Window 修改后的 `MainWindow.axaml.cs`: - ```csharp using SukiUI.Controls; // [!code highlight] diff --git a/docs/docs/zh/documentation/hosts/dialog.md b/docs/docs/zh/documentation/hosts/dialog.md index 7a4bed0fc..ed1217244 100644 --- a/docs/docs/zh/documentation/hosts/dialog.md +++ b/docs/docs/zh/documentation/hosts/dialog.md @@ -2,4 +2,119 @@ SukiUI 提供了一个用于弹出对话框的[可选窗口控件](./hosts)，该控件可以很轻易地在 `SukiWindow.Hosts` 添加（这也是最推荐且能达到最佳效果的使用方法） -该对话框对 MVVM 设计模式友好，同时你也可以通过 `ISukiDialogManager` 来获得给定的 `SukiDialogHost` 实例，从而显示对话框。 \ No newline at end of file +该对话框对 MVVM 设计模式友好，同时你也可以通过 `ISukiDialogManager` 来获得给定的 `SukiDialogHost` 实例，从而显示对话框。 + +以下是一些 MVVM 设计模式下使用的例子： + +### View + +```xml + + + + + + +``` + +### ViewModel + +```cs +public class ExampleViewModel +{ + public ISukiDialogManager DialogManager { get; } = new SukiDialogManager(); +} +``` +--- + +如果你并未使用 MVVM 设计模式，只是想做一些简单实现，可以参考以下方法： + +### AXAML + +```xml + + + + + + +``` + +### Code-Behind + +```cs +public class MainWindow : SukiWindow +{ + public static ISukiDialogManager DialogManager = new SukiDialogManager(); + + public MainWindow() + { + InitializeComponent(); + DialogHost.Manager = DialogManager; + } +} +``` + +### 用法 + +```cs +MainWindow.DialogManager.CreateDialog() + .TryShow(); +``` + +## 显示对话框 + +为了创建和显示对话框，SukiUI 提供了一种现代的构建方式。你可以在 `ISukiDialogManager` 实例上调用 `.CreateDialog()` 方法来开始构建对话框。 + +接下来，通过链式调用可以轻松设置对话框的标题、内容等。所有方法都有相应的 XML 注释说明。 + +构建完对话框后，调用 `.TryShow()` 方法即可显示对话框，前提是当前没有其他对话框正在显示。 + +例如，下面是一个简单的对话框示例： + +```cs +public void DisplayDialog() +{ + DialogManager.CreateDialog() + .WithTitle("示例对话框") + .WithContent("这里是示例对话框的内容。") + .TryShow(); +} +``` + +## 关闭对话框 + +默认情况下，对话框没有自动关闭机制。要添加关闭方式，可以使用 `.Dismiss()` 方法。目前最常见的方式是 `.ByClickingBackground()`，即用户点击对话框外部时关闭对话框。 + +例如，下面的代码展示了一个点击背景即可关闭的空对话框： + +```cs +public void DisplayDialog() +{ + DialogManager.CreateDialog() + .Dismiss().ByClickingBackground() + .TryShow(); +} +``` + +另一种关闭对话框的方式是通过操作按钮，接下来将介绍这一点。 + +## 交互操作 + +你可以通过 `.WithActionButton()` 方法为对话框添加按钮。该方法可以设置按钮的文字、点击后的回调操作，并且可以选择性地通过 `dismissOnClick` 参数来控制点击后是否关闭对话框。你也可以添加多个按钮，根据需要设置不同的操作。 + +以下是一个包含两个按钮的对话框示例，其中一个按钮会关闭对话框： + +```cs +public void DisplayDialog() +{ + DialogManager.CreateDialog() + .WithActionButton("保持打开", _ => { }) + .WithActionButton("关闭", _ => { }, true) // 点击后关闭对话框 + .TryShow(); +} +``` + +## 消息框样式 + +你还可以通过 `.OfType()` 方法为对话框应用内置的消息框样式，目前支持的信息类型包括：`Information`, `Success`, `Warning` 和 `Error`。 \ No newline at end of file