Селекторы

OfType

<Style Selector="Button">
<Style Selector="local|Button">

new Style(x => x.OfType<Button>());
new Style(x => x.OfType(typeof(Button)));

Выбирает элемент управления по типу. В первом примере выше выбирается класс Avalonia.Controls.Button. Чтобы включить пространство имен XAML в тип, разделите пространство имен и тип символом | .
Этот селектор не соответствует производным типам. Для этого используйте селектор Is.

Обратите внимание, что тип объекта фактически определяется просмотром его свойства IStyleable.StyleKey. По умолчанию это просто возвращает тип текущего экземпляра, но если, например, вы хотите, чтобы ваш элемент управления, наследуемый от Button, был оформлен как Button, вы можете реализовать свойство IStyleable.StyleKey в своем классе для возврата typeof( Button).

Name

<Style Selector="#myButton">
<Style Selector="Button#myButton">

new Style(x => x.Name("myButton"));
new Style(x => x.OfType<Button>().Name("myButton"));

Выбирает элемент управления по его свойству Name с символом #.

Class

<Style Selector="Button.large">
<Style Selector="Button.large:focus">

new Style(x => x.OfType<Button>().Class("large"));
new Style(x => x.OfType<Button>().Class("large").Class(":focus"));

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

Is

<Style Selector=":is(Button)">
<Style Selector=":is(local|Button)">

new Style(x => x.Is<Button>());
new Style(x => x.Is(typeof(Button)));

Это очень похоже на селектор OfType, за исключением того, что он также соответствует производным типам.

Опять же, тип объекта фактически определяется просмотром его свойства IStyleable.StyleKey.

Child

<Style Selector="StackPanel > Button">

new Style(x => x.OfType<StackPanel>().Child().OfType<Button>());

Дочерний селектор определяется путем разделения двух селекторов символом >. Этот селектор соответствует прямым дочерним элементам в логическом дереве, поэтому в приведенном выше примере селектор будет соответствовать любой кнопке, которая является прямым логическим дочерним элементом StackPanel.

Descendant

<Style Selector="StackPanel Button">

new Style(x => x.OfType<StackPanel>().Descendant().OfType<Button>());

Когда два селектора разделены пробелом, селектор будет соответствовать потомкам в логическом дереве, поэтому в этом случае селектор будет соответствовать любой кнопке, которая является логическим потомком StackPanel.

PropertyEquals

<Style Selector="Button[IsDefault=true]">

new Style(x => x.OfType<Button>().PropertyEquals(Button.IsDefaultProperty, true));

Соответствует любому элементу управления, у которого для указанного свойства задано указанное значение.

Примечание. При использовании AttachedProperty в селекторах внутри XAML его необходимо заключать в круглые скобки.

<Style Selector="TextBlock[(Grid.Row)=0]">

Примечание. При использовании в селекторах в XAML свойства должны поддерживать TypeConverter.

Template

<Style Selector="Button /template/ ContentPresenter">

new Style(x => x.OfType<Button>().Template().OfType<ContentPresenter>());

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

Not

<Style Selector="TextBlock:not(.h1)">

new Style(x => x.OfType<TextBlock>().Not(y => y.Class("h1")));

Отменяет внутренний селектор.

Or

<Style Selector="TextBlock, Button">

new Style(x => Selectors.Or(x.OfType<TextBlock>(), x.OfType<Button>()))

Находит элементы, соответствующие любому из этих селекторов. Каждый селектор разделен знаком «,».

Nth Child

<Style Selector="TextBlock:nth-child(2n+3)">

new Style(x => x.OfType<TextBlock>().NthChild(2, 3));

Сопоставляет элементы на основе их положения в группе братьев и сестер.

Nth Last Child

<Style Selector="TextBlock:nth-last-child(2n+3)">

new Style(x => x.OfType<TextBlock>().NthLastChild(2, 3));

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

Синтаксис Nth Child и Nth Last Child

:nth-child() и :nth-last-child() принимают один аргумент, который описывает шаблон для сопоставления индексов элементов в списке братьев и сестер. Индексы элементов отсчитываются от 1. В приведенных ниже примерах используется :nth-child(), но также применимо и для :nth-last-child().

Обозначение ключевых слов

odd Представляет элементы, чей индекс в серии братьев и сестер является нечетным: 1, 3, 5 и т. д.

even Представляет элементы, индекс которых в ряду братьев и сестер четный: 2, 4, 6 и т. д.

Функциональная запись

An+B Представляет элементы в списке, индексы которых соответствуют найденным в пользовательском шаблоне чисел, определяемом An+B, где:

• A — целочисленный размер шага,
• B — целочисленное смещение,
• n — все неотрицательные целые числа, начиная с 0.

Это можно понимать как каждый A-тый элемент , начиная с B-го

Примеры функциональных обозначений

Пример	Представление
:nth-child(odd)	Нечетные элементы: 1, 3, 5 и т. д.
:nth-child(even)	Четные элементы: 2, 4, 6 и т. д.
:nth-child(2n+1)	Нечетные элементы: 1(2×0+1), 3(2×1+1), 5(2×2+1) и т. д. эквивалентно :nth-child(odd)
:nth-child(2n)	Четные элементы: 2(2×1), 4(2×2), 6 (2×3) и т. д., эквивалентные :nth-child(even). Обратите внимание, что 0(2×0) допустимое обозначение, однако оно не соответствует ни одному элементу, поскольку индекс начинается с 1.
:nth-child(7)	7-й элемент
:nth-child(n+7)	Каждый элемент начиная с 7-го: 7(0+7), 8(1+7), 9(2+7) и т. д.
:nth-child(3n+4)	Каждый 3-й элемент начиная с 4-го: 4(3×0+4), 7(3×1+4), 10(3×2+4), 13(3×3+4) и т. д.
:nth-child(-n+3)	Первые 3 элемента: 3(-1×0+3), 2(-1×1+3), 1(-1×2+3). Все последующие индексы меньше 1, поэтому они не соответствуют ни одному элементу.

Онлайн тестер nth-child и nth-last-child

Используя приведенную ниже ссылку, можно легко оценить как nth-child, так и nth-last-child: nth-child-tester