feature: add Sample3

README.md

@@ -25,15 +25,16 @@ Display Web-Content in Godot. You can use html/css/JavaScript as like godot nati
 - Supports transparent background, helpful for use as a UI system.
 - Input
     - Mouse Input
+    - Keyboard Input
+    - Mouse Scroll Input
+- Remote UI Inspector, aka, DevTools.
 
 ## Samples
 - [Sample 1 - Load Html And Bind CSharp Callback](samples/Sample%201%20-%20Load%20Html%20And%20Bind%20CSharp%20Callback)
 - [Sample 2 - Grid-based Inventory System](samples/Sample%202%20-%20Inventory%20System)
-
+- [Sample 3 - 3D](samples/Sample%202%20-%203D)
 
 ## In Progress
-- [ ] Keyboard Input
-- [ ] Remote UI Inspector, aka, DevTools.
 - [ ] More Samples about how to use ultralight-godot as UI system.
 - [ ] Tutorial...
 

samples/Sample3 - 3D/.gitignore

@@ -0,0 +1,2 @@
+src/addons
+src/default

samples/Sample3 - 3D/README.md

@@ -0,0 +1,13 @@
+# Introduction
+Simple Example show how to integrate ultralight-view in 3D world.
+
+## Usage
+1. Download prebuilt ultralight-view extension from github release and unzip it to src/bin folder
+2. Run with godot mono >= 4.3.
+
+## Features
+- [x] Rendering interactive html in godot 3D scene.
+- [x] Loading font set by godot theme.
+
+## Screenshot
+https://github.com/user-attachments/assets/b193f148-a446-4772-89aa-aed81d1bd360

samples/Sample3 - 3D/src/3D.csproj

@@ -0,0 +1,9 @@
+<Project Sdk="Godot.NET.Sdk/4.3.0">
+  <PropertyGroup>
+    <TargetFramework>net6.0</TargetFramework>
+    <TargetFramework Condition=" '$(GodotTargetPlatform)' == 'android' ">net7.0</TargetFramework>
+    <TargetFramework Condition=" '$(GodotTargetPlatform)' == 'ios' ">net8.0</TargetFramework>
+    <EnableDynamicLoading>true</EnableDynamicLoading>
+    <RootNamespace>D</RootNamespace>
+  </PropertyGroup>
+</Project>

samples/Sample3 - 3D/src/3D.sln

@@ -0,0 +1,19 @@
+Microsoft Visual Studio Solution File, Format Version 12.00
+# Visual Studio 2012
+Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "3D", "3D.csproj", "{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}"
+EndProject
+Global
+	GlobalSection(SolutionConfigurationPlatforms) = preSolution
+	Debug|Any CPU = Debug|Any CPU
+	ExportDebug|Any CPU = ExportDebug|Any CPU
+	ExportRelease|Any CPU = ExportRelease|Any CPU
+	EndGlobalSection
+	GlobalSection(ProjectConfigurationPlatforms) = postSolution
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.Debug|Any CPU.Build.0 = Debug|Any CPU
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.ExportDebug|Any CPU.ActiveCfg = ExportDebug|Any CPU
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.ExportDebug|Any CPU.Build.0 = ExportDebug|Any CPU
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.ExportRelease|Any CPU.ActiveCfg = ExportRelease|Any CPU
+		{BB82BEFB-19A3-4AF3-A7A6-D7FDC232303F}.ExportRelease|Any CPU.Build.0 = ExportRelease|Any CPU
+	EndGlobalSection
+EndGlobal

samples/Sample3 - 3D/src/Gui.cs

@@ -0,0 +1,91 @@
+using Godot;
+using System;
+
+public partial class Gui : Node3D
+{
+	private SubViewport _nodeViewPort;
+	private MeshInstance3D _nodeQuad;
+	private Area3D _nodeArea;
+
+	private bool _isMouseInside = false;
+	private Vector2 _lastEventPos2d = Vector2.Zero;
+	private float _lastEventTime = 0;
+
+	// Called when the node enters the scene tree for the first time.
+	public override void _Ready()
+	{
+		_nodeViewPort = GetNode<SubViewport>("SubViewport");
+		_nodeQuad = GetNode<MeshInstance3D>("Quad");
+		_nodeArea = GetNode<Area3D>("Quad/Area3D");
+
+		_nodeArea.MouseEntered += OnMouseEnteredArea;
+		_nodeArea.MouseExited += OnMouseExitedArea;
+		_nodeArea.InputEvent += OnMouseInputEvent;
+
+		Engine.Singleton.GetSingleton("UltralightSingleton").Call("start_remove_inspector_server", "127.0.0.1", 19999);
+	}
+
+	// Called every frame. 'delta' is the elapsed time since the previous frame.
+	public override void _Process(double delta)
+	{
+	}
+
+	void OnMouseEnteredArea()
+	{
+		_isMouseInside = true;
+	}
+
+	void OnMouseExitedArea()
+	{
+		_isMouseInside = false;
+	}
+
+	void OnMouseInputEvent(Node camera, InputEvent @event, Vector3 eventPosition, Vector3 normal, long shapeIdx)
+	{
+		if (@event is not InputEventMouse){ return; }
+
+		var mouseEvent = (InputEventMouse)@event;
+
+		var quadMeshSize = (_nodeQuad.Mesh as QuadMesh).Size;
+		var now = Time.GetTicksMsec() / 1000.0f;
+		var eventPos3d = _nodeQuad.GlobalTransform.AffineInverse() * eventPosition;
+		var eventPos2d = _lastEventPos2d;
+
+		if (_isMouseInside)
+		{
+			// Convert the relative event position from 3D to 2D.
+			eventPos2d = new Vector2(eventPos3d.X, -eventPos3d.Y);
+
+			// Right now the event position's range is the following: (-quad_size/2) -> (quad_size/2)
+			// We need to convert it into the following range: -0.5 -> 0.5
+			eventPos2d.X /= quadMeshSize.X;
+			eventPos2d.Y /= quadMeshSize.Y;
+
+			// Then we need to convert it into the following range: 0 -> 1
+			eventPos2d.X += 0.5f;
+			eventPos2d.Y += 0.5f;
+
+			// Finally, we convert the position to the following range: 0 -> viewport.size
+			eventPos2d.X *= _nodeViewPort.Size.X;
+			eventPos2d.Y *= _nodeViewPort.Size.Y;
+		}
+		mouseEvent.Position = eventPos2d;
+		mouseEvent.GlobalPosition = eventPos2d;
+		if (@event is InputEventMouseMotion mouseMotion)
+		{
+			if (_lastEventPos2d == Vector2.Zero)
+			{
+				mouseMotion.Relative = Vector2.Zero;
+			}
+			else
+			{
+				mouseMotion.Relative = eventPos2d - _lastEventPos2d;
+				mouseMotion.Velocity = mouseMotion.Relative / (now - _lastEventTime);
+			}
+		}
+
+		_lastEventPos2d = eventPos2d;
+		_lastEventTime = now;
+		_nodeViewPort.PushInput(mouseEvent);
+	}
+}

samples/Sample3 - 3D/src/gui.tscn

@@ -0,0 +1,38 @@
+[gd_scene load_steps=6 format=3 uid="uid://bw5aubs32yp77"]
+
+[ext_resource type="Script" path="res://Gui.cs" id="1_mi1ab"]
+
+[sub_resource type="QuadMesh" id="QuadMesh_ya2h8"]
+
+[sub_resource type="ViewportTexture" id="ViewportTexture_v60d8"]
+viewport_path = NodePath("SubViewport")
+
+[sub_resource type="StandardMaterial3D" id="StandardMaterial3D_g2p8h"]
+resource_local_to_scene = true
+albedo_texture = SubResource("ViewportTexture_v60d8")
+
+[sub_resource type="BoxShape3D" id="BoxShape3D_ep1mo"]
+size = Vector3(1, 1, 0.001)
+
+[node name="Gui" type="Node3D"]
+script = ExtResource("1_mi1ab")
+
+[node name="SubViewport" type="SubViewport" parent="."]
+gui_snap_controls_to_pixels = false
+gui_embed_subwindows = true
+size = Vector2i(1024, 768)
+
+[node name="UltralightView" type="UltralightView" parent="SubViewport"]
+htmlUrl = "https://blog.shabbywu.cn/"
+transparent = true
+offset_right = 1024.0
+offset_bottom = 768.0
+
+[node name="Quad" type="MeshInstance3D" parent="."]
+mesh = SubResource("QuadMesh_ya2h8")
+surface_material_override/0 = SubResource("StandardMaterial3D_g2p8h")
+
+[node name="Area3D" type="Area3D" parent="Quad"]
+
+[node name="CollisionShape3D" type="CollisionShape3D" parent="Quad/Area3D"]
+shape = SubResource("BoxShape3D_ep1mo")

samples/Sample3 - 3D/src/icon.svg.import

@@ -0,0 +1,37 @@
+[remap]
+
+importer="texture"
+type="CompressedTexture2D"
+uid="uid://bxau70a3cjjth"
+path="res://.godot/imported/icon.svg-218a8f2b3041327d8a5756f3a245f83b.ctex"
+metadata={
+"vram_texture": false
+}
+
+[deps]
+
+source_file="res://icon.svg"
+dest_files=["res://.godot/imported/icon.svg-218a8f2b3041327d8a5756f3a245f83b.ctex"]
+
+[params]
+
+compress/mode=0
+compress/high_quality=false
+compress/lossy_quality=0.7
+compress/hdr_compression=1
+compress/normal_map=0
+compress/channel_pack=0
+mipmaps/generate=false
+mipmaps/limit=-1
+roughness/mode=0
+roughness/src_normal=""
+process/fix_alpha_border=true
+process/premult_alpha=false
+process/normal_map_invert_y=false
+process/hdr_as_srgb=false
+process/hdr_clamp_exposure=false
+process/size_limit=0
+detect_3d/compress_to=1
+svg/scale=1.0
+editor/scale_with_editor_scale=false
+editor/convert_colors_with_editor_theme=false

samples/Sample3 - 3D/src/main.tscn

@@ -0,0 +1,74 @@
+[gd_scene load_steps=11 format=3 uid="uid://cor1t5knfpfju"]
+
+[ext_resource type="PackedScene" uid="uid://bw5aubs32yp77" path="res://gui.tscn" id="2_dshhb"]
+
+[sub_resource type="StandardMaterial3D" id="StandardMaterial3D_pvumr"]
+
+[sub_resource type="SphereMesh" id="SphereMesh_dbwit"]
+material = SubResource("StandardMaterial3D_pvumr")
+radius = 0.2
+height = 0.4
+
+[sub_resource type="SphereShape3D" id="SphereShape3D_18fdx"]
+radius = 0.2
+
+[sub_resource type="StandardMaterial3D" id="StandardMaterial3D_2irot"]
+
+[sub_resource type="CylinderMesh" id="CylinderMesh_sdyqy"]
+material = SubResource("StandardMaterial3D_2irot")
+
+[sub_resource type="StandardMaterial3D" id="StandardMaterial3D_k3mks"]
+
+[sub_resource type="BoxMesh" id="BoxMesh_jtj6r"]
+material = SubResource("StandardMaterial3D_k3mks")
+
+[sub_resource type="WorldBoundaryShape3D" id="WorldBoundaryShape3D_co8jp"]
+plane = Plane(0, 0.1, 0, 0)
+
+[sub_resource type="PlaneMesh" id="PlaneMesh_ua68f"]
+size = Vector2(100, 100)
+
+[node name="Main" type="Node3D"]
+
+[node name="sphere" type="RigidBody3D" parent="."]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, -0.266775, 3, 2.35)
+gravity_scale = 0.1
+
+[node name="mesh" type="MeshInstance3D" parent="sphere"]
+mesh = SubResource("SphereMesh_dbwit")
+skeleton = NodePath("../../Cylinder")
+
+[node name="CollisionShape3D" type="CollisionShape3D" parent="sphere"]
+shape = SubResource("SphereShape3D_18fdx")
+
+[node name="Cylinder" type="MeshInstance3D" parent="."]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 2.34, 2, 0.894)
+gi_mode = 2
+mesh = SubResource("CylinderMesh_sdyqy")
+skeleton = NodePath("../Box")
+
+[node name="Box" type="MeshInstance3D" parent="."]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0.930468, 2.28386, 0.123719)
+gi_mode = 2
+mesh = SubResource("BoxMesh_jtj6r")
+skeleton = NodePath("")
+
+[node name="Ground" type="StaticBody3D" parent="."]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 1, 0)
+
+[node name="CollisionShape3D" type="CollisionShape3D" parent="Ground"]
+shape = SubResource("WorldBoundaryShape3D_co8jp")
+
+[node name="MeshInstance3D" type="MeshInstance3D" parent="Ground"]
+mesh = SubResource("PlaneMesh_ua68f")
+
+[node name="DirectionalLight3D" type="DirectionalLight3D" parent="."]
+transform = Transform3D(0.713532, -0.129502, 0.68855, -0.0153812, 0.979637, 0.200189, -0.700453, -0.153432, 0.69701, 5.63547, 4.48991, 4.41801)
+shadow_enabled = true
+
+[node name="Camera3D" type="Camera3D" parent="."]
+transform = Transform3D(1, 0, 0, 0, 1, 0, 0, 0, 1, 0, 1.98187, 3.14041)
+fov = 100.0
+
+[node name="Gui" parent="." instance=ExtResource("2_dshhb")]
+transform = Transform3D(1.2675, 0, 0.288876, 0, 1.3, 0, -0.288876, 0, 1.2675, -0.595942, 1.8888, 2.36012)

samples/Sample3 - 3D/src/project.godot

@@ -0,0 +1,24 @@
+; Engine configuration file.
+; It's best edited using the editor UI and not directly,
+; since the parameters that go here are not all obvious.
+;
+; Format:
+;   [section] ; section goes between []
+;   param=value ; assign values to parameters
+
+config_version=5
+
+[application]
+
+config/name="3D"
+run/main_scene="res://main.tscn"
+config/features=PackedStringArray("4.3", "C#", "Forward Plus")
+config/icon="res://icon.svg"
+
+[dotnet]
+
+project/assembly_name="3D"
+
+[gui]
+
+theme/custom_font="res://龙珠体ZHS-Regular.ttf"

samples/Sample3 - 3D/src/龙珠体ZHS-Regular.ttf.import

@@ -0,0 +1,34 @@
+[remap]
+
+importer="font_data_dynamic"
+type="FontFile"
+uid="uid://churiwxrktjev"
+path="res://.godot/imported/龙珠体ZHS-Regular.ttf-f18e135354b7afc0899c3939b6b32c50.fontdata"
+
+[deps]
+
+source_file="res://龙珠体ZHS-Regular.ttf"
+dest_files=["res://.godot/imported/龙珠体ZHS-Regular.ttf-f18e135354b7afc0899c3939b6b32c50.fontdata"]
+
+[params]
+
+Rendering=null
+antialiasing=1
+generate_mipmaps=false
+disable_embedded_bitmaps=true
+multichannel_signed_distance_field=false
+msdf_pixel_range=8
+msdf_size=48
+allow_system_fallback=true
+force_autohinter=false
+hinting=1
+subpixel_positioning=1
+oversampling=0.0
+Fallbacks=null
+fallbacks=[]
+Compress=null
+compress=true
+preload=[]
+language_support={}
+script_support={}
+opentype_features={}