Увеличение/уменьшение анимации WPF

В WPF, когда пользователь получает фокус в TextBox, мне нужна анимация, которая сделает TextBox многострочным и сделает его Width больше (пока он печатает), а когда фокус потеряется, TextBox вернется к исходному размер.

Размер неизвестен.

Кроме того, в конечном счете, этот TextBox должен находиться в WPF DataGrid.

Я никогда раньше не занимался анимацией и хотел бы, чтобы кто-нибудь помог мне начать. Спасибо.

EDIT: мне удалось сделать анимацию с некоторыми фиксированными значениями ширины (сделать ее многострочной не получилось, но это не так важно). Итак, мой вопрос сейчас в том, как я могу вернуться к своему первоначальному размеру, если он неизвестен. Можно ли использовать множитель для свойства Width?

Вот мой код:

<Window.Resources>
        <Storyboard x:Key="GrowStoryboard">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="textBox" Storyboard.TargetProperty="(FrameworkElement.Width)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="400" KeySpline="0.54,0.27,0.38,0.69"/>
            </DoubleAnimationUsingKeyFrames>
            <Int32Animation Duration="0:0:0.4" From="1" To="3" Storyboard.TargetName="textBox" Storyboard.TargetProperty="(TextBox.MinLines)">
            </Int32Animation>
        </Storyboard>
        <Storyboard x:Key="ShrinkStoryboard">
            <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="textBox" Storyboard.TargetProperty="(FrameworkElement.Width)">
                <SplineDoubleKeyFrame KeyTime="00:00:00.4000000" Value="200" KeySpline="0.54,0.27,0.38,0.69"/>
            </DoubleAnimationUsingKeyFrames>
        </Storyboard>
    </Window.Resources>
    <Window.Triggers>
        <EventTrigger RoutedEvent="FocusManager.GotFocus" SourceName="textBox">
            <BeginStoryboard x:Name="GrowStoryboard_BeginStoryboard" Storyboard="{StaticResource GrowStoryboard}"/>
        </EventTrigger>
        <EventTrigger RoutedEvent="FocusManager.LostFocus" SourceName="textBox">
            <BeginStoryboard x:Name="ShrinkStoryboard_BeginStoryboard" Storyboard="{StaticResource ShrinkStoryboard}"/>
        </EventTrigger>
    </Window.Triggers>

    <StackPanel>
        <TextBox x:Name="textBox" Width="200" Height="20" Text="TextBox" />
        <TextBox x:Name="textBox1" Width="200" Height="20" Text="TextBox" />
    </StackPanel>

animation storyboard wpf width textbox
person joerage    schedule 26.01.2010    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Хотя в XAML нет множителя, который можно было бы использовать, для этого можно создать класс IValueConverter. Например:

    class Multiplier : IValueConverter
{
    public object Convert( object value, Type targetType, object parameter, System.Globalization.CultureInfo culture )
    {
        var dblValue = 1.0;
        if (value is double)
            dblValue = (double)value;
        else if ( !(value is string) || !double.TryParse( (string)value, out dblValue ) )
            return null;

        var dblParam = 1.0;
        if (parameter is double)
            dblParam = (double)parameter;
        else if ( !(parameter is string) || !double.TryParse( (string)parameter, out dblParam ) )
            return null;

        return dblValue * dblParam;
    }

    public object ConvertBack( object value, Type targetType, object parameter, System.Globalization.CultureInfo culture )
    {
        throw new NotImplementedException();
    }
}

Затем вы можете использовать это в XAML, чтобы ширина текстового поля увеличивалась и уменьшалась с таким коэффициентом...

        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="textBox" Storyboard.TargetProperty="(FrameworkElement.Width)">
            <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="{Binding ElementName=textBox, Path=Width, Converter={StaticResource Multiplier}, ConverterParameter=2}" KeySpline="0.54,0.27,0.38,0.69"/>
        </DoubleAnimationUsingKeyFrames>

        <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="textBox" Storyboard.TargetProperty="(FrameworkElement.Width)">
            <SplineDoubleKeyFrame KeyTime="0:0:0.4" Value="{Binding ElementName=textBox, Path=Width, Converter={StaticResource Multiplier}, ConverterParameter=0.5}" KeySpline="0.54,0.27,0.38,0.69"/>
        </DoubleAnimationUsingKeyFrames>
person MerickOWA    schedule 22.08.2010