wpf 子控件超出父控件部分不绘制

Question

这是我的代码：

<Window x:Class="SwitchAnimation.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:SwitchAnimation"
        mc:Ignorable="d" Style="{StaticResource DefaultWindow}" WindowStartupLocation="CenterScreen"
        Title="MainWindow" Height="350" Width="500">
    <Window.Resources>
        <Storyboard x:Key="SlideStoryboard">
            <DoubleAnimation BeginTime="00:00:00"   Duration="00:00:05" RepeatBehavior="1"  Storyboard.TargetName="bdFuns"  From="0" To="-480"
                                           Storyboard.TargetProperty="(UIElement.RenderTransform).X">
            </DoubleAnimation>
        </Storyboard>
    </Window.Resources>
    <Grid ClipToBounds="True">
        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Border x:Name="bdFuns" Height="200" VerticalAlignment="Top" Width="960" Background="Gray">
            <Border.RenderTransform>
                <TranslateTransform X="0" />
            </Border.RenderTransform>
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>
                <Button x:Name="button" Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100"/>
                <Button Grid.Column="1" x:Name="fg" Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100"/>
                <Button Grid.Column="2" x:Name="bufddtton" Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100"/>
                <Button  Grid.Column="3" x:Name="gdfgdg" Content="天气真好啊" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100"/>
                <Button  Grid.Column="4" x:Name="fgfgsd" Background="Red" Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100" Height="22" Margin="30,89"/>
                <Button  Grid.Column="5" x:Name="k" Content="Button" HorizontalAlignment="Center" VerticalAlignment="Center" Width="100"/>

            </Grid>
        </Border>
        
        <Button Grid.Row="1" Width="100" Content="开始动画"  Margin="0, 20" Padding="0, 10" Click="Button_Click"/>
        
    </Grid>
</Window>

很显然子控件后面部分没绘制

Answer 1

在目标Board外层嵌套一个ScrollViewer

 <ScrollViewer HorizontalScrollBarVisibility="Hidden"
                      HorizontalContentAlignment="Stretch">
            <Border x:Name="bdFuns" Height="200" VerticalAlignment="Top" Width="960" Background="Gray">
                <Border.RenderTransform>
                    <TranslateTransform X="0" />
                </Border.RenderTransform>