Avalonia UI
首页支持GitHub 仓库English Doc
  • 👋欢迎
  • 文档
    • ⚡快速开始
      • IDE 支持
        • JetBrains Rider 设置
      • 使用 Avalonia 开发
        • Model-View-ViewModel 模式(MVVM)
        • 控件和布局
        • 数据绑定
        • 图像和动画
      • Windows
      • UserControls
      • 资产
      • 开发者工具
      • 错误和警告日志
      • 未处理的异常
      • 应用生命周期
    • 🔁数据绑定
      • 数据上下文
      • 变化通知
      • 绑定
      • 编译绑定
      • 与控件绑定
      • 转换绑定值
      • 绑定到命令
      • 绑定到任务和可观察对象
      • 使用代码进行绑定
      • 在控件模板中实现绑定
      • 绑定Classes
      • 创建和绑定到附加属性
      • Data Validation
    • 🎨样式
      • 样式
      • 选择器
      • 资源
      • 疑难解答
    • 🧰控件
      • AutoCompleteBox
      • Border
      • Buttons
        • Button
        • RepeatButton
        • RadioButton
        • ToggleButton
        • ButtonSpinner
        • SplitButton
        • ToggleSplitButton
      • Calendar
      • Canvas
      • Carousel
      • CheckBox
      • ComboBox
      • ContentControl
      • ContextMenu
      • Decorator
      • DataGrid
        • DataGridColumns
      • DatePicker
      • DockPanel
      • Expander
      • Flyouts
      • Grid
      • GridSplitter
      • Image
      • ItemsControl
      • ItemsRepeater
      • LayoutTransformControl
      • ListBox
      • MaskedTextBox
      • Menu
      • NativeMenu
      • NumericUpDown
      • Panel
      • ProgressBar
      • RelativePanel
      • ScrollBar
      • ScrollViewer
      • Separator
      • Slider
      • SplitView
      • StackPanel
      • TabControl
      • TabStrip
      • TextBlock
      • TrayIcon
      • TreeDataGrid
        • Creating a Hierarchical TreeDataGrid
        • Creating a Flat TreeDataGrid
        • TreeDataGrid column types
      • TimePicker
      • TextBox
      • ToolTip
      • TreeView
      • TransitioningContentControl
      • UserControl
      • Viewbox
      • Window
      • WrapPanel
    • 📚模板
      • 数据模板
      • 在代码中创建数据模板
      • 实现 IDataTemplate 接口
    • ✏️自定义控件
      • 控件类别
      • 定义属性
    • 🖱️输入
      • 路由事件
      • 剪贴板
      • 鼠标与触控设备
      • 快捷键
    • 🔑动画
      • 关键帧动画
      • 过渡
      • 页面过渡
    • 📐布局
      • 面板概述
      • Alignment、Margin 和 Padding
      • 创建自定义面板
    • 📦发布/分发
      • macOS
  • API 参考
    • 🗒️命名空间
      • Avalonia
      • Avalonia.Animation
        • Avalonia.Animation.Easings
        • Avalonia.Animation.Animators
      • Avalonia.Collections
      • Avalonia.Controls
      • Avalonia.Data
        • Avalonia.Data.Core.Plugins
        • Avalonia.Data.Core
        • Avalonia.Data.Converters
      • Avalonia.Diagnostics
      • Avalonia.Dialogs
  • 指南
    • 🐣基础
      • XAML 介绍
      • Code-behind
      • MVVM 架构
      • 在UI线程上操作
    • 🤿深入
      • 在树莓派上运行你的应用
      • 在树莓派上运行你的应用(使用Raspbian Lite)
      • ReactiveUI
        • 视图激活机制
        • 路由
        • 数据持久化
        • 绑定到 Sorted/Filtered 数据
    • 👩‍💻👩💻 开发人员指南
      • 🏭从源代码中构建 Avalonia
      • Avalonia 与 WPF 和 UWP 之间的比较
      • Debugging Previewer
      • Debugging the XAML compiler
      • macOS 开发
      • Release Process
      • 维护稳定的分支
  • 教程
    • 📋待办事项应用
    • 📻音乐商店应用
    • 🕸️在浏览器中运行
    • 📱为移动设备开发
  • 杂项
    • 👪社区
    • 🖥️WPF 开发者建议
    • 📋正在使用 Avalonia 的项目
    • ❔常见问题
