FabricJS を使用して IText に文字を挿入するにはどうすればよいですか?

このチュートリアルでは、FabricJS を使用して IText に文字を挿入する方法を学びます。 IText クラスは FabricJS バージョン 1.4 で導入されました。これは Fabric.Text を拡張し、IText インスタンスの作成に使用されます。 IText インスタンスを使用すると、追加の構成を行わずに、新しいテキストを自由に選択、切り取り、貼り付け、または追加できます。 Text では利用できない、テキストをインタラクティブにするためのさまざまなキーの組み合わせやマウスとタッチの組み合わせもサポートされています。

ただし、IText ベースの Textbox を使用すると、テキスト四角形のサイズを変更し、自動的に折り返すことができます。 IText の場合は、改行に基づいて高さが調整されないため、これは当てはまりません。さまざまなプロパティを使用して IText オブジェクトを操作できます。同様に、insertChars メソッドを使用して文字を挿入できます。

パラメータ

• text

  - このパラメータは、挿入するテキストを指定する String を受け入れます。

• style

  - このパラメータは、テキストに適用されるスタイル オブジェクトの配列を表す array を受け入れます。

• start

  - このパラメータは、文字が挿入される位置を示す number を受け入れます。

• end

  - このパラメータは、終了位置をマークする Number を受け入れます。デフォルトは開始 1 です。

例 1

insertChars メソッドを使用しない場合の IText オブジェクトのデフォルトの外観を確認するコード例を見てみましょう。この場合、文字

例 2

insertChars メソッドを使用したときに IText オブジェクトがどのように見えるかをコード例で見てみましょう。この例では、これが開始位置であるため、「a」が 6 番目のインデックスの位置「m」に挿入されています。スタイルの配列を提供したため、必要なスタイルの変更も適用されます。

以上がFabricJS を使用して IText に文字を挿入するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。