html - 如何为 silverlight 页面启用自动滚动

Question

有一个Silverlight页面，它的宽度是810像素，没有指定高度:

<NavigationControls:Page x:Class="VfmElitaSilverlightClientView.Pages.SquadView" 
       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"
       xmlns:NavigationControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
       xmlns:DataControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
       xmlns:InputControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Input"
       xmlns:ToolkitControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit" 
       xmlns:Pages="clr-namespace:VfmElitaSilverlightClientView.Pages" 
       xmlns:Controls="clr-namespace:VfmElitaSilverlightClientView.Controls"
       xmlns:Converter="clr-namespace:SilverlightCommonView.Converter;assembly=SilverlightCommonView" 
       mc:Ignorable="d" Width="810"
       Title="SquadView Page">
<NavigationControls:Page.Resources>
    <Converter:BooleanToVisibilityConverter x:Key="resourceBooleanToVisibilityConverter" />
    <Converter:BooleanToVisibilityInvertedConverter x:Key="resourceBooleanToVisibilityInvertedConverter" />
</NavigationControls:Page.Resources>
<ToolkitControls:BusyIndicator IsBusy="{Binding IsBusy}" DisplayAfter="0" BusyContent="{Binding BusyContent}">
    <StackPanel Background="Transparent" HorizontalAlignment="Stretch">

        <StackPanel ... ></StackPanel>
        <StackPanel ... ></StackPanel>
        <StackPanel ... ></StackPanel>

        <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">

            <Grid Margin="5" Width="500">...</Grid>

            <Canvas Height="180" Width="210">...</Canvas>

        <DataControls:DataGrid
                   IsReadOnly="True" HorizontalAlignment="Stretch" Margin="5" MinHeight="60" MaxHeight="460"
                   HorizontalScrollBarVisibility="Hidden" VerticalScrollBarVisibility="Auto"
                   RowHeight="18" VerticalAlignment="Top"
                   >
        </DataControls:DataGrid>

        <Button Content="Save" HorizontalAlignment="Center"
                Padding="10" Command="{Binding SaveButtonClickCommand,Mode=OneWay}"/>

    </StackPanel>
</ToolkitControls:BusyIndicator>

页面显示有以下 html 代码:

<div id="silverlightControlHost" style="height:<%=Height%>px;margin: auto;">
    <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
      <param name="source" value="/ClientBin/app.xap"/>
      <param name="onError" value="onSilverlightError" />
      <param name="background" value="transparent" />
          <param name="windowless" value="true" />
      <param name="initParams" value="<%=InitParams %>" /> 
      <param name="minRuntimeVersion" value="3.0.40624.0" />
      <param name="autoUpgrade" value="true" />
      <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40624.0" style="text-decoration:none">
          <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style:none"/>
      </a>
    </object>
    <iframe id="_sl_historyFrame" style="visibility:hidden;height:0px;width:0px;border:0px"></iframe>
</div>

在其他控件中，页面内部有一个网格，网格行数取决于数据(从 17 到 25-28)，网格行高为 22 像素。需要在不滚动的情况下显示所有控件和所有网格行。

在我的示例中，页面的“高度”属性值设置为“930”。对于拥有大量数据(数据网格中的 25-28 行)的用户，大部分页面都忙于数据。但是其他用户(18-20 行)会看到很大的“空白”空间，这是为控制而保留的。

我试图降低托管 Silverlight 应用程序的 DIV 的高度 - 这切断了对“大数据”案例的控制。尝试将样式“高度”设置为“自动”会导致空 HTML 页面(Silverlight 控件根本不可见)。

能否请您指教，如何设置页面高度以自动拉伸(stretch)以适应整个控件？

我不确定这是 Silverlight 问题还是 HTML...

谢谢!

Answer 1

最好首先将 HTML Silverlight 大小问题与所有其他布局问题分开。

您的 Silverlight 对象应该占据浏览器高度和宽度的 100%，除非您为其他 HTML 元素保留空间。这样，所有布局和间距都在 Silverlight 对象的控制之下。

只有当您希望 Silverlight 对象比浏览器大并使用浏览器滚动条(不推荐)时才不这样做。如果您使 Silverlight 对象小于浏览器，您将失去在浏览器未使用区域上的任何鼠标交互，否则您可能会做一些事情。同样，100% 最容易处理。

更多信息请:

除了 HTML，您能否提供更多 XAML(屏幕截图或 Paint 中的简单模型会很棒)，这样我就可以让您确切知道您需要什么类型的布局和间距您的特定屏幕？