Блог Сергея Байдачного

Мой блог о технологиях

Введение в SilverLight 4: Элемент управления ViewBox

with one comment

Чтобы продемонстрировать работу нового элемента управления ViewBox, достаточно рассмотреть небольшой пример:

<UserControl x:Class="ViewBox_Chapter0.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid x:Name="LayoutRoot" Background="White">
        <StackPanel>
            <Button Content="Hello" Width="400" Height="100"></Button>
        </StackPanel>
    </Grid>
</UserControl>

Если попробовать запустить приложение выше, и изменить размер окна браузера, то можно увидеть что размер кнопки остается неизменным. Если изменить размер окна браузера, сделав его меньшим размера кнопки, то она попросту перестанет влазить на экран. Таким образом, существует проблема изменения размеров интерфейса при изменении размеров окна браузеров. Конечно, данную проблему можно решить с помощью элемента компоновки Grid, но при работе со сложными интерфейсами, элемент Grid не помогает. Поэтому появление элемента ViewBox, позволяющего сжимать и расширять свое содержимое, является даже запоздалым.

Замечание. Элемент ViewBox был доступен и разработчикам более ранней версии SilverLight, но не входил в стандартную поставку, а поставлялся в составе специальной библиотеки с открытым кодом, разрабатываемой сообществом.

Рассмотрим пример выше, но добавим элемент компоновки ViewBox:

<UserControl x:Class="ViewBox_Chapter0.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid x:Name="LayoutRoot" Background="White">
        <Viewbox MaxHeight="200" MaxWidth="800" 
            MinHeight="50" MinWidth="200">
            <StackPanel>
                <Button Content="Hello" Width="400" Height="100"></Button>
            </StackPanel>
        </Viewbox>
    </Grid>
</UserControl>

Теперь, при изменении размеров окна браузера, также изменяется и размер нашей кнопки.

Рассмотрим элемент ViewBox более детально. Фактически тут можно выделить всего три основных свойства: Child, Stretch, StretchDirection.

Свойство Child содержит ссылку на тот элемент, размерами которого управляет ViewBox. Тут может быть только один элемент, но это может быть и контейнер (как в примере выше).

Свойство Stretch определяет, каким образом содержимое ViewBox размещается внутри выделенного пространства. Тут возможно одно из следующих значений:

· None – сохранять исходный размер контента;

· Fill – полностью заполнить элемент ViewBox, не сохраняя пропорции;

· Uniform – сохранять пропорции контента;

· UniformToFill – полностью заполнить элемент ViewBox, с сохранением пропорций контента. Естественно, что с этим параметром, в большинстве случаев, весь контент отобразить не удается и он выходит за границы ViewBox.

Последнее свойство StretchDirection позволяет разрешить только сжатие или расширение содержимого и принимает одно из значений:

· UpOnly – только расширять контент, если размер ViewBox больше размера самого контента;

· DownOnly – только сжимать контент, если размер ViewBox меньше размера самого контента;

· Both – позволяет расширять и сжимать контент (установлено по умолчанию).

Таким образом, в SilverLight 4 на один полезный элемент компоновки стало больше.

Реклама

Written by Sergiy Baydachnyy

12.01.2010 в 10:28

Опубликовано в SilverLight

Tagged with

Один ответ

Subscribe to comments with RSS.

  1. […] Читать всю статью на моем блоге о технологиях Опубліковані Tuesday, January 12, 2010 10:29 AM від Sergiy Baydachnyy […]


Добавить комментарий

Заполните поля или щелкните по значку, чтобы оставить свой комментарий:

Логотип WordPress.com

Для комментария используется ваша учётная запись WordPress.com. Выход / Изменить )

Фотография Twitter

Для комментария используется ваша учётная запись Twitter. Выход / Изменить )

Фотография Facebook

Для комментария используется ваша учётная запись Facebook. Выход / Изменить )

Google+ photo

Для комментария используется ваша учётная запись Google+. Выход / Изменить )

Connecting to %s

%d такие блоггеры, как: