Soạn thảo văn bản Hoạt hình như word2013

Question

Tôi đã tự hỏi, nếu tôi có thể tạo một TextBox hoặc bất kỳ điều khiển nào mà bạn có thể viết một số văn bản trên đó, giống như Word 2013, trải nghiệm hoạt hình rất tốt.

Tôi hiện có thể thực hiện loại hoạt ảnh trên chính bản thân điều khiển (TextBox, ...), nhưng để làm loại hoạt ảnh này cho con trỏ hoặc trên văn bản thì đây là mới.

Answer 1

Bạn có thể tạo một UserFrol WPF hoặc điều khiển tùy chỉnh kế thừa từ hộp văn bản WPF mặc định. Tôi đã có thể tạo một hộp văn bản làm động vị trí con trỏ bằng phương pháp sau:

1-Tạo điều khiển người dùng và thêm hộp văn bản vào nó.

2-Thêm canvas bằng hình chữ nhật bên trong nó (hình chữ nhật là con trỏ mới của bạn).

3 Đặt ô chữ Texetes CaretBrush thành trong suốt.

4-Trong mã của UserControl, tạo phương thức để tạo hiệu ứng con trỏ khi vị trí con trỏ thay đổi.

5-Gọi phương thức hoạt ảnh từ bước 4 khi xảy ra các sự kiện nhất định sẽ thay đổi vị trí con trỏ.

Ví dụ:

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(); 
      } 
     } 

Lưu ý: Đây không phải là một giải pháp toàn diện bởi vì nó không xử lý các hình ảnh động làm nổi bật được lựa chọn văn bản và nó không ẩn con trỏ khi văn bản được đánh dấu, nhưng nó là một sự khởi đầu. Tôi khuyên bạn nên tạo điều này dưới dạng điều khiển tùy chỉnh kế thừa từ TextBox và sau đó thực hiện bố cục của điều khiển trong mẫu kiểu mặc định của hộp văn bản thay vì sử dụng UserControl. Bằng cách đó bạn có thể bảo toàn tất cả các chức năng của TextBox nhưng vẫn nhận được các tính năng hoạt hình mới. Để biết thêm thông tin về điều khiển tùy chỉnh trong WPF, hãy xem this bài viết về lập trình.

Để thay đổi tốc độ của hoạt ảnh, chỉ cần thay đổi thời lượng của con trỏĐịnh dạng.

Answer 2

Không được thô lỗ, nhưng tiếng Anh của bạn là hơi khó khăn để hiểu đầy đủ, vì vậy tôi hy vọng điều này là gần với những gì bạn muốn?

Đề xuất của tôi là tạo điều khiển mới cho "Hộp văn bản" bằng cách tạo điều khiển mới kế thừa Hộp văn bản. Sau đó, bạn ghi đè lên sự kiện onPaint để bây giờ bạn kiểm soát cách hộp văn bản tự vẽ.

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

Điều này cho phép bạn kiểm soát cách điều khiển của bạn tự vẽ và bạn có thể sử dụng điều này thay vì Hộp văn bản có cùng hành vi tương tự.

Bit phức tạp mà tôi sẽ để bạn thử làm, hoặc mở một câu hỏi mới, là mặt đồ họa của mọi thứ, vì vậy khi người dùng di chuyển con trỏ, nó di chuyển một cách trơn tru một dòng mà bản thân bạn vẽ, do đó có toàn quyền kiểm soát.

Nếu bạn thấy nó phức tạp, trước hết hãy nhìn vào đối tượng e.Graphics và các hàm chứa nó.