К сожалению для веб разработчиков, у пользователей различные разрешения монитора, а значит и различные размеры окна браузера, плюсом к этому, пользователь может изменять размеры окна уже после старта проекта, поэтому нужно адаптировать Silverlight-приложения к конкретной ситуации на клиентской машине. Самый известный способ - создание резинового макета. Для реализации такого макета нам поможет обработчик события Resized.
Оповещатель о событии находится в классе App:
App.Current.Host.Content.Resized
Нужно просто привязать к нему обработчик, например, после загрузки приложения:
void Page_Loaded(object sender, RoutedEventArgs e)
{
App.Current.Host.Content.Resized +=
new EventHandler(Content_Resized);
}
Сделаем небольшой пример. Пусть есть две панели меню - горизонтальная и вертикальная, которые всегда должны занимать всю ширину/высоту окна браузера. Вот что получится в итоге:
Итак, создаем новый проект и добавляем две StackPanel. Вот полный XAML-код:
<UserControl x:Class="WindowResize.Page"
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 x:Name="menuVertical"
VerticalAlignment="Top"
HorizontalAlignment="Left"
Width="100">
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
</StackPanel>
<!-- Горизонтальная панель -->
<StackPanel x:Name="menuHorizontal"
Margin="100,0,0,0"
Orientation="Horizontal"
Height="50"
VerticalAlignment="Top"
HorizontalAlignment="Left" >
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
<Button Content="Кнопка Меню" />
</StackPanel>
</Grid>
</UserControl>
Код C# с подробными комментариями:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace WindowResize
{
public partial class Page : UserControl
{
public Page()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(Page_Loaded);
}
void Page_Loaded(object sender, RoutedEventArgs e)
{
//Привязываем обработчик
App.Current.Host.Content.Resized +=
new EventHandler(Content_Resized);
}
void Content_Resized(object sender, EventArgs e)
{
//По изменению размера окна браузера,
//вызываются соответсвующие функции для
//перерасчета высоты или ширины каждого
//элемента в панелях
ResizeHorizontalMenu();
ResizeVerticalMenu();
}
void ResizeVerticalMenu()
{
//Вычисляется новая высота для каждой
//кнопки. LayoutRoot - родительский
//контрол, в котором располагаются все остальные
//визуальные элементы. Он занимает все окно, так
//как специально не были заданы его ширина и высота.
//Чтобы получить его реальную высоту (т.е.
//ту высоту, которая отображается пользователю)
//можно воспользоваться свойством ActualHeight.
//Далее делим всю высоту на количество
//элементов в панели меню.
double newHeight = LayoutRoot.ActualHeight /
(double)menuVertical.Children.Count;
//Для каждой кнопки в панели задаем
//новое значение высоты
foreach (UIElement el in menuVertical.Children)
{
Button btn = el as Button;
btn.Height = newHeight;
}
}
void ResizeHorizontalMenu()
{
//То же самое, что и с вертикальной панелью,
//только сделана поправка на горизонтальный
//отступ, который равен ширине вертикальной
//панели
double menuHorizontalMarginLeft =
menuVertical.ActualWidth;
double newWidth = (LayoutRoot.ActualWidth -
menuHorizontalMarginLeft) /
(double)menuHorizontal.Children.Count;
foreach (UIElement el in menuHorizontal.Children)
{
Button btn = el as Button;
btn.Width = newWidth;
}
}
}
}
Из комментариев должно быть все понятно. Посмотреть на пример можно тут - http://silverlight.services.live.com/invoke/36889/WindowResize/iframe.html