对silverlight布局进行控制，使其居中显示，适用于不同的分辨率

问题背景：

使用silverlight 4.0做好的网站，在标准分辨率下表现良好，在其他分辨率下布局效果很差

希望在低分辨率的情况下，能产生滚动条，同时在高分辨率的情况下，能保持和低分辨率一样的显示效果

解决思路：

基本原则：使用表格<Grid></Grid>进行布局，Grid布局能自动拉伸控件的宽高，使其贴合不同分辨率，前提是我们不能把Grid的宽高给定死了。

以分辨率 1300*685 为标准:

1、我们可以使用ScrollViewer作为Grid的容器，低于该分辨率的情况下，产生滚动条

2、在高于该分辨率的情况下，我们按比例(当前分辨率/标准分辨率)对本页进行缩放，这样，在大分辨率的显示器上，我们的布局的比例也能和标准分辨率保持一致。

解决步骤：

前端XAML

<UserControl x:Class="SLCenterLayout.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400" x:Name="ControlMainPage" >
    <UserControl.Resources>
        
    </UserControl.Resources>
    <UserControl.RenderTransform>
        <CompositeTransform />
    </UserControl.RenderTransform>

    <ScrollViewer x:Name="LayoutRoot" MaxWidth="1300" MaxHeight="685" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto" Background="Black">
     <Grid HorizontalAlignment="Center">
            <Grid.RowDefinitions>
                <RowDefinition />
                <RowDefinition />
            </Grid.RowDefinitions>
            <Image Source="2.jpg"/>
            <TextBlock Grid.Row="1" FontSize="30" Foreground="White">小米手机快发货啊</TextBlock>
        </Grid>
    </ScrollViewer>
</UserControl>

后台代码：

using System;
using System.Windows.Controls;
using System.Windows.Media;

namespace SLCenterLayout
{
    public partial class MainPage : UserControl
    {
        //标准显示宽度
        private const double RECOMMAND_SCREEN_WIDTH = 1300;

        //标准显示高度
        private const double RECOMMAND_SCREEN_HEIGHT = 685;

        public MainPage()
        {
            InitializeComponent();
            App.Current.Host.Content.Resized+=new EventHandler(Content_Resized);
        }

        private void ChangePageRenderSize(double currentWidth, double currentHeight)
        {
            if (currentWidth > RECOMMAND_SCREEN_WIDTH || currentHeight > RECOMMAND_SCREEN_HEIGHT)
            {
                CompositeTransform ctf = new CompositeTransform();
                ctf.ScaleX = currentWidth / RECOMMAND_SCREEN_WIDTH;
                ctf.ScaleY = currentHeight / RECOMMAND_SCREEN_HEIGHT;

                //沿着中心点进行缩放，这样的话，在多次缩放后，不会偏移原来位置
                ctf.CenterX = currentWidth / 2;
                ctf.CenterY = currentHeight / 2;
                ControlMainPage.RenderTransform = ctf;
            }
        }

        private void Content_Resized(object sender, EventArgs e)
        {
            ChangePageRenderSize(ControlMainPage.ActualWidth, ControlMainPage.ActualHeight);
        }

    }
}

为什么要在Resized事件里面，对页面进行缩放

因为我们在对页面缩放的时候，很重要的一对数据就是当前页面的宽度和高度，而这对数据，我们可以在Resized事件里面获得

MSDN关于Resized事件的阐述是：

此事件将在开始加载 Silverlight 插件过程中发生。在发生该事件后，ActualHeight 或 ActualWidth 的值是可靠的。在这一时刻之前，ActualHeight 或 ActualWidth 的值不可靠。

源码在一楼奉上