Написание текста Анимация как word2013

Мне было интересно, могу ли я создать TextBox или любой элемент управления, который вы можете написать на нем, например, как Word 2013, опыт анимации очень хорош.

Теперь я могу сделать тип анимации самого элемента управления (TextBox,...), но для этого типа анимации курсор или сам текст это новый.

enter image description here
enter image description here

Ответы

Ответ 1

Вы можете создать WPF UserControl или настраиваемый элемент управления, который наследуется от текстового поля WPF по умолчанию. Мне удалось создать текстовое поле, которое анимирует позицию курсора следующим образом:

1 - Создайте пользовательский элемент управления и добавьте в него текстовое поле.

2-Добавить холст с прямоугольником внутри него (прямоугольник - ваш новый курсор).

3. Установите для Texboxes CaretBrush прозрачность.

4 - В коде кода UserControl создайте метод для анимации курсора при изменении положения курсора.

5. Вызовите метод анимации с шага 4, когда произойдут некоторые события, которые изменили бы положение курсора.

Пример:

UserControl XAML

    <UserControl
        x:Class="YourNamespace.AnimatedCursorTextBox"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        mc:Ignorable="d"
        d:DesignHeight="23"
        d:DesignWidth="300"
        xmlns:c="clr-namespace:System.Windows.Controls;assembly=PresentationFramework"
        Name="Control">
        <UserControl.Resources>
            <c:BooleanToVisibilityConverter
                x:Key="BoolToVisibility" />
        </UserControl.Resources>
        <Grid>
            <TextBox
                Name="MainTextBox"
                CaretBrush="Transparent"
                SelectionChanged="MainTextBox_SelectionChanged"
                TextChanged="MainTextBox_TextChanged"
                GotKeyboardFocus="MainTextBox_GotKeyboardFocus" />
            <Canvas
                Visibility="{Binding IsKeyboardFocusWithin,
                    ElementName=Control,
                    Converter={StaticResource BoolToVisibility}}"
                Height="{Binding ActualHeight, ElementName=MainTextBox}"
                Width="{Binding ActualWidth, ElementName=MainTextBox}">
                <Rectangle
                    HorizontalAlignment="Left"
                    Name="Caret"
                    Width="1"
                    Fill="Black" />
            </Canvas>
        </Grid>
    </UserControl>

Code-Behind:

    public partial class AnimatedCursorTextBox : UserControl
        {
            private DoubleAnimation cursorAnimation = new DoubleAnimation();

            public AnimatedCursorTextBox()
            {
                InitializeComponent();
            }

            private void UpdateCaretPosition()
            {
                var rectangle = MainTextBox.GetRectFromCharacterIndex(MainTextBox.CaretIndex);
                Caret.Height = rectangle.Bottom - rectangle.Top;
                Canvas.SetTop(Caret, rectangle.Top);
                Canvas.SetBottom(Caret, rectangle.Bottom);

                var left = Canvas.GetLeft(Caret);
                if (!double.IsNaN(left))
                {
                    cursorAnimation.From = left;
                    cursorAnimation.To = rectangle.Right;
                    cursorAnimation.Duration = new Duration(TimeSpan.FromSeconds(.05));

                    Caret.BeginAnimation(Canvas.LeftProperty, cursorAnimation);
                }
                else
                {
                    Canvas.SetLeft(Caret, rectangle.Right);
                }
            }

            private void MainTextBox_SelectionChanged(object sender, RoutedEventArgs e)
            {
                UpdateCaretPosition();
            }

            private void MainTextBox_TextChanged(object sender, TextChangedEventArgs e)
            {
                UpdateCaretPosition();
            }

            private void MainTextBox_GotKeyboardFocus(object sender, KeyboardFocusChangedEventArgs e)
            {
                UpdateCaretPosition();
            }
        }

Примечание. Это не комплексное решение, потому что оно не обрабатывает анимацию выделения выделенного текста и не скрывает курсор, когда текст выделен, но это начало. Я рекомендую создать это как настраиваемый элемент управления, наследующий от TextBox, а затем выполнить макет элемента управления в шаблоне стиля по умолчанию в текстовом поле, а не использовать UserControl. Таким образом, вы можете сохранить все функциональные возможности TextBox, но при этом получить новые возможности анимации. Дополнительные сведения о пользовательских элемента управления в WPF см. В этой статье о codeproject.

Чтобы изменить скорость анимации, просто измените продолжительность cursorAnimation.

Ответ 2

Не грубить, но ваш английский немного сложно понять, поэтому я надеюсь, что это близко к тому, что вы хотели?

Моей рекомендацией было бы создать новый элемент управления "Текстовое поле", создав новый элемент управления, который наследует текстовое поле. Затем вы переопределяете событие onPaint, чтобы теперь вы контролировали, как текстовое поле рисует сам.

public class newTextBox : System.Windows.Forms.TextBox
{
    protected override void OnPaint(System.Windows.Forms.PaintEventArgs e)
    {
        base.OnPaint(e);
    }
}

Теперь это дает вам контроль над тем, как ваш элемент управления рисует себя, и вы можете использовать его вместо текстовых полей с таким же поведением.

Сложный бит, который я оставлю вам попробовать, или открыть новый вопрос, является графической стороной вещей, поэтому, когда пользователь перемещает курсор, он плавно перемещает строку, которую вы лично рисуете, таким образом имеют полный контроль.

Если вы считаете это сложным, сначала просмотрите объект e.Graphics и функции, которые он содержит.