Question

这是问题......

我在ASP.Net Web窗体应用程序中添加了一些silverlight 3控件。 silverlight应用程序的高度可以根据其中的数据量而变化。该应用程序是网页的一部分，而不是整个页面。我的用户希望只有一组滚动条。有没有办法根据silverlight应用程序的模糊动态调整div或对象的大小？

例如我可以挂钩进入silverlight javascript以某种方式执行此操作吗？

Answer 1

我做了类似的事情，我已经制作了一个Silverlight控件。我的问题是我有一个控件来显示Silverlight控件中的文档扫描，我的高度是硬编码的，但有些用户运行的分辨率要高得多，所以他们可以使用很多浪费的空间。

所以我实现了一个小客户端javascript函数，它确定了控件的最佳大小。此代码在页面加载时运行。

在HTML页面的底部添加以下代码（使用Jquery）：

<script type="text/javascript" language="javascript">
    function InitializeSilverlightControlHeight()
    {
        $(function()
        {
            var miniumimControlSize = 500;
            var pagePadding = 150;
            var screenheight = $(window).height() - pagePadding;
            if (screenheight > miniumimControlSize)
            {
                $("#yourSilverLightControlName").height(screenheight);
            }
        });
    }

    InitializeSilverlightControlHeight();
</script>

它的作用是检查浏览器窗口的可查看大小，然后缩短填充量（在我的情况下为150px以考虑标题的高度）。如果此大小大于控件的最小大小，则将控件设置为此大小。

希望这有助于或者至少指出你的大方向让你滚动。

Answer 2

有两种方法可以做到这一点：通过直接访问DOM元素并更改其样式（或css）属性，或者通过调用页面上的javascript函数来执行相同的操作。下面我有xaml，代码隐藏，以及一个简单示例的HTML，当您在silverlight控件中拖动滑块时，它会调整包含控件的div的大小。如果您创建一个带有补充测试网站和页面的简单Silverlight应用程序，然后复制并粘贴以下代码，那么您可以进行播放（请注意，我已经从aspx页面中剪切了一些生成的样式/脚本）简洁）。

C＃和javascript代码不是特别漂亮或防弹，它只是一个例子。

<UserControl x:Class="SilverlightApplication6.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:DesignWidth="200" d:DesignHeight="480">
  <Grid x:Name="LayoutRoot">

      <Slider x:Name="WidthSlider" Value="50" Maximum="200"></Slider>

  </Grid>
</UserControl>

Silverlight应用程序的代码隐藏：

public partial class MainPage : UserControl
{
    public MainPage()
    {
        InitializeComponent();

        this.Loaded += new RoutedEventHandler(MainPage_Loaded);
    }

    private void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        WidthSlider.ValueChanged += new RoutedPropertyChangedEventHandler<double>(WidthSlider_ValueChanged);
    }

    private void WidthSlider_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
    {
        //access and manipulate the DOM element directly:
        HtmlElement container = HtmlPage.Document.GetElementById("silverlightControlHost");
        if (container != null)
        {
            container.SetStyleAttribute("width", (50 + e.NewValue).ToString() + "px");
        }

        //pass a delta value to the js function, which will get added to the current width of the container:
        HtmlPage.Window.Invoke("resizeContainer", (e.NewValue - e.OldValue).ToString());
    }
}

和aspx页面：

<%@ Page Language="C#" AutoEventWireup="true" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>SilverlightApplication6</title>
    <script type="text/javascript" src="Silverlight.js"></script>
    <script type="text/javascript">
        function resizeContainer(delta) {
            var container = document.getElementById('silverlightControlHost');
            if (container != null) {
                //alert('starting width: ' + container.style.width);
                container.style.width = (parseInt(container.style.width) + Number(delta) + 'px');
                //alert('finishing width: ' + container.style.width);
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server" style="height:100%">
    <div id="silverlightControlHost" style="border: solid 1px red; width:200px; height: 400px;">
        <object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
          <param name="source" value="ClientBin/SilverlightApplication6.xap"/>
          <param name="onError" value="onSilverlightError" />
          <param name="background" value="white" />
          <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>
    </form>
</body>
</html>

编辑：在我写完这个答案两天后，Charles Petzold撰写了一篇关于在html页面you can find it here中调整silverlight控件大小的博客文章。主要区别在于他调整了实际的silverlight插件控件的大小，而我正在调整silverlight插件所在的html元素的大小。

Answer 3

不要认为这是你正在寻找的东西，但它可能会有所帮助......

在您的第一页的文件中，您的silverlight控件创建了您可以添加活动

App.Current.Host.Content.Resized += new EventHandler(Content_Resized);

然后在您的事件监听器中，您可以调整控件的大小以更好地适应窗口。

void Content_Resized(object sender, EventArgs e)
{
    double height = App.Current.Host.Content.ActualHeight;
    double width = App.Current.Host.Content.ActualWidth;
    this.Height = height;
    this.Width = width;
    m_currentPage.Height = height;
    m_currentPage.Width = width;
}

希望有帮助= D

动态调整网页上的Silverlight控件大小

3 个答案: