Update the sample to allow general closed paths

Author: JimBobSquarePants

samples/WebGPUExternalSurfaceDemo/MainForm.cs

@@ -26,6 +26,7 @@ internal sealed class MainForm : Form
     private readonly ManualTextFlowScene manualTextFlowScene;
     private readonly RichTextEditorScene richTextScene;
     private readonly Label tigerStatusLabel;
+    private readonly ComboBox manualTextShapeComboBox;
     private readonly CheckBox boldButton;
     private readonly CheckBox italicButton;
     private readonly CheckBox underlineButton;
@@ -94,6 +95,50 @@ public MainForm()
         };
         this.tigerControl.Controls.Add(this.tigerStatusLabel);
 
+        // The manual flow scene is intentionally controlled from ordinary WinForms
+        // widgets. Changing this dropdown swaps the obstacle path, while the scene
+        // keeps using the same retained TextBlock and per-line layout enumerator.
+        this.manualTextShapeComboBox = new ComboBox
+        {
+            DropDownStyle = ComboBoxStyle.DropDownList,
+            Width = 140,
+            Margin = new Padding(0, 0, 8, 0),
+        };
+
+        foreach (ManualTextFlowObstacleShape shape in Enum.GetValues<ManualTextFlowObstacleShape>())
+        {
+            this.manualTextShapeComboBox.Items.Add(shape);
+        }
+
+        this.manualTextShapeComboBox.SelectedItem = this.manualTextFlowScene.ObstacleShape;
+        this.manualTextShapeComboBox.SelectedIndexChanged += (_, _) =>
+        {
+            if (this.manualTextShapeComboBox.SelectedItem is ManualTextFlowObstacleShape shape)
+            {
+                this.manualTextFlowScene.ObstacleShape = shape;
+                this.manualTextFlowControl.Invalidate();
+            }
+        };
+
+        FlowLayoutPanel manualTextFlowToolbar = new()
+        {
+            Dock = DockStyle.Top,
+            AutoSize = true,
+            Padding = new Padding(8),
+        };
+
+        manualTextFlowToolbar.Controls.Add(new Label
+        {
+            AutoSize = true,
+            Margin = new Padding(0, 5, 8, 0),
+            Text = "Shape",
+        });
+        manualTextFlowToolbar.Controls.Add(this.manualTextShapeComboBox);
+
+        Panel manualTextFlowPanel = new() { Dock = DockStyle.Fill };
+        manualTextFlowPanel.Controls.Add(this.manualTextFlowControl);
+        manualTextFlowPanel.Controls.Add(manualTextFlowToolbar);
+
         this.boldButton = this.CreateEditorToggleButton("B", () => this.richTextScene.ToggleBold());
         this.italicButton = this.CreateEditorToggleButton("I", () => this.richTextScene.ToggleItalic());
         this.underlineButton = this.CreateEditorToggleButton("U", () => this.richTextScene.ToggleUnderline());
@@ -249,7 +294,7 @@ public MainForm()
         tabs.TabPages.Add(applyTab);
 
         TabPage manualTextFlowTab = new(this.manualTextFlowScene.DisplayName);
-        manualTextFlowTab.Controls.Add(this.manualTextFlowControl);
+        manualTextFlowTab.Controls.Add(manualTextFlowPanel);
         tabs.TabPages.Add(manualTextFlowTab);
 
         TabPage richTextTab = new(this.richTextScene.DisplayName);

samples/WebGPUExternalSurfaceDemo/README.md

@@ -28,7 +28,7 @@ When the sample starts you should see a WinForms window with five tabs:
 - `Clock`: a continuously-rendered animated clock scene
 - `Tiger`: an interactive SVG tiger viewer with pan and zoom
 - `Apply`: a reactive external-surface readback scene using `DrawingCanvas.Apply(...)`; move the mouse to move the edge-detect and blur regions, and use the mouse wheel to resize them
-- `Manual Text Flow`: prepared text is laid out one line at a time around a circular obstacle that follows mouse movement
+- `Manual Text Flow`: prepared text is laid out one line at a time around a selectable path obstacle that follows mouse movement
 - `Rich Text Editor`: a small editor surface that exercises text selection, caret movement, hit testing, font changes, and inline styling
 
 ## Why This Sample Matters
@@ -116,7 +116,7 @@ The scenes are deliberately ordinary canvas code:
 - [ClockScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/ClockScene.cs): animated vector clock
 - [TigerViewerScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/TigerViewerScene.cs): pan and zoom SVG tiger viewer
 - [ApplyReadbackScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/ApplyReadbackScene.cs): `Apply(...)` scene that reads the external surface back into CPU processing
-- [ManualTextFlowScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/ManualTextFlowScene.cs): interactive manual text flow using prepared line layout enumeration
+- [ManualTextFlowScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/ManualTextFlowScene.cs): interactive manual text flow using prepared line layout enumeration and a selectable closed-path obstacle
 - [RichTextEditorScene.cs](d:/GitHub/SixLabors/ImageSharp.Drawing/samples/WebGPUExternalSurfaceDemo/Scenes/RichTextEditorScene.cs): custom rich text editor built from Fonts hit testing, caret, selection, and run APIs
 
 Each scene receives: