none
关于SilverLight2宽度和高度的问题? RRS feed

  • 问题

  • 在开发SilverLight2的时候,对宽度和高度总是弄不清楚。要怎么设置才能让Silverlight在页面中的大小随着其里面的内容进行自动扩大或缩小,或者如果有CSS里面的Min-Height,Min-Width就更好了。

    请各位前辈指点迷津···········
    2009年4月23日 5:32

答案

  • Silverlight的高度分为几个
    1.首先是外层DIV的高度,并不是在SL里面设置,当然你也可以用如Table等或自定义的HtmlElement去包含这个object。
    在建立项目中默认的这个html页面默认是以 div 嵌入 object的形式载入 silverlight的,默认的宽高是 100%,所以你看这sl是全屏幕占有的。


        <div id="silverlightControlHost">
    		<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
    			<param name="source" value="ClientBin/QbabySample.xap"/>
    			<param name="onerror" value="onSilverlightError" />
    			<param name="background" value="white" />
    			<param name="minRuntimeVersion" value="2.0.31005.0" />
    			<param name="autoUpgrade" value="true" />
    			<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
         			<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
    			</a>
    		</object>
    		<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
        </div>
    2.第二层是UserControl的宽高
    <UserControl x:Class="QbabySample.Page"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        Width="400" Height="300">
    
    </UserControl>
    

    3.第三层是UserControl的LayoutRoot的宽高
        <Grid x:Name="LayoutRoot" Background="White">
        </Grid>
    

    想要对Silverlight内容进行缩放,要用UserControl 或者 LayoutRoot的这个宽高,
    	<UserControl.RenderTransform>
    		<TransformGroup>
    			<ScaleTransform ScaleX="2.8" ScaleY="3.75"/>
    			<SkewTransform/>
    			<RotateTransform/>
    			<TranslateTransform/>
    		</TransformGroup>
    	</UserControl.RenderTransform>

    对这个宽高做放大缩小变换即可,子内容都会跟着变换

    剩下的一个问题是如何获取页面中的大,这个就是JavaScript的事情了,JavaScript获取你你的宽高,根据需求再传入SL对里面的内容进行缩放,同时改变外层的div的大小就可以达到目的了
    2009年4月23日 7:54
    版主

全部回复

  • Silverlight的高度分为几个
    1.首先是外层DIV的高度,并不是在SL里面设置,当然你也可以用如Table等或自定义的HtmlElement去包含这个object。
    在建立项目中默认的这个html页面默认是以 div 嵌入 object的形式载入 silverlight的,默认的宽高是 100%,所以你看这sl是全屏幕占有的。


        <div id="silverlightControlHost">
    		<object data="data:application/x-silverlight-2," type="application/x-silverlight-2" width="100%" height="100%">
    			<param name="source" value="ClientBin/QbabySample.xap"/>
    			<param name="onerror" value="onSilverlightError" />
    			<param name="background" value="white" />
    			<param name="minRuntimeVersion" value="2.0.31005.0" />
    			<param name="autoUpgrade" value="true" />
    			<a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
         			<img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
    			</a>
    		</object>
    		<iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
        </div>
    2.第二层是UserControl的宽高
    <UserControl x:Class="QbabySample.Page"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        Width="400" Height="300">
    
    </UserControl>
    

    3.第三层是UserControl的LayoutRoot的宽高
        <Grid x:Name="LayoutRoot" Background="White">
        </Grid>
    

    想要对Silverlight内容进行缩放,要用UserControl 或者 LayoutRoot的这个宽高,
    	<UserControl.RenderTransform>
    		<TransformGroup>
    			<ScaleTransform ScaleX="2.8" ScaleY="3.75"/>
    			<SkewTransform/>
    			<RotateTransform/>
    			<TranslateTransform/>
    		</TransformGroup>
    	</UserControl.RenderTransform>

    对这个宽高做放大缩小变换即可,子内容都会跟着变换

    剩下的一个问题是如何获取页面中的大,这个就是JavaScript的事情了,JavaScript获取你你的宽高,根据需求再传入SL对里面的内容进行缩放,同时改变外层的div的大小就可以达到目的了
    2009年4月23日 7:54
    版主
  • 在开发SilverLight2的时候,对宽度和高度总是弄不清楚。要怎么设置才能让Silverlight在页面中的大小随着其里面的内容进行自动扩大或缩小,或者如果有CSS里面的Min-Height,Min-Width就更好了。

    请各位前辈指点迷津···········

    不知道你问的是不是让Silverlight的大小和浏览器一致,如果是这样,你只需要删除UserControl上的Width和Height属性就行了。你可以新建一个项目加一个背景色试一下就知道效果了。呵呵

    My blog: http://blog.csdn.net/dotfun http://dotfun.cnblogs.com

    My contact: QQ:372900288 E-mail:372900288@qq.com msn:sellnet007@hotmail.com

    2009年4月23日 8:04
    版主