Студопедия

Главная страница Случайная страница

КАТЕГОРИИ:

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






Упражнение 5. Менеджер размещения Canvas




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

  1. Canvas
  2. StackPanel
  3. DockPanel
  4. UniformGrid
  5. Grid

Панели обеспечивают типичные способы размещения дочерних элементов и в большинстве случаев этого бывает достаточно. Все панели наследуют от абстрактного класса Panel, имеющего, в свою очередь, в качестве базового класс System.Windows.FrameworkElement. Наиболее развитым менеджером размещения является панель Grid. Сами панели являются невидимыми, если явно не задать их фон, а их присутствие обнаруживается только по влиянию на дочерние элементы.

  • Добавьте к решению новый проект WpfApp5 и назначьте его стартовым


увеличить изображение

  • Заполните файл разметки следующим кодом
<Window x:Class="WpfApp5.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Менеджер размещения Canvas" Height="300" Width="300" Background="LightGray"> <TabControl> <TabItem Header="Canvas 1"> <Canvas Width="200" Height="100" Background="Aqua"> <Button Canvas.Left="2" Canvas.Top="2">Left, Top</Button> <Button Canvas.Right="2" Canvas.Top="2">Right, Top</Button> <Button Canvas.Left="2" Canvas.Bottom="2">Left, Bottom</Button> <Button Canvas.Right="2" Canvas.Bottom="2">Right, Bottom</Button> </Canvas> </TabItem> <TabItem Header="Canvas 2"> <Canvas HorizontalAlignment="Center" VerticalAlignment="Center" Background="Aqua"> <Button Canvas.Left="2" Canvas.Top="2">Left, Top</Button> <Button Canvas.Right="2" Canvas.Top="2">Right, Top</Button> <Button Canvas.Left="2" Canvas.Bottom="2">Left, Bottom</Button> <Button Canvas.Right="2" Canvas.Bottom="2">Right, Bottom</Button> </Canvas> </TabItem> <TabItem Header="Canvas 3"> <StackPanel> <Button>Button 1</Button> <Button>Button 2</Button> <Canvas HorizontalAlignment="Center" Background="Aqua"> <Button Canvas.Left="-21" Canvas.Top="8">Canvas</Button> </Canvas> </StackPanel> </TabItem> </TabControl></Window>

В первой вкладке ширина менеджера размещения задана явно, для видимости панели задан ее фон. Привязка к соответствующим углам панели и дочерних элементов осуществляется через дополнительные присоединенные свойства ( присоединенные атрибуты ) Canvas.Left, Canvas.Right, Canvas.Top и Canvas.Bottom. Достаточно только пары свойств привязки, а остальные избыточные свойства привязки игнорируются.



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

 

На второй вкладке размеры панели Canvas явно не заданы, поэтому панель превратится в бесконечно малую точку с совмещенными углами и не будет видна, хоть мы и задали цвет ее фона. Зато мы задали свойства HorizontalAlignment и VerticalAlignment, позиционирующие панель относительно родителя (клиентской области вкладки). Дочерние кнопки панели оказались привязанными к невидимой точке за соответствующие углы. При изменении размеров точечная панель автоматически позиционируется в центре и держит при себе привязанные к ней кнопки.

 

На третьей вкладке панель StackPanel организует вертикальную стопку из трех элементов, последним из которых является точечная панель Canvas, позиционированная относительно центра с помощью ее свойства HorizontalAlignment. Дочерняя кнопка панели Canvas привязывается за угол со смещением, включая отрицательное смещение по оси x.

 


mylektsii.ru - Мои Лекции - 2015-2018 год. (0.006 сек.)Пожаловаться на материал