Все элементы управления содержимым инкапсулируют в себе какой-то другой элемент. Все они наследуются от класса
ContentControl, который определяет ряд общих методов и свойств, в частности, свойство Content
, которое позволяет вложить в
этот элемент другой элемент. К таким элементам управления содержимым можно отнести Button, ToggleButton, ToolTip,
RadioButton, CheckBox и ряд других. Также элементом управления содержимым является и главный элемент окна - Window
Отличительной чертой элементов управления содержимым является наличие свойства Content, которое и позволяет добавить внутри элемента другой элемент. В этом элементы управления содержимым схожи с контейнерами компоновки. Только контейнеры могут иметь множество вложенных элементов, а элементы управления содержимым только один.
В качестве содержимого свойство Content может принимать два вида объектов:
Объект класса, который не наследуется от UIElement. Для такого объекта вызывается метод ToString(), который возвращает строковое преставление объекта. Затем эта строка устанавливается в качестве содержимого.
Объект класса, который наследуются от UIElement. У такого объекта вызывается метод UIElement.OnRender(), который выполняет отрисовку внутри элемента управления содержимым.
Рассмотрим на примере кнопки, которая является элементом управления содержимым:
<Button Content="Hello UWP!" />
Содержимое элемента Button здесь представляет обычную строку, то есть объект типа, который не наследуется от UIElement. Этот же пример мы можем в XAML прописать иначе:
<Button> <Button.Content> Hello UWP! </Button.Content> </Button>
Также можно использовать сокращенное определение свойства Content:
<Button>Hello UWP!</Button>
Возьмем другой пример. Определим кнопку с именем myButton:
<Page x:Class="ControlsApp.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:ControlsApp" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> <Button x:Name="myButton" HorizontalAlignment="Center" Width="100" Height="40" /> </Grid> </Page>
А в файле кода MainPage.xaml.cs присвоим свойству Content какой-либо объект:
using Windows.UI.Xaml.Controls; namespace ControlsApp { public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); double number = 5.6; myButton.Content = number; } } }
В итоге получится следующую кнопку:
В данном случае число конвертируется в строку, которая устанавливается в качестве содержимого. Иначе все будет работать, если мы в качестве содержимого используем объект, унаследованный от UIElement:
<Button x:Name="myButton" HorizontalAlignment="Center"> <Button Content="Universal Windows Platform" /> </Button>
Теперь в качестве содержимого будет использоваться другая кнопка, для которой при визуализации будет вызываться метод OnRender():
То есть в данном случае получается кнопка внутри кнопки, и во внутреннюю кнопку мы можем вложить еще какой-нибудь элемент.
Чтобы создать подобную кнопку в коде C#, можно было бы использовать следующее выражение:
myButton.Content = new Button { Content = "Universal Windows Platform" };
Но необходимо помнить, что элементы управления содержимым могут содержать только один объект. Но что, если нам захочется поместить в кнопку сразу несколько других кнопок? В этом случае можно использовать контейнеры компоновки:
<Button x:Name="myButton" HorizontalAlignment="Center"> <StackPanel> <TextBlock Text="Набор кнопок" /> <Button Background="Red" Width="80" Content="Red" /> <Button Background="Yellow" Width="80" Content="Yellow" /> <Button Background="Green" Width="80" Content="Green" /> </StackPanel> </Button>
То же самое мы могли бы прописать через код C#:
StackPanel buttonStack = new StackPanel(); buttonStack.Children.Add(new TextBlock { Text = "Набор кнопок" }); buttonStack.Children.Add(new Button { Content = "Red", Width = 80, Background = new SolidColorBrush(Windows.UI.Colors.Red) }); buttonStack.Children.Add(new Button { Content = "Yellow", Width = 80, Background = new SolidColorBrush(Windows.UI.Colors.Yellow) }); buttonStack.Children.Add(new Button { Content = "Green", Width = 80, Background = new SolidColorBrush(Windows.UI.Colors.Green) }); myButton.Content = buttonStack;
Свойство HorizontalContentAlignment служит для выравнивания содержимого по горизонтали внутри элемента относительно его границ. Оно принимает следующие значения: Left (положение слева), Right (справа), Center (положение по центру), Stretch (растяжение по всей ширине).
<StackPanel HorizontalAlignment="Center"> <Button Margin="5" HorizontalContentAlignment="Left" Content="Left HorizontalAlignment" Height="90" Width="500" /> <Button Margin="5" HorizontalContentAlignment="Right" Content="Right HorizontalAlignment" Height="90" Width="500" /> <Button Margin="5" HorizontalContentAlignment="Center" Content="Center HorizontalAlignment" Height="90" Width="500" /> </StackPanel>
Свойство VerticalContentAlignment служит для выравнивания содержимого элемента по вертикали. Оно принимает следующие значения: Top (положение в верху), Bottom (внизу), Center (по центру), Stretch (растяжение по всей высоте).