照旧,直接贴代码
<UserControl
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"
mc:Ignorable="d"
x:Class="ControlTemplate.ShowMenu"
d:DesignWidth="200" d:DesignHeight="480">
<Grid x:Name="LayoutRoot">
<Grid.Resources>
<Storyboard x:Name="hide">
<DoubleAnimation Duration="00:00:01" From="0" To="-190"
Storyboard.TargetName="tt" Storyboard.TargetProperty="X"/>
</Storyboard>
<Storyboard x:Name="show">
<DoubleAnimation Duration="00:00:01" From="-190" To="0"
Storyboard.TargetName="tt" Storyboard.TargetProperty="X"/>
</Storyboard>
</Grid.Resources>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="10"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<TextBlock Text="模拟" HorizontalAlignment="Center" Margin="0,10,0,0"/>
<TextBlock Text="预警" HorizontalAlignment="Center" Margin="0,10,0,0"/>
<TextBlock Text="预报" HorizontalAlignment="Center" Margin="0,10,0,0"/>
<TextBlock Text="统计" HorizontalAlignment="Center" Margin="0,10,0,0"/>
</StackPanel>
<Rectangle Grid.Column="1" Fill="BlueViolet" MouseLeftButtonDown="Rectangle_MouseLeftButtonDown"/>
<Grid.RenderTransform>
<TranslateTransform x:Name="tt" X="0"/>
</Grid.RenderTransform>
</Grid>
</UserControl>
ShowMenu.xaml.cs
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace ControlTemplate
{
public partial class ShowMenu : UserControl
{
private bool isShow = true;
public ShowMenu()
{
// 为初始化变量所必需
InitializeComponent();
}
private void Rectangle_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
if (isShow)
{
hide.Begin();
}
else
{
show.Begin();
}
isShow = !isShow;
}
}
}
很简单吧