7

その中に画像が入ったビューボックスがあります。Viewbox はウィンドウに合わせて Image をスケーリングするので、これは素晴らしいことです。ただし、画像をフルサイズにズームしてスクロールバーを表示できるようにする必要があり、これを行う方法を理解するのに苦労しています。

これが私が今持っているものです。上記の機能を実装するためにこれを変更する方法について、誰かがいくつかの指針を与えることができますか?

<Viewbox x:Name="viewbox">
    <StackPanel>
        <Image x:Name="image" Source="ranch.jpg" />
    </StackPanel>
</Viewbox>

編集：明確にするために。画像を表示する方法、ウィンドウに合わせたビューボックススタイル、およびスクロールバーを表示し、画像のサイズを変更しない実際のサイズのビューに切り替える機能の両方が必要です。

4

4 に答える 4

14

ここにをViewbox入れる必要はありません。ImageScrollViewerVerticalScrollBarVisibilityHorizontalScrollBarVisibilityImage

<Grid xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
    </Grid.RowDefinitions>
    <CheckBox x:Name="chkActualSize" Grid.Row="0" Content="Actual Size"/>
    <ScrollViewer Grid.Row="1">
        <ScrollViewer.Style>
            <Style TargetType="{x:Type ScrollViewer}">
                <Setter Property="HorizontalScrollBarVisibility" Value="Disabled"/>
                <Setter Property="VerticalScrollBarVisibility" Value="Disabled"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsChecked, ElementName=chkActualSize}" Value="True">
                        <Setter Property="HorizontalScrollBarVisibility" Value="Auto"/>
                        <Setter Property="VerticalScrollBarVisibility" Value="Auto"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ScrollViewer.Style>
        <Image Source="http://sipi.usc.edu/database/misc/4.1.01.tiff" VerticalAlignment="Center" HorizontalAlignment="Center"/>
    </ScrollViewer>
</Grid>
于 2009-03-12T17:54:26.020 に答える
4 
<ScrollViewer HorizontalScrollBarVisibility="Auto">
    <Viewbox>
        <Image Source="ranch.jpg"/>
    </Viewbox>
</ScrollViewer>
于 2009-03-12T17:00:50.673 に答える
1

2つのアプローチを切り替える必要があるという編集に基づいて、2つの方法のいずれかでこれを行います。

  1. 画像には2つの要素があります。ビューボックスのないScrollViewer内のImage要素は、フルサイズの画像を提供し、Viewboxバージョンはそれを拡大縮小します。次に、表示する内容に応じて2つを切り替えることができます。

  2. 画像のHeightプロパティとWidthプロパティでバインディング式を使用し、スクロールビューア内で囲みます。（ある種のトリガーで）スケーリングする場合は、Heightを、ScrollViewerのActualHeightプロパティまたはそのすぐ上にあるコンテナーにアクセスするバインディング式に設定します（RelativeSourceを使用して次のような最も近い祖先にアクセスします）。

    {Binding Path=ActualHeight, 
         RelativeSource={RelativeSource AncestorType={x:Type ScrollViewer}}}
于 2009-03-12T17:44:55.280 に答える
0

探している人のために私のソリューションを投稿すると思いました。

                <Slider Width="200" Value="500" Interval="25" Maximum="1000" x:Name="TestImageSlider" Minimum="-50" />
            <ScrollViewer Grid.Row="1" HorizontalScrollBarVisibility="Auto">
              <Image Source="{Binding SelectedScannedImage.ScannedImage}" Width="{Binding Path=Value, ElementName=TestImageSlider}" />
            </ScrollViewer>
于 2015-05-06T13:52:24.680 に答える