FireMonkey テキスト レイアウト機能の使用

提供: RAD Studio
移動先: 案内検索

FireMonkey のテキスト レイアウト への移動


ここでは、FireMonkey で提供されているテキスト レイアウト機能の使い方を例を使って示します。 この例には、TImage オブジェクト上にテキストを描画する方法と、PositionAtPointRegionForRangeConvertToPath の各メソッドの使い方を示すコードが含まれています。

空のマルチデバイス アプリケーションの作成

  1. 新しい空のマルチデバイス アプリケーションを作成します。
  2. [ツール パレット]から以下のコンポーネントをフォームに追加します。
  3. [オブジェクト インスペクタ]で、TFormOnCreate イベント、TImageOnPaint イベント、各 TButtonOnClick イベントについて、それぞれイベント ハンドラを作成します。
  • 設計した結果は次のようになります。

600px

メモ: 次のサンプルをレプリケートするには、TImage で背景色を追加することを覚えておいてください。

テキスト レイアウトを使用するコードの追加

  1. 次の宣言を追加します。

Delphi の場合:

MyLayout: TTextLayout;
PathAnimation1: TPathAnimation;

C++ の場合:

//header file
TPathAnimation *PathAnimation1;
TTextLayout *MyLayout;
  1. 次のコードを TFormOnCreate イベント ハンドラに追加します。

Delphi の場合:

procedure TForm3.FormCreate(Sender: TObject);
begin
  RadioButton1.Position.X := Image1.Position.X - 5;
  RadioButton1.Position.Y := Image1.Position.Y - 5;
  RadioButton1.Text := '';
end;

C++ の場合:

void __fastcall TForm3::FromCreate(TObject *Sender)
{
	RadioButton1->Position->X = Image1->Position->X - 5;
	RadioButton1->Position->Y = Image1->Position->Y - 5;
	RadioButton1->Text = "";
}
2. 次のコードを TImageOnPaint イベント ハンドラに追加します。

Delphi の場合:

procedure TForm3.Image1Paint(Sender: TObject; Canvas: TCanvas;
  const ARect: TRectF);

begin
  MyLayout := TTextLayoutManager.DefaultTextLayout.Create;
  MyLayout.BeginUpdate;
  MyLayout.TopLeft := TPointF.Create(0, 0);
  MyLayout.Font.Size := 78;
  MyLayout.Font.Family := 'Tahoma';
  MyLayout.Font.Style := [TFontStyle.fsBold];
  MyLayout.Text := 'TEXT';
  MyLayout.Color := TAlphaColorRec.Brown;
  MyLayout.RenderLayout(Canvas);
end;

C++ の場合:

void __fastcall TForm3::Image1Paint(TObject *Sender, TCanvas *Canvas, const TRectF &ARect)

{
	Fmx::Graphics::TFont *font;
	MyLayout = TTextLayoutManager::TextLayoutForClass
		(TTextLayoutManager::DefaultTextLayout);
	MyLayout->BeginUpdate();
	MyLayout->TopLeft = TPointF(0, 0);
	MyLayout->Font->Size = 78;
	MyLayout->Font->Family = "Tahoma";
	MyLayout->Font->Style = TFontStyles(1);
	MyLayout->Text = "TEXT";
	MyLayout->Color = TAlphaColorRec::Brown;
	
}
  • 実行した結果は次のようになります。
600px
3. 次のコードをTButtonOnClick イベント ハンドラに追加し、テキストをパスに変換したりアニメーションを開始できるようにします。

Delphi の場合:

procedure TForm3.Button1Click(Sender: TObject);
var
  PathD: TPathData;
begin
  PathAnimation1 := TPathAnimation.Create(Self);
  PathAnimation1.Parent := RadioButton1;
  PathD := TPathData.Create();
  MyLayout.ConvertToPath(PathD);
  PathAnimation1.Path := PathD;
  PathAnimation1.Loop := True;
  PathAnimation1.Duration := 50;
end;

procedure TForm3.Button2Click(Sender: TObject);
begin
  PathAnimation1.Start;
end;

C++ の場合:

void __fastcall TForm3::Button1Click(TObject *Sender)
{
	TPathData *PathD;
	PathAnimation1 = new TPathAnimation(this);
	PathAnimation1->Parent = RadioButton1;
	PathD = new TPathData();
	MyLayout->ConvertToPath(PathD);
	PathAnimation1->Path = PathD;
	PathAnimation1->Loop = true;
	PathAnimation1->Duration = 50;
}

void __fastcall TForm3::Button2Click(TObject *Sender)
{
	PathAnimation1->Start();
}
  • 実行した結果は次のようになります。
Link=


4. 次のコードを TButtonOnClick イベント ハンドラに追加し、RegionForRange を呼び出します。

Delphi の場合:

procedure TForm3.Button3Click(Sender: TObject);
var
  MyRects: TRegion;
begin

  MyRects := MyLayout.RegionForRange(TTextRange.Create(1, 1));
  if Image1.Bitmap.Canvas.BeginScene then
  begin
    try
      Image1.Bitmap.Canvas.DrawRect(MyRects[0], 0, 0, AllCorners, 100);
    finally
      Image1.Bitmap.Canvas.EndScene;
    end;
  end;
end;

C++ の場合:

void __fastcall TForm3::Button3Click(TObject *Sender)
{
	TRegion MyRects;
	MyRects = MyLayout->RegionForRange(TTextRange(1, 1));
	if (Image1->Bitmap->Canvas->BeginScene())
	{
	   try {
			Image1->Bitmap->Canvas->DrawRect(MyRects[0], 0, 0, AllCorners, 100);
	   } __finally  {
			Image1->Bitmap->Canvas->EndScene();
	   }
	}
}
  • 実行した結果は次のようになります。
Link=

使用する API

関連項目