Question

我在标签控件中有两个标签项，我想在从另一个标签项中选择一个标签项时给出滑动效果（动画）。让我知道是否有人有想法实现这个动画。提前谢谢。

Answer 1

http://social.msdn.microsoft.com/Forums/en-AU/wpf/thread/ed8801d8-51c4-4671-8b8c-86544c6d434d 这是有用的，常青树..我刚刚使用过它

这似乎是更新版本 http://blogs.intuidev.com/post/2010/01/26/TabControlStyling_PartTwo.aspx

还有更多不确定你的滑动效果是什么意思？！任何让我理解的例子

Answer 2

xaml代码：

<Window x:Class="TabControlAnimation.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525" WindowState="Maximized">

    <Grid HorizontalAlignment="Center" Name="maingrid">
        <Grid.Resources>
            <DataTemplate x:Key="TabTemplate">
                <Grid Name="gd">
                    <ContentControl Content="{Binding}"></ContentControl>
                </Grid>
            </DataTemplate>
        </Grid.Resources>
        <StackPanel Orientation="Horizontal">
            <TabControl ContentTemplate="{StaticResource TabTemplate}" Name="_menuTabControl" TabStripPlacement="Top" Width="auto" Height="{Binding ElementName=maingrid, Path=Height}" SelectionChanged="_menuTabControl_SelectionChanged">
                <TabItem Header="MyTabItem1">
                    <Grid Background="Red">
                        <TextBlock Text="This is tab1"></TextBlock>
                    </Grid>                      
                </TabItem>
                <TabItem Header="MyTabItem2">
                    <Grid Background="Green">
                        <TextBlock Text="This is tab2"></TextBlock>
                    </Grid>                      
                </TabItem>
                <TabItem Header="MyTabItem3">
                    <Grid Background="Yellow">
                        <TextBlock Text="This is tab3"></TextBlock>
                    </Grid>                      
                </TabItem>
                <TabItem Header="MyTabItem4">
                    <Grid Background="Violet">
                        <TextBlock Text="This is tab4"></TextBlock>
                    </Grid>                       
                </TabItem>
            <TabItem Header="MyTabItem5">
                <Grid Background="Blue">
                    <TextBlock Text="This is tab5"></TextBlock>
                </Grid>
            </TabItem>
        </TabControl>
        </StackPanel>
    </Grid>

代码背后：

 public partial class MainWindow : Window
{

    public MainWindow()
    {
        InitializeComponent();
    }

   public IEnumerable<T> FindVisualChildren<T>(DependencyObject depObj) where T:DependencyObject
    {
       if(depObj!=null)
       {
           for(int i=0;i<VisualTreeHelper.GetChildrenCount(depObj);i++)
           {
               DependencyObject child = VisualTreeHelper.GetChild(depObj, i);
               if (child != null && child is T)
                   yield return (T)child;

               foreach (T childOfChild in FindVisualChildren<T>(child))
                   yield return childOfChild;
           }
       }
    }


   int prev = -1, curr = -1;
    private void _menuTabControl_SelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        curr = (sender as TabControl).SelectedIndex;
        if(prev!=curr)
        {
            foreach(var rectangle in FindVisualChildren<Grid>(this))
            {
                if(rectangle.Name=="gd")
                {
                    DoubleAnimation translate_x=null;
                    if(prev>curr)
                    {
                        translate_x = new DoubleAnimation()
                        {
                            From = -300,
                            To = 0,
                            Duration = TimeSpan.FromSeconds(0.3),

                        };
                    }
                    else
                    {
                        translate_x = new DoubleAnimation()
                        {
                            From = 300,
                            To = 0,
                            Duration = TimeSpan.FromSeconds(0.3),
                        };
                    }
                    var translate_y = new DoubleAnimation()
                    {
                        From = 0,
                        To = 0,
                        Duration = TimeSpan.FromSeconds(1),
                    };
                    TranslateTransform translateTransform1 = new TranslateTransform();
                    translateTransform1.BeginAnimation(TranslateTransform.XProperty, translate_x);
                    translateTransform1.BeginAnimation(TranslateTransform.YProperty, translate_y);
                    rectangle.RenderTransform = translateTransform1;
                    prev = curr;
                }
            }
        }
    }
}

WPF Tabcontrol：选项卡项选择的滑动效果

2 个答案: