Инструменты разработчика

В Avalonia есть встроенное окно DevTools, которое активируется вызовом подключенного метода AttachDevTools() в конструкторе Window. В шаблонах по умолчанию это включено, когда программа компилируется в режиме 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 или передайте другой Gesture методу this.AttachDevTools().

Начиная с версии 0.10, чтобы использовать DevTools, необходимо добавить пакет nuget Avalonia.Diagnostics.

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) отображаются элементы управления в логическом и визуальном деревьях окна. При выборе элемента управления свойства этого элемента управления отображаются на правой панели, где их можно редактировать.

Свойства|Properties

Позволяют быстро проверять и редактировать свойства элемента управления. Также можно искать свойства (по имени или с помощью регулярного выражения).

Столбец	Описание
Свойство	Название свойства
Значение	Текущее значение свойства
Тип	Тип текущего значения
Приоритет	Приоритет значения

Макет

Позволяет проверять и редактировать общие свойства макета (поле, граница, отступы). Также показаны размер элемента управления и ограничения размера.

Если ширина или высота подчеркнуты, это означает наличие активного ограничения. Наведите указатель мыши на значение, чтобы увидеть всплывающую подсказку с соответствующей информацией.

Стили

В то время как панель свойств показывает текущие активные значения свойств, панель стилей показывает все значения и происхождение значения.

Кроме того, можно увидеть все стили, которые потенциально могут соответствовать этому элементу управления (путем переключения опции Показать неактивные).

Текущие стили можно сделать снимком, нажав кнопку «Снимок» или нажав Alt+S при наведении указателя мыши на целевое окно. Снимок означает, что панель стилей не будет обновляться, чтобы отражать новое состояние элемента управления. Это особенно полезно при устранении неполадок с селекторами :pointerover или :pressed.

Если значение установщика привязано к ресурсу, оно будет обозначено кружком, за которым следует ключ ресурса.

Если заданное значение перечеркнуто, это означает, что оно переопределяется значением в стиле с более высоким приоритетом.

У сеттеров есть контекстное меню, которое позволяет быстро копировать имена и значения в буфер обмена.

События

Вкладку событий можно использовать для отслеживания распространения событий. Выберите события для отслеживания на левой панели, и все события этого типа будут показаны в центральной верхней панели. Выберите одно из этих событий, чтобы просмотреть маршрут события.

Пунктирное подчеркивание под названием события или типом элемента управления означает, что возможна быстрая навигация.

• Двойной щелчок по типу события выберет и прокрутит до данного типа события.
• Двойной щелчок по типу элемента управления (и/или имени) приведет к переходу на вкладку визуального дерева и выбору указанного элемента управления.

Консоль

Консоль можно отобразить с помощью меню «Вид» → «Консоль». Консоль реализует C# REPL, который можно использовать для запуска произвольного кода C#. В сеансе консоли доступны следующие предопределенные переменные:

• help: Отображает справочное сообщение
• e: Элемент управления, выбранный в данный момент в логическом или визуальном дереве.
• root: корень визуального дерева

Горячие клавиши

Комбинация	Функция
Alt+S	Включить стили снимков
Alt+D	Отключить стили снимков
CTRL+Shift	Проверить элемент управления над указателем
CTRL+Alt+F	Переключить заморозку всплывающего окна

Примеры

Изменение значения свойства

Изменение свойств макета