1

こんにちは、見てくれてありがとう！

バックグラウンド

これは、この質問の拡張です。

WPFラップパネル内で子アイテムを上下にスライドするにはどうすればよいですか？

WrapPanelここで、ボタンクリックでコンテンツをプログラムで上下にスクロールする方法を尋ねました。この質問は親切に答えられ、受け入れられた解決策はうまく機能します。

問題

WrapPanelボタンをクリックすると上下にスクロールするサムネイルが表示されますWrapPanelが、タイルがフレームの外側にあるときにタイルが表示されないようにマスクするにはどうすればよいですか？たとえば、StackPanel上WrapPanelにスクロールアップボタンと下スクロールボタンを保持するボタンがありますが、下にスクロールすると、サムネイルがStackPanel上（およびボタン）を覆います。これが私のXAMLです。サムネイルはWrapPanel実行時に追加されることに注意してください。

アップデート

Dave ClemmerのXAMLを使用すると、レイアウトはより安定しますが、それでも、上記の日食の内容にWrapPanelなりStackPanelます。スクロールイベントの前後に行われた次のスクリーングラブを参照してください。

スクロールする前に-

スクロールする前に

スクロール後- ここに画像の説明を入力してください

アップデート2

以下のDaveのコメントに従って、キャンバスを赤い背景に設定します。

スクロールする前に-

ここに画像の説明を入力してください

スクロール後-

ここに画像の説明を入力してください

4

2 に答える 2

2

まあ、私はこれを直感的とは言いませんが、結局、これはうまくいきました：

 <Border Grid.Row="1" Background="Transparent" ClipToBounds="True">       
            <Canvas>
                <WrapPanel x:Name="spContainer"  
                   Width="{Binding ActualWidth,  
                           RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}">
                </WrapPanel>
            </Canvas>
 </Border>

境界線を追加することでうまくいきました。デイブのすべての助けに感謝します！

于 2012-01-01T22:01:23.987 に答える
1

スクロールバー（no ScrollViewer）が不要で、StackPanel修正したいようです。StackPanelおよびを次のようWrapPanelに別々のGrid行に保持します。

<Grid> 
    <Grid.RowDefinitions> 
        <RowDefinition Height="Auto" /> 
        <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 
    <StackPanel Grid.Row="0" Height="150" HorizontalAlignment="Left" Margin="30,10,10,10" Name="stackPanel1" VerticalAlignment="Top" Width="Auto" Orientation="Horizontal" >  
        <Label Content="Home Navigator v0.1" FontFamily="Tahoma" FontSize="30" FontWeight="Bold" Foreground="White" />  
        <Button Content="Close" Height="50" Click="Button_Click" VerticalAlignment="Top"></Button>  
        <Button Content="Scroll Down" Height="50" Click="ScrollDown" VerticalAlignment="Top"></Button>  
    </StackPanel>  
    <Canvas Grid.Row="1">  
        <WrapPanel x:Name="spContainer"  
                   Width="{Binding ActualWidth,  
                           RelativeSource={RelativeSource AncestorType={x:Type Canvas}}}">  
        </WrapPanel>      
    </Canvas>  
</Grid>
于 2012-01-01T21:00:12.560 に答える