由 GitBook 提供支持
在本页
  • Logical Tree 和 Visual Tree
  • 属性
  • 布局
  • 样式
  • 事件
  • 控制台
  • 快捷键
  • 示例
  • 更改属性值
  • 更改布局属性

这有帮助吗?

在GitHub上编辑
  1. 文档
  2. 快速开始

开发者工具

Avalonia 有一个内置的 DevTools 窗体,通过在 Window 的构造函数中调用附加的 AttachDevTools() 方法来启用该窗口。当程序在 DEBUG 模式下编译时,默认模板会开启此功能:

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }
}

// in auto-generated by Avalonia.NameGenerator MainWindow.g.cs:
partial class MainWindow
{
    // ...
    public void InitializeComponent(bool loadXaml = true, bool attachDevTools = true)
    {
        // ...
#if DEBUG
        if (attachDevTools)
        {
            this.AttachDevTools();
        }
#endif
        // ...
    }
}

要打开 DevTools,请按 F12,或向 this.AttachDevTools() 方法传递不同的 Gesture 以设置不同的快捷键。

从 release 0.10 版本开始,要使用 DevTools,必须添加 Avalonia.Diagnostics nuget 包。

dotnet add package Avalonia.Diagnostics --version 0.10.0

在 .NET core 2.1 下运行时存在一个已知问题,即按 F12 将导致程序退出。在这种情况下,或者切换到 .NET core 2.0 或 3.0+,或者更改快捷键,例如 Ctrl+F12。

Logical Tree 和 Visual Tree

Logical Tree 和 Visual Tree 选项卡展示了控件在窗体中的逻辑树和视觉树。选中一个控件后,右侧的窗格中会显示该控件的属性,可以在这个窗格中编辑该控件的属性。

属性

允许快速查看和编辑控件的属性。还可以搜索属性(通过名称或使用正则表达式)。

列名
描述

Property

属性的名称

Value

属性的当前值

Type

当前值的类型

Priority

值的优先级

布局

允许检查和编辑常用布局属性(Margin, Border , Padding) 还显示了控件大小和大小约束。

如果 Width 或 Height 带下划线,则表示存在活动约束。将光标悬停在该值上可查看包含相关信息的工具提示。

样式

此外,可以看到可能与此控件匹配的所有样式(通过切换 Show inactive 选项)。

当前样式可以通过按下 Snapshot 按钮或在悬停在目标窗口上时按下 Alt+S 记录快照。快照意味着样式面板不会随着控件的状态变化而更新。这在排除有 :pointerover 或 :pressed 的选择器的问题时特别有用。

如果赋值器的值绑定了一个资源,它将指示成一个圆圈后接资源键的形式。

如果给定的值含有删除线,则表示该值被具有更高优先级的样式中的值覆盖了。

赋值器有一个上下文菜单,能够快速将名称和值复制到剪贴板。

事件

事件名称或控件类型下面的点下划线示意可以快速导航。

  • 双击事件类型将选择并滚动到给定的事件类型

  • 双击控件类型(和/或名称)将导航到可视化树选项卡并选中该控件。

控制台

可以使用 View → Console 菜单显示控制台。控制台实现了一个 C# REPL,它可以用来运行任意的 C# 代码。在控制台会话中,可以使用以下预定义变量:

  • help: 输出帮助信息

  • e: 在逻辑树或可视化树中当前选中的控件

  • root: 视觉树的根

快捷键

按键组合
功能

Alt+S

启用快照样式

Alt+D

禁用快照样式

CTRL+Shift

通过指针定位控件

CTRL+Alt+F

冻结切换的弹出框

示例

更改属性值

更改布局属性

上一页资产下一页错误和警告日志

最后更新于2年前

这有帮助吗?

面板显示了当前属性的活动值(active values),样式面板显示了所有值和值的来源。

事件选项卡用来跟踪 的传播。在左窗格中选择要跟踪的事件,该类型的所有事件都将显示在中上部分的窗格中。可以选择其中一个事件查看事件路由。

⚡
事件
属性