(精华)2020年02月06日 WPF课程管理系统项目实战(平台布局-抽屉侧滑栏）

相关代码

<!--抽屉侧滑栏-->
 <Border Background="#EE444444" Width="240" HorizontalAlignment="Right" 
         CornerRadius="0,5,5,0">
     <Border.Effect>
         <DropShadowEffect Color="Gray" ShadowDepth="0" BlurRadius="5" Opacity="0.3" Direction="180"/>
     </Border.Effect>
     <Border.RenderTransform>
         <TranslateTransform X="250" x:Name="tt"/>
     </Border.RenderTransform>
     <Grid>
         <Grid.RowDefinitions>
             <RowDefinition Height="230"/>
             <RowDefinition/>
         </Grid.RowDefinitions>
         <Button Width="40" Height="40" BorderThickness="0" Content="&#xe653;"
             FontFamily="../Assets/Fonts/#iconfont"
             VerticalAlignment="Top" HorizontalAlignment="Left"
             Name="btnCloseUserInfo"/>

         <Border Width="80" Height="80" CornerRadius="40">
             <Border.Effect>
                 <DropShadowEffect Color="White" ShadowDepth="0" BlurRadius="5" Opacity="0.3" Direction="0"/>
             </Border.Effect>
             <Border.Background>
                 <ImageBrush ImageSource="{Binding UserInfo.Avatar}"/>
             </Border.Background>
         </Border>

         <Grid Grid.Row="1" Margin="20,0">
             <Grid.Resources>
                 <Style TargetType="RadioButton">
                     <Setter Property="Foreground" Value="White"/>
                     <Setter Property="FontSize" Value="14"/>
                 </Style>
                 <Style TargetType="TextBlock">
                     <Setter Property="Foreground" Value="White"/>
                     <Setter Property="FontSize" Value="14"/>
                 </Style>
             </Grid.Resources>
             <Grid.RowDefinitions>
                 <RowDefinition Height="40"/>
                 <RowDefinition Height="40"/>
                 <RowDefinition Height="40"/>
                 <RowDefinition Height="40"/>
             </Grid.RowDefinitions>
             <StackPanel Orientation="Horizontal" VerticalAlignment="Center">
                 <TextBlock Text="用户名"/>
                 <TextBlock Text="{Binding UserInfo.UserName}" Margin="10,0,0,0"/>
             </StackPanel>
             <StackPanel Orientation="Horizontal" Grid.Row="1" VerticalAlignment="Center">
                 <TextBlock Text="性   别"/>
                 <RadioButton Content="男" Margin="10,0,0,0" Template="{StaticResource GenderRadioButtonTemplate}"
                              IsChecked="{Binding UserInfo.Gender,Converter={StaticResource genderConverter},ConverterParameter=1}"/>
                 <RadioButton Content="女" Margin="10,0,0,0" Template="{StaticResource GenderRadioButtonTemplate}" 
                              IsChecked="{Binding UserInfo.Gender,Converter={StaticResource genderConverter},ConverterParameter=2}"/>
             </StackPanel>
         </Grid>
     </Grid>
 </Border>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
  
11
  
12
  
13
  
14
  
15
  
16
  
17
  
18
  
19
  
20
  
21
  
22
  
23
  
24
  
25
  
26
  
27
  
28
  
29
  
30
  
31
  
32
  
33
  
34
  
35
  
36
  
37
  
38
  
39
  
40
  
41
  
42
  
43
  
44
  
45
  
46
  
47
  
48
  
49
  
50
  
51
  
52
  
53
  
54
  
55
  
56
  
57
  
58
  
59
 

抽屉侧滑栏实际触发

<Window.Triggers>
        <EventTrigger RoutedEvent="Button.Click" SourceName="btnUsreInfo">
            <BeginStoryboard Storyboard="{StaticResource UserInfoStoryboard}"/>
        </EventTrigger>
        <EventTrigger RoutedEvent="Button.Click" SourceName="btnCloseUserInfo">
            <BeginStoryboard Storyboard="{StaticResource CloseUserInfoStoryboard}"/>
        </EventTrigger>
    </Window.Triggers>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
 

<Storyboard x:Key="UserInfoStoryboard">
    <DoubleAnimation Duration="0:0:0.2" To="0"
                     Storyboard.TargetName="tt"
                     Storyboard.TargetProperty="X"/>
</Storyboard>
<Storyboard x:Key="CloseUserInfoStoryboard">
    <DoubleAnimation Duration="0:0:0.1"
                     Storyboard.TargetName="tt"
                     Storyboard.TargetProperty="X"/>
</Storyboard>

  

 

  
1
  
2
  
3
  
4
  
5
  
6
  
7
  
8
  
9
  
10
 

文章来源: codeboy.blog.csdn.net，作者：愚公搬代码，版权归原作者所有，如需转载，请联系作者。

原文链接：codeboy.blog.csdn.net/article/details/113622856