2

Silverlight 3.0イメージコントロールを使用しており、Stretch property="Uniform"に設定しています。私が間違っていない限り、Stretch = "Uniform"で期待される動作は、必要に応じてアスペクト比を維持し、レターボックスを使用して画像を拡大縮小することです。これは、横向きの画像でうまく機能します。画像を切り取ることなくアスペクト比を維持しながら、スペースを埋めるために拡大します。より垂直または「ポートレート」の向きの画像では完全に失敗します。画像コントロール内に収まるように拡大する代わりに、実際には高さの制約を超えて拡大縮小し、画像の中央のみが表示され、上下が切り取られます。コントロールがスケーリング時に幅のみを使用し、高さをチェックするのを忘れているかのように？

これは画像コントロールのバグですか、それともプロパティが欠落しているか、設定を間違えていますか？再現するには、「ポートレート」アスペクト比（幅よりも背が高い）の画像を検索/作成し、Stretch="Uniform"の画像を作成します。

****要求されたXAMLで更新******サイズが明示的でない理由は、フルスクリーンとスケーリングを可能にするためであることに注意してください。

 <Grid x:Name="LayoutRoot">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="9"/>
        <ColumnDefinition Width="30"/>
        <ColumnDefinition Width="30"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="30"/>
        <ColumnDefinition Width="50"/>
        <ColumnDefinition Width="30"/>
        <ColumnDefinition Width="9"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="30" />
    </Grid.RowDefinitions>

<Border BorderBrush="Black" Grid.Row="0" Grid.ColumnSpan="8" BorderThickness="1, 1, 1, 0">
   <Border BorderBrush="{StaticResource blackStatusMapLGB}" BorderThickness="9,9,9, 0">
      <Border BorderBrush="Gray" BorderThickness="1, 1, 1, 0">
         <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
               <MediaElement Height="Auto" Width="Auto" Visibility="Collapsed" AutoPlay="true" Stretch="Fill" MediaFailed="SilverlightMediaPlayer_MediaFailed" Name="previewMediaElement"/>
                        <Image Name="imagePreview" Stretch="Uniform"/>
          </StackPanel>
      </Border>
   </Border>
</Border>
4

3 に答える 3

6

したがって、垂直 StackPanel の動作方法は、垂直軸に無限のサイズで子を測定し、効果的に子に「好きなだけ高くすることができます」と伝えます。子のサイズを垂直方向には制限しません (ただし、水平方向には制限します)。

明示的なサイズが設定されていない Image で Stretch=Uniform プロパティが機能する方法は、「アスペクト比を維持しながら、サイズの制約内でできるだけ大きくする」ということです。

これら 2 つを組み合わせると、水平軸のみに制限された画像が作成されます。縦横比を維持するために、水平方向に使用可能なすべてのスペースと垂直方向のサイズが使用されます。

この説明は、あなたが見ている行動を見ている理由を理解するのに役立ちますか?

縦横比が 2:1 (縦が横の 2 倍) の画像があるとします。Stretch=Uniform があり、明示的な Width/Height が設定されていません。サイズ 100x100 の StackPanel に配置します。画像には 100xInfinity のサイズ制限が適用されます。最初に水平軸のサイズが設定され、使用可能なすべてのスペースが使用されます。100 ピクセル。次に、縦横比が 2:1 であることを確認し、縦方向のサイズを 200 ピクセルにします。したがって、100x100 の StackPanel にサイズ 100x200 のイメージが作成されます。そのため、StackPanel はその子を使用可能なスペースに強制的にクリップします。

于 2009-09-16T05:08:43.003 に答える
0

背の高い画像でこれを試したところ、うまくいきました。問題は Image 要素のコンテナにあると思われます。実際には画像全体が表示されていますが、上部と下部が切り取られています。

これが私がテストに使用したものです：

    <UserControl
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        x:Class="Temp_Delete.MainPage"
        Width="640" Height="480">

        <Grid x:Name="LayoutRoot" Background="White">
            <Image Source="Tall.png" Stretch="Uniform"></Image>
        </Grid>
    </UserControl>

更新:高さが定義されていないため、ネストされたすべての境界線がそれを捨てています。最上位の境界線で ImageBrush を使用します。

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    x:Class="Temp_Delete.MainPage"
    Width="640" Height="480">

    <Grid x:Name="LayoutRoot">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="9"/>
            <ColumnDefinition Width="30"/>
            <ColumnDefinition Width="30"/>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="30"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="30"/>
            <ColumnDefinition Width="9"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="30" />
        </Grid.RowDefinitions>
        <Border BorderBrush="Black" Grid.Row="0" Grid.ColumnSpan="8" BorderThickness="1, 1, 1, 0">
            <Border.Background>
                <ImageBrush Stretch="Uniform"/>
            </Border.Background>
            <Border BorderBrush="Black" BorderThickness="9,9,9, 0">
                <Border BorderBrush="Gray" BorderThickness="1, 1, 1, 0">
                    <StackPanel VerticalAlignment="Center" HorizontalAlignment="Center">
                        <MediaElement Height="Auto" Width="Auto" Visibility="Collapsed" AutoPlay="true" Stretch="Fill" MediaFailed="SilverlightMediaPlayer_MediaFailed" Name="previewMediaElement"/>
                    </StackPanel>
                </Border>
            </Border>
        </Border>
    </Grid>
</UserControl>

すべての境界線を正しく表示するには少し調整が必要になる場合がありますが、重要な場合は、コンテナー要素にパディング/マージンを設定できます。

その XAML でイメージが機能するかどうかを確認できますか? コンテキストを確認できるように、XAML をさらに投稿していただけますか?

于 2009-09-11T18:31:28.130 に答える
0

これは、イメージの高さではなく幅が (親コンテナーによって) 設定されていることが原因である可能性があります。均一に伸びていますが、高さには制約がなく、クリップされています。

これで問題が解決しない場合は、コンテナーの XAML を提供してください。

于 2009-09-11T18:38:45.120 に答える