Разметка C#

Статья
11/11/2023

Обзор

Разметка C# — это набор вспомогательных методов и классов, предназначенных для упрощения процесса создания декларативных пользовательских интерфейсов приложений .NET (.NET MAUI) в коде. Api fluent, предоставляемый разметкой C#, доступен в CommunityToolkit.Maui.Markup пространстве имен.

Как и в XAML, разметка C# обеспечивает чистое разделение пользовательского интерфейса (представления) и бизнес-логики (модель представления).

Разметка C# доступна на всех платформах, поддерживаемых .NET MAUI, и поддерживает Горячая перезагрузка .NET.

Пакет NuGet

Пакет разметки C# можно включить в проект, как описано в нашем руководстве по началу работы .

Примеры

Ниже приведены краткие примеры того, как можно достичь распространенных задач с помощью пакета разметки.

Привязки

Разметка C# позволяет определить привязку свободно и поэтому объединить несколько методов для уменьшения детализации нашего кода:

new Entry().Bind(Entry.TextProperty, static (ViewModel vm) => vm.RegistrationCode, static (ViewModel vm, string text) => vm.RegistrationCode = text)

Дополнительные сведения о возможных вариантах Bind метода см BindableObject . в документации по расширениям.

Определение параметров

Разметка C# позволяет определить размер свободно и поэтому объединить несколько методов для уменьшения детализации кода:

new Entry().Size(200, 40);

Дополнительные сведения о возможных вариантах Size метода см VisualElement . в документации по расширениям.

Подробный пример

В этом примере создается объект с дочерними Label и Entry объектамиGrid. Отображаемый Label текст и Entry данные привязываются к RegistrationCode свойству viewmodel. Каждое дочернее представление отображается в определенной строке и GridEntry охватывает все столбцы в строкеGrid. Кроме того, высота Entry устанавливается вместе с клавиатурой, цветами, размером шрифта текста и его Margin.

Расширения разметки C# также позволяют разработчикам определять имена столбцов и строк (например, Column.Inputс помощью расширения enumразметки C#).

Разметка C# позволяет определить это с помощью api fluent:

using static CommunityToolkit.Maui.Markup.GridRowsColumns;

class SampleContentPage : ContentPage
{
    public SampleContentPage()
    {
        Content = new Grid
        {
            RowDefinitions = Rows.Define(
                (Row.TextEntry, 36)),

            ColumnDefinitions = Columns.Define(
                (Column.Description, Star),
                (Column.Input, Stars(2))),

            Children =
            {
                new Label()
                    .Text("Code:")
                    .Row(Row.TextEntry).Column(Column.Description),

                new Entry
                {
                    Keyboard = Keyboard.Numeric,
                }.Row(Row.TextEntry).Column(Column.Input)
                 .BackgroundColor(Colors.AliceBlue)
                 .FontSize(15)
                 .Placeholder("Enter number")
                 .TextColor(Colors.Black)
                 .Height(44)
                 .Margin(5, 5)
                 .Bind(Entry.TextProperty, static (ViewModel vm) => vm.RegistrationCode, static (ViewModel vm, string text) => vm.RegistrationCode = text)
            }
        };
    }

    enum Row { TextEntry }
    enum Column { Description, Input }
}

Преобразователи

Пакет разметки C# предоставляет возможность определять IValueConverter и IMultiValueConverter реализовывать встроенные при создании пользовательского интерфейса приложений.

Конвертер	Description
`FuncConverter`	Эта `FuncConverter` возможность позволяет определить встроенную `IValueConverter` реализацию при сборке пользовательского интерфейса.
`FuncMultiConverter`	Эта `FuncMultiConverter` возможность позволяет определить встроенную `IMultiValueConverter` реализацию при сборке пользовательского интерфейса.

Модули

Примечание.

Разметка C# включает методы расширения, которые задают определенные свойства представления. Они предназначены для улучшения удобочитаемости кода и могут использоваться в сочетании с средствами задания свойств. Рекомендуется всегда использовать метод расширения, если он существует для свойства, но вы можете выбрать предпочтительный баланс.

Расширение	Description
`AbsoluteLayout`	Расширения AbsoluteLayout предоставляют ряд методов расширения, поддерживающих размещение `View`s в `AbsoluteLayout`s.
`AutomationProperties`	Расширения `AutomationProperties` предоставляют ряд методов расширения, поддерживающих настройку параметров специальных возможностей.
`BindableLayout`	Расширения `BindableLayout` предоставляют ряд методов расширения, поддерживающих настройку его `EmptyView`и `ItemSourceItemTemplate`.
`BindableObject`	Расширения `BindableObject` предоставляют ряд методов расширения, поддерживающих настройку `Binding`s на объекте `BindableObject`.
`DynamicResourceHandler`	Расширения `DynamicResourceHandler` предоставляют ряд методов расширения, поддерживающих настройку `IDynamicResourceHandler` , которую можно использовать для темы приложения.
`Element`	Расширения `Element` предоставляют ряд методов расширения, поддерживающих настройку заливки, эффектов, атрибутов шрифта, динамических ресурсов, текста и цвета `Element`текста.
`FlexLayout`	Расширения FlexLayout предоставляют ряд методов расширения, которые поддерживают размещение `View` в объекте `FlexLayout`.
`Grid`	Расширения Сетки предоставляют ряд методов расширения, поддерживающих настройку Сетки.
`Image`	Расширения `Image` предоставляют ряд методов расширения, поддерживающих настройку `IImage` элементов управления.
`ItemsView`	Расширения `ItemsView` предоставляют ряд методов расширения, поддерживающих настройку `ItemsView` таких элементов управления, как `CarouselView` и `CollectionView`.
`Label`	Расширения `Label` предоставляют ряд методов расширения, поддерживающих настройку `Label` элементов управления.
`Placeholder`	Расширения `Placeholder` предоставляют ряд методов расширения, поддерживающих настройку `IPlaceholder` элементов управления.
`SemanticProperties`	Расширения `SemanticProperties` предоставляют ряд методов расширения, поддерживающих настройку параметров специальных возможностей.
`Style`	`Style<T>` предоставляет ряд методов расширения fluent, поддерживающих настройку `Microsoft.Maui.Controls.Style`.
`TextAlignment`	Расширения `TextAlignment` предоставляют ряд методов расширения, поддерживающих настройку `HorizontalTextAlignment` и `VeticalTextAlignment` свойства для реализации `ITextAlignment`элементов управления.
`View`	Расширения `View` предоставляют ряд методов расширения, поддерживающих настройку выравнивания элементов управления, наследуемых от `View`.
`VisualElement`	Расширения `VisualElement` предоставляют ряд методов расширения, которые поддерживают настройку размера, стилизации и поведения объекта `VisualElement`.