Question

如果没有明确的宽度和高度，是我还是MultiScaleImage甚至不显示？由于某种原因，我不能让它填充网格单元格。它的行为与大多数其他元素不同。

如果我在Viewer上丢弃高度和宽度，它根本不会显示。

编辑：这是完整的图片...... XAML：

<UserControl x:Class="CliqueSite.DeepZoom.Viewer.ZoomPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid x:Name="LayoutRoot" Background="Black">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="34" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <MultiScaleImage x:Name="Viewer" Margin="1,1,1,0" Height="675" Width="900" />
    <Rectangle Grid.Row="1">
        <Rectangle.Fill>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FF000000"/>
                <GradientStop Color="#FF808080" Offset="1"/>
            </LinearGradientBrush>
        </Rectangle.Fill>
    </Rectangle>
    <Button HorizontalAlignment="Right" Margin="0,0,4,4" VerticalAlignment="Bottom" Padding="6" Grid.Row="1"
            Content="Zoom Reset" x:Name="ZoomReset" FontSize="9" FontFamily="Verdana" />
</Grid>

背后的相关代码：

[ScriptableMember]
public void SetSource(int width, int height, int tileSize, int id, string urlToFormat)
{
    Viewer.Source = new ViewerSource(width, height, tileSize, id, urlToFormat);
    double x = 0;
    double y = 0;
    double w = 1;
    if ((width > height && Viewer.Width > Viewer.Height) || (width > height && Viewer.Width < Viewer.Height))
    {
        double scaleFactor = Viewer.Width / width;
        double adjustedHeight = height * scaleFactor;
        double topSpace = (Viewer.Height - adjustedHeight) / 2;
        y = -(topSpace / Viewer.Height) * (Viewer.Height / Viewer.Width);
    }
    else
    {
        double scaleFactor = Viewer.Height / height;
        double adjustedWidth = width * scaleFactor;
        w = Viewer.Width / adjustedWidth;
        double leftSpace = (Viewer.Width - adjustedWidth) / 2;
        x = -(leftSpace / Viewer.Width) * w;
    }
    _viewportOrigin = new Point(x, y);
    _viewportWidth = w;
    ResetZoom();
}

Javascript代码（从嵌入对象的onload参数运行）：

   function LoadImage() {
    var viewer = $("#DeepZoomViewer")[0];
    viewer.content.Bridge.SetSource(<%= Model.ZoomProperties.Width %>, <%= Model.ZoomProperties.Height %>, 256, <%=  Model.Photo.ID %>, "http://localhost:7070/TileHandler.ashx?id={0}&level={1}&x={2}&y={3}");
}

Answer 1

当我将h / w设置为Auto时，它为我填充第0行就好了，就像这样：

<MultiScaleImage x:Name="Viewer" Margin="1,1,1,0" Height="Auto" Width="Auto"  />

你甚至可以在行中进行额外的测量，但是当我这样做时不需要它：

<MultiScaleImage Grid.Row="0" x:Name="Viewer" Margin="1,1,1,0" Height="Auto" Width="Auto"  />

Answer 2

尝试更改网格单元格定义，如下所示： -

<Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="34" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
    <ColumnDefinition Width=*" />
</Grid.ColumnDefinitions>

MultiscaleImage控件指定图像的“自然”大小（这将是巨大的）是没有意义的。因此，它希望给定尺寸或拉伸到可用尺寸。您需要在gird行/列定义中使用*以确保将Grid所在的控件的剩余可用大小传递到放置MultiscaleImage控件的单元位置。

修改

同时添加

VerticalAlignment="Stretch" HorizontalAlignment="Stretch"

MSI控件的属性。

Silverlight MultiScaleImage不会填充可用空间

2 个答案: