Система макета, Microsoft Docs
У цьому розділі описується система макета Windows Presentation Foundation (WPF). Для створення інтерфейсів користувача в WPF важливе розуміння того, як і коли відбуваються обчислення макета.
У цьому розділі містяться такі підрозділи.
Обмежувальні прямокутники елемента
Вимірювання та розташування дочірніх елементів
Елементи панелі та розширення функціональності макета
Питання продуктивності макета
Субпіксельна візуалізація та округлення макета
Обмежувальні прямокутники елемента
При плануванні макета в WPF важливо розуміти принцип функціонування прямокутників, що обмежують, які оточують усі елементи. Кожен FrameworkElement, оброблений макетом системи, можна розглядати як прямокутник, вставлений у макет. Клас LayoutInformation повертає межі області, виділеної макетом для елемента, або комірки. Розмір цього прямокутника визначається шляхом обчислення доступного простору екрана, розміру будь-яких обмежень, властивостей макета (таких як поля та заповнення), а також індивідуальної поведінки батьківського елемента Panel. Обробляючи ці дані, система макету може обчислити становище всіх нащадків конкретного елемента Panel. Важливо пам'ятати, що характеристики розмірів, визначені для батьківського елемента, такого, як Border, впливають на його дочірні елементи.
На наступному малюнку наведено простий макет.
Цей макет можна отримати за допомогою наступного XAML.
Один елемент керування TextBlock розташований в елементі керування Grid. Хоча текст заповнює тільки верхній лівий кут першого стовпця, виділений простір для TextBlock насправді набагато більше.Обмежуючий прямокутник будь-якого елемента FrameworkElement можна вилучити за допомогою методу GetLayoutSlot. На наступному малюнку показано обмежуючий прямокутник для елемента TextBlock.
Як показано жовтим прямокутником, виділений простір для елемента TextBlock фактично набагато більший за простір, в якому він відображається. При додаванні додаткових елементів до Grid цей розподіл може стискатися або розтягуватися залежно від типу та розміру елементів, що додаються.
Комірка макету елемента TextBlock передається в об'єкт Path за допомогою методу GetLayoutSlot. Цей спосіб може бути корисним для відображення обмежуючого прямокутника елемента.
Система макета
У найпростішому випадку макет є рекурсивною системою, яка змінює розмір та розташування елемента та відображає його на екрані. Зокрема, макет описує процес вимірювання та розташування членів колекції Children елемента Panel. Макет є інтенсивним процесом. Чим більша колекція Children, тим більший обсяг обчислень має бути виконаний. Складність може бути викликана поведінкою макета, що визначається елементом Panel, якому належить колекція. Відносно простий макет Panel, такий як Canvas, може мати кращу продуктивність ніж складніший макет Panel, такий як Grid.
Щоразу, коли дочірній елемент UIElement змінює своє становище, він потенційно може запустити новий прохід системи макета. Таким чином, важливо розуміти події, які може викликати система макета, оскільки непотрібний виклик може призвести до погіршення продуктивності програми. Далі описується процес, що виникає під час виклику системи макета.
Дочірній елемент UIElement починає процес макета звиміру його основних властивостей.
Обчислюються розмірні властивості, визначені в елементі FrameworkElement. Такими властивостями є Width, Height та Margin.
Застосовується спеціальна логіка Panel, така як напрямок Dock або накладання Orientation.
Вміст розташовується після того, як усі нащадки були виміряні.
Колекція Children з'являється на екрані.
Процес знову викликається, якщо до колекції додаються додаткові Children, застосовується LayoutTransform або викликається метод UpdateLayout.
Цей процес та порядок його виклику докладніше розглядаються в наступних розділах.
Вимірювання та розташування дочірніх елементів
Система макету здійснює два проходи для кожного члена колекції Children, прохід вимірювання та прохід компонування. Кожен дочірній елемент Panel надає свої власні методи MeasureOverride та ArrangeOverride, щоб досягти власної певної поведінки макета.
Під час виконання виміру оцінюється кожен член колекції Children. Процес починається з виклику методу Measure. Цей метод викликається у реалізації батьківського елемента Panel; він не повинен викликатися явно для виклику макета.
По-перше, обчислюються власні властивості розміру UIElement, такі як Clip та Visibility. Це створює значення з ім'ям constraintSize, яке передається в метод MeasureCore.
Потім обробляються властивості структури, визначені в елементі FrameworkElement. Це впливає на значення constraintSize. Ці властивості в основному описують розмірні характеристики базового елемента UIElement, наприклад Height, Width, Margin і Style. Кожна з цих властивостей може змінити простір, необхідний для відображення елемента. Потім викликається метод MeasureOverride зпараметром constraintSize.
Властивості Height, Width, ActualHeight і ActualWidth розрізняються. Наприклад, властивість ActualHeight є значенням, що обчислюється на основі інших висот, що вводяться, і системи макета. Значення задається самою системою макета на основі фактичного проходження візуалізації, а тому може трохи відставати від установки значень властивостей, наприклад He , які є основою зміни введення.
Оскільки ActualHeight є значенням, що обчислюється, слід мати на увазі, що в результаті різних операцій, що виконуються системою макета, з цим значенням можуть проводитися багаторазові або додаткові сполучені зміни. Система макета може обчислювати необхідне місце вимірювання для дочірніх елементів, обмеження батьківського елемента і т. д. .
Кінцевою метою проходу вимірювання для дочірнього елемента є визначення його DesiredSize, яке відбувається під час виклику методу MeasureCore. Значення DesiredSize зберігається методом Measure для використання під час процесу компонування вмісту.
Процес компонування починається із виклику методу Arrange. Під час проходу компонування батьківський елемент Panel створює прямокутник, який представляє межі нащадка. Це значення передається методу ArrangeCore для обробки.
Метод ArrangeCore оцінює властивість DesiredSize дочірнього елемента та оцінює всі додаткові межі, які можуть вплинути на відображуваний розмір елемента. Метод ArrangeCore створює параметр arrangeSize, який передається методу ArrangeOverride об'єкта Panel як параметр. Метод ArrangeOverride створює finalSize дочірнього об'єкта. Нарешті, метод ArrangeCore виконує остаточну оцінку властивостей зсуву, таких як межі та вирівнювання, тапоміщає дочірній об'єкт у його комірку макету. Дочірній об'єкт не повинен обов'язково заповнювати весь виділений простір (і в більшості випадків не робить цього). Потім елемент керування повертається до батьківського об'єкта Panel і обробка макета завершується.
Елементи панелі та розширення функціональності макета
WPF має групу елементів, похідних від Panel. Ці елементи Panel включають багато складних макетів. Наприклад, вкладені елементи можна легко отримати за допомогою елемента StackPanel, у той час як складніші і вільно розташовуються макети створюються за допомогою Canvas.
У наступній таблиці перелічені доступні елементи макету Panel.
Визначає область, всередині якої можна явно розмістити дочірні елементи за допомогою відносних координат в області Canvas.
Визначає область, всередині якої можна впорядкувати дочірні елементи по горизонталі або по вертикалі щодо один одного.
Визначає гнучку область сітки, що складається зі стовпців та рядків.
Має дочірні елементи в один рядок, який можна орієнтувати по горизонталі або по вертикалі.
Надає структуру елементів Panel, які віртуалізують свою колекцію дочірніх даних. Цей клас є абстрактним.
Розміщує дочірні елементи послідовно зліва направо, розбиваючи вміст до наступного рядка на краю вікна. Подальше впорядкування відбувається послідовно згори донизу або праворуч наліво, залежно від значення властивості Orientation.
Для додатків, яким потрібно макет, який неможливо створити за допомогою будь-якого з попередньо визначених елементів Panel, розширення функціональності макета можна отримати шляхом успадкуванняз Panel і перевизначення методів MeasureOverride та ArrangeOverride. Приклад див. на сторінці Приклад "Custom Radial Panel" (сторінка може відображатися англійською мовою)
Питання продуктивності макета
Макет є рекурсивним процесом. Всі дочірні елементи в колекції Children обробляються при кожному виклику макету. Це означає, що слід уникати запуску системи макету за відсутності необхідності. Виконання наступних рекомендацій допоможе досягти вищої продуктивності.
Слід враховувати, що певні зміни значень властивостей можуть призвести до виконання макету рекурсивного оновлення.
Властивості залежностей, значення яких можуть призвести до ініціалізації системи макета. позначаються загальними прапорами. Властивості AffectsMeasure та AffectsArrange надають корисні вказівки про те, які зміни значень властивостей викликають рекурсивне оновлення системи макету. Загалом будь-яка властивість, яка може вплинути на розмір обмежуючого прямокутника елемента, повинна мати прапор AffectsMeasure, встановлений у true. Для отримання додаткових відомостей див. Загальні відомості про властивості залежності.
Рекомендується використовувати властивість RenderTransform замість LayoutTransform скрізь, де це можливо.
LayoutTransform - це зручний спосіб визначення вмісту user interface (UI). Однак, якщо результат перетворення не впливає на положення інших елементів, рекомендується використовувати властивість RenderTransform, оскільки RenderTransform не викликає системи макету. Властивість LayoutTransform застосовує своє перетворення і викликає рекурсивне оновлення макета для врахування нового положення елемента.
Уникайте непотрібних викликів UpdateLayout.
Метод UpdateLayout викликаєрекурсивне оновлення макета, що часто не потрібне. Якщо немає впевненості у необхідності оновлення, слід надати виклик цього методу системі макету.
При роботі з великою колекцією Children рекомендується розглянути можливість використання VirtualizingStackPanel замість звичайного StackPanel.
Віртуалізація дочірньої колекції призводить до того, що VirtualizingStackPanel зберігає в пам'яті лише ті об'єкти, які зараз знаходяться всередині батьківського елемента ViewPort. Внаслідок цього продуктивність значно збільшується в більшості скриптів.
Субпіксельна візуалізація та округлення макета
Графічна система WPF використовує апаратно-незалежні модулі для підтримки роздільної здатності та незалежності від пристрою. Кожен незалежний від пристрою піксель автоматично масштабується згідно з параметрами системи dots per inch (dpi). Це забезпечує програмам WPF коректне масштабування для різних параметрів dpi та автоматично надає програмам підтримку dpi.
Однак ця незалежність dpi може створити нерівномірну візуалізацію кордонів через згладжування. Ці ефекти, які зазвичай виглядають як змащені або напівпрозорі межі, можуть з'явитися, коли положення кордону потрапляє в середину пікселя пристрою, а не між пікселями. У системі макету є спосіб налаштування меж за допомогою округлення макету. Округлення макета відбувається, коли система макета округляє всі нецілочисленні пікселі під час проходу макета.
За промовчанням округлення макету вимкнено. Щоб увімкнути округлення макета, слід встановити властивість UseLayoutRounding у значення true у будь-якому елементі FrameworkElement. Оскільки це властивість залежностей, значення буде поширене на вседочірніх об'єктів у візуальному дереві. Щоб увімкнути округлення макета для всього інтерфейсу користувача, слід встановити властивість UseLayoutRounding у значення true в кореневому контейнері. Приклад див. у розділі UseLayoutRounding.