betalars
/
frame-of-mind
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: proper layouts for own and other messages

This commit is contained in:
tiger tiger tiger 2026-03-20 21:29:35 +01:00
parent 9ce65f7004
commit 9c3984aee0
7 changed files with 183 additions and 62 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/logic-scenes/chat_view/auto_size_richt_text_container.gd
View File

@ -2,32 +2,31 @@
@tool
extends Container
@export var min_bubble_width: float = 64.0
@export var max_bubble_width: float = 512.0
@onready var label: RichTextLabel = $RichTextLabel
var text := ""
func _ready():
label.resized.connect(_on_label_resized)
label.theme_changed.connect(_on_label_resized)
label.fit_content = true
func _process(_delta: float) -> void:
if (label.text != text):
set_text(label.text)
func set_text(text: String) -> void:
label.text = text
# 1. Disable wrap, measure natural width
func set_text(new_text: String) -> void:
text = new_text
label.autowrap_mode = TextServer.AUTOWRAP_OFF
label.fit_content = true
label.custom_minimum_size.x = 0
label.custom_minimum_size.x = min_bubble_width
label.text = text # triggers layout → NOTIFICATION_RESIZED
# Force layout so get_content_width() is valid
label.queue_redraw()
await get_tree().process_frame
var natural_width := label.get_content_width()
if natural_width <= max_bubble_width:
# Short text = natural size
label.custom_minimum_size.x = 0
else:
# Long text — clamp and wrap
func _on_label_resized() -> void:
if label.get_content_width() > max_bubble_width:
label.autowrap_mode = TextServer.AUTOWRAP_WORD_SMART
label.custom_minimum_size.x = max_bubble_width
label.size.x = max_bubble_width
else:
pass # already correctly sized

0
src/logic-scenes/chat_view/avatar-dummy.png → src/logic-scenes/chat_view/avatar-other.png
View File

40
src/logic-scenes/chat_view/avatar-other.png.import Normal file
View File

@ -0,0 +1,40 @@
[remap]
importer="texture"
type="CompressedTexture2D"
uid="uid://dkqsw8nh2crhq"
path="res://.godot/imported/avatar-other.png-09f69875162e2f76b5a47c0d287cd91e.ctex"
metadata={
"vram_texture": false
}
[deps]
source_file="res://logic-scenes/chat_view/avatar-other.png"
dest_files=["res://.godot/imported/avatar-other.png-09f69875162e2f76b5a47c0d287cd91e.ctex"]
[params]
compress/mode=0
compress/high_quality=false
compress/lossy_quality=0.7
compress/uastc_level=0
compress/rdo_quality_loss=0.0
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/channel_remap/red=0
process/channel_remap/green=1
process/channel_remap/blue=2
process/channel_remap/alpha=3
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

BIN
src/logic-scenes/chat_view/avatar-self.png (Stored with Git LFS) Normal file
View File

Binary file not shown.

6
src/logic-scenes/chat_view/avatar-dummy.png.import → src/logic-scenes/chat_view/avatar-self.png.import
View File

@ -3,15 +3,15 @@
importer="texture"
type="CompressedTexture2D"
uid="uid://dekaqj10p8rqk"
path="res://.godot/imported/avatar-dummy.png-65800fc5bc4cfb43587691e9aaed86f6.ctex"
path="res://.godot/imported/avatar-self.png-01f4d75fe95c2d322095af684ab1d9a8.ctex"
metadata={
"vram_texture": false
}
[deps]
source_file="res://logic-scenes/chat_view/avatar-dummy.png"
dest_files=["res://.godot/imported/avatar-dummy.png-65800fc5bc4cfb43587691e9aaed86f6.ctex"]
source_file="res://logic-scenes/chat_view/avatar-self.png"
dest_files=["res://.godot/imported/avatar-self.png-01f4d75fe95c2d322095af684ab1d9a8.ctex"]
[params]

1
src/logic-scenes/chat_view/chat-view.gd
View File

@ -2,6 +2,7 @@ class_name ChatView extends ScrollContainer
@export var messages: Array[ChatMessage]
var v_box: VBoxContainer
func _ready() -> void:

160
src/logic-scenes/chat_view/chat-view.tscn
View File

@ -7,7 +7,7 @@
[ext_resource type="Texture2D" uid="uid://cv58eu35ra1ku" path="res://logic-scenes/chat_view/phone-dot.png" id="4_vvup7"]
[ext_resource type="Texture2D" uid="uid://bng2qbusdg7dj" path="res://logic-scenes/chat_view/phone-signal.png" id="4_xckgu"]
[ext_resource type="Script" uid="uid://be16bo6mf4kqu" path="res://logic-scenes/chat_view/chat-message.gd" id="5_xckgu"]
[ext_resource type="Texture2D" uid="uid://dekaqj10p8rqk" path="res://logic-scenes/chat_view/avatar-dummy.png" id="6_bvmqu"]
[ext_resource type="Texture2D" uid="uid://dekaqj10p8rqk" path="res://logic-scenes/chat_view/avatar-self.png" id="6_bvmqu"]
[ext_resource type="StyleBox" uid="uid://dj1fuvcy0sw7k" path="res://logic-scenes/chat_view/style-chat-bubble.tres" id="9_vvup7"]
[ext_resource type="LabelSettings" uid="uid://mh8uu4rlqmv5" path="res://logic-scenes/chat_view/label-timestamp.tres" id="9_xckgu"]
[ext_resource type="StyleBox" uid="uid://dd4xc216ul21m" path="res://logic-scenes/chat_view/style-chat-bubble-self.tres" id="11_qbcw0"]
@ -88,7 +88,26 @@ label_settings = ExtResource("2_xckgu")
horizontal_alignment = 1
vertical_alignment = 1
[node name="AppBar" type="HBoxContainer" parent="AppLayout" unique_id=981636098]
layout_mode = 2
alignment = 1
[node name="ContactName" type="Label" parent="AppLayout/AppBar" unique_id=1110888559]
layout_mode = 2
text = "Contact Name"
label_settings = ExtResource("2_xckgu")
horizontal_alignment = 1
vertical_alignment = 1
[node name="ChatName" type="Label" parent="AppLayout/AppBar" unique_id=215068956]
layout_mode = 2
text = "(Nick)"
label_settings = ExtResource("2_xckgu")
horizontal_alignment = 1
vertical_alignment = 1
[node name="ChatContainer" type="ScrollContainer" parent="AppLayout" unique_id=124411261]
unique_name_in_owner = true
layout_mode = 2
size_flags_vertical = 3
horizontal_scroll_mode = 0
@ -100,59 +119,118 @@ messages = Array[ExtResource("5_xckgu")]([SubResource("Resource_iwd5k"), SubReso
layout_mode = 2
size_flags_horizontal = 3
[node name="Message-Other" type="HBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer" unique_id=872807975]
[node name="Message-Other" type="HBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer" unique_id=1768184408]
layout_mode = 2
size_flags_horizontal = 3
alignment = 2
[node name="Avatar" type="TextureRect" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=1340018572]
[node name="Avatar" type="TextureRect" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=692150965]
layout_mode = 2
size_flags_vertical = 8
texture = ExtResource("6_bvmqu")
stretch_mode = 2
[node name="VBoxContainer" type="VBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=1464038635]
[node name="VBoxContainer" type="VBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=1815081203]
layout_mode = 2
size_flags_horizontal = 3
size_flags_horizontal = 2
size_flags_vertical = 9
[node name="MarginContainer" type="MarginContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer" unique_id=411272741]
layout_mode = 2
size_flags_horizontal = 0
theme_override_constants/margin_left = 5
theme_override_constants/margin_top = 5
theme_override_constants/margin_right = 5
theme_override_constants/margin_bottom = 5
script = ExtResource("12_qgt32")
[node name="Panel" type="Panel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer/MarginContainer" unique_id=2013893702]
[node name="Bubble" type="PanelContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer" unique_id=5067436]
custom_minimum_size = Vector2(0, 52)
layout_mode = 2
size_flags_horizontal = 8
size_flags_vertical = 3
theme_override_styles/panel = ExtResource("9_vvup7")
[node name="RichTextLabel" type="RichTextLabel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer/MarginContainer" unique_id=2013097116]
custom_minimum_size = Vector2(512, 0)
[node name="MarginContainer" type="MarginContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer/Bubble" unique_id=866335976]
layout_mode = 2
size_flags_horizontal = 0
size_flags_vertical = 4
theme_override_constants/margin_left = 4
theme_override_constants/margin_top = 4
theme_override_constants/margin_right = 4
theme_override_constants/margin_bottom = 4
script = ExtResource("12_qgt32")
[node name="RichTextLabel" type="RichTextLabel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer/Bubble/MarginContainer" unique_id=1973907637]
custom_minimum_size = Vector2(64, 64)
layout_mode = 2
size_flags_horizontal = 3
theme_type_variation = &"message-other"
bbcode_enabled = true
text = "Dies ist eine Telegram-Message.
FR, FR...
Ich schreibe mal etwas länger, ob zu sehen, ob der Bums irgendwann umbricht.
lalle back, lalle back, lalle-lalle-back ...
text = "Dies ist eine T-legram-Message.
"
fit_content = true
scroll_active = false
autowrap_mode = 0
vertical_alignment = 1
justification_flags = 3
justification_flags = 99
metadata/_custom_type_script = "uid://dlbwvie007wfx"
[node name="TimeStamp" type="Label" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer" unique_id=1782456747]
[node name="TimeStamp" type="Label" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other/VBoxContainer" unique_id=801686504]
layout_mode = 2
text = "8:12 PM"
label_settings = ExtResource("9_xckgu")
horizontal_alignment = 2
[node name="Spacer" type="Control" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=1910496415]
[node name="Spacer" type="Control" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other" unique_id=1232564412]
custom_minimum_size = Vector2(160, 0)
layout_mode = 2
[node name="Message-Other2" type="HBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer" unique_id=230318593]
layout_mode = 2
size_flags_horizontal = 3
alignment = 2
[node name="Avatar" type="TextureRect" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2" unique_id=1854076166]
layout_mode = 2
size_flags_vertical = 8
texture = ExtResource("6_bvmqu")
stretch_mode = 2
[node name="VBoxContainer" type="VBoxContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2" unique_id=216841372]
layout_mode = 2
size_flags_horizontal = 2
size_flags_vertical = 9
[node name="Bubble" type="PanelContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2/VBoxContainer" unique_id=1704898778]
custom_minimum_size = Vector2(0, 52)
layout_mode = 2
size_flags_horizontal = 8
size_flags_vertical = 3
theme_override_styles/panel = ExtResource("9_vvup7")
[node name="MarginContainer" type="MarginContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2/VBoxContainer/Bubble" unique_id=343453369]
layout_mode = 2
size_flags_horizontal = 0
size_flags_vertical = 4
theme_override_constants/margin_left = 4
theme_override_constants/margin_top = 4
theme_override_constants/margin_right = 4
theme_override_constants/margin_bottom = 4
script = ExtResource("12_qgt32")
[node name="RichTextLabel" type="RichTextLabel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2/VBoxContainer/Bubble/MarginContainer" unique_id=598363127]
custom_minimum_size = Vector2(64, 64)
layout_mode = 2
size_flags_horizontal = 3
theme_type_variation = &"message-other"
bbcode_enabled = true
text = "😝"
fit_content = true
scroll_active = false
autowrap_mode = 0
vertical_alignment = 1
justification_flags = 99
metadata/_custom_type_script = "uid://dlbwvie007wfx"
[node name="TimeStamp" type="Label" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2/VBoxContainer" unique_id=257313481]
layout_mode = 2
text = "8:12 PM"
label_settings = ExtResource("9_xckgu")
horizontal_alignment = 2
[node name="Spacer" type="Control" parent="AppLayout/ChatContainer/VBoxContainer/Message-Other2" unique_id=97162962]
custom_minimum_size = Vector2(160, 0)
layout_mode = 2
@ -179,25 +257,25 @@ theme_override_styles/panel = ExtResource("11_qbcw0")
[node name="MarginContainer" type="MarginContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Self/VBoxContainer/Bubble" unique_id=766411309]
layout_mode = 2
size_flags_horizontal = 0
size_flags_vertical = 4
theme_override_constants/margin_left = 5
theme_override_constants/margin_top = 5
theme_override_constants/margin_right = 5
theme_override_constants/margin_bottom = 5
theme_override_constants/margin_left = 4
theme_override_constants/margin_top = 4
theme_override_constants/margin_right = 4
theme_override_constants/margin_bottom = 4
script = ExtResource("12_qgt32")
min_bubble_width = null
[node name="RichTextLabel" type="RichTextLabel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Self/VBoxContainer/Bubble/MarginContainer" unique_id=1320329524]
custom_minimum_size = Vector2(512, 64)
layout_mode = 2
size_flags_horizontal = 3
theme_type_variation = &"message-other"
bbcode_enabled = true
text = "Dies ist eine Telegram-Message.
Ich schreibe mal etwas länger, ob zu sehen,
ob der Bums irgendwann umbricht.
text = "Dies ist auch eine T-legram-Message. Ich schreibe mal etwas länger, ob zu sehen, ob der Text irgendwann umbricht.
"
fit_content = true
scroll_active = false
autowrap_mode = 0
vertical_alignment = 1
justification_flags = 99
metadata/_custom_type_script = "uid://dlbwvie007wfx"
@ -237,21 +315,21 @@ theme_override_styles/panel = ExtResource("11_qbcw0")
[node name="MarginContainer" type="MarginContainer" parent="AppLayout/ChatContainer/VBoxContainer/Message-Self-Short/VBoxContainer/Bubble" unique_id=2077306006]
layout_mode = 2
size_flags_horizontal = 4
theme_override_constants/margin_left = 5
theme_override_constants/margin_top = 5
theme_override_constants/margin_right = 5
theme_override_constants/margin_bottom = 5
size_flags_horizontal = 0
theme_override_constants/margin_left = 4
theme_override_constants/margin_top = 4
theme_override_constants/margin_right = 4
theme_override_constants/margin_bottom = 4
script = ExtResource("12_qgt32")
min_bubble_width = null
[node name="RichTextLabel" type="RichTextLabel" parent="AppLayout/ChatContainer/VBoxContainer/Message-Self-Short/VBoxContainer/Bubble/MarginContainer" unique_id=425927748]
custom_minimum_size = Vector2(0, 64)
layout_mode = 2
size_flags_horizontal = 3
theme_type_variation = &"message-other"
bbcode_enabled = true
text = "Kasse Dich Furz!
Mein li
32"
text = "Fasse dich kurz!"
fit_content = true
scroll_active = false
autowrap_mode = 0