From e93717a92b7c05c4de746d06aedfd63b97f2a824 Mon Sep 17 00:00:00 2001 From: Takanu Kyriako Date: Thu, 21 Mar 2024 18:17:15 +0000 Subject: [PATCH 1/2] Improved Flexible Tabs - Increased padding for the content container to be more legible and visible. - Added padding between the buttons to prevent misclicks and improve visual clarity. --- addons/flexible_layout/flexible_tab.gd | 2 ++ addons/flexible_layout/flexible_tab.tscn | 15 +++++++++++++-- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/addons/flexible_layout/flexible_tab.gd b/addons/flexible_layout/flexible_tab.gd index 8a386326b..7df2f1875 100644 --- a/addons/flexible_layout/flexible_tab.gd +++ b/addons/flexible_layout/flexible_tab.gd @@ -18,7 +18,9 @@ func get_flex_layout(): func _draw(): var is_current : bool = (get_index() == get_parent().get_parent().current) draw_style_box(get_theme_stylebox("tab_selected" if is_current else "tab_unselected", "TabBar"), Rect2(Vector2(), size)) + $Container/ButtonSeparator.visible = is_current $Container/Undock.visible = is_current and get_flex_layout().main_control.allow_undock + $Container/UndockSeparator.visible = is_current $Container/Close.visible = is_current func _on_undock_pressed(): diff --git a/addons/flexible_layout/flexible_tab.tscn b/addons/flexible_layout/flexible_tab.tscn index d10273486..80adc7cdb 100644 --- a/addons/flexible_layout/flexible_tab.tscn +++ b/addons/flexible_layout/flexible_tab.tscn @@ -12,8 +12,10 @@ offset_bottom = 26.0 size_flags_horizontal = 0 size_flags_vertical = 0 mouse_filter = 0 -theme_override_constants/margin_left = 3 -theme_override_constants/margin_right = 3 +theme_override_constants/margin_left = 10 +theme_override_constants/margin_top = 5 +theme_override_constants/margin_right = 10 +theme_override_constants/margin_bottom = 5 script = ExtResource("1") [node name="Container" type="HBoxContainer" parent="."] @@ -28,6 +30,11 @@ layout_mode = 2 size_flags_horizontal = 0 size_flags_vertical = 0 +[node name="ButtonSeparator" type="Control" parent="Container"] +visible = false +custom_minimum_size = Vector2(2, 0) +layout_mode = 2 + [node name="Undock" type="TextureButton" parent="Container"] visible = false layout_mode = 2 @@ -35,6 +42,10 @@ size_flags_horizontal = 4 size_flags_vertical = 4 texture_normal = ExtResource("2_nx0qp") +[node name="UndockSeparator" type="Control" parent="Container"] +visible = false +layout_mode = 2 + [node name="Close" type="TextureButton" parent="Container"] visible = false layout_mode = 2 From a1f0dc9dd3a433410b64f24d8abce23bc45b7636 Mon Sep 17 00:00:00 2001 From: Takanu Kyriako Date: Wed, 17 Jul 2024 08:33:56 +0100 Subject: [PATCH 2/2] Improved Flexible Tabs (Attempt 2) - Replaced the Undock icon with an SVG variant. The triangle is filled as it looks fuzzy at a small resolution. - Changed the themes so MM_FlexibleTab inherits the TabBar theming. This is to ensure proper padding on both - Used a theme override to create separation instead. --- README.md | 2 +- addons/flexible_layout/flexible_tab.gd | 14 ++------- addons/flexible_layout/flexible_tab.tscn | 23 ++------------ addons/flexible_layout/undock.png | Bin 4518 -> 0 bytes addons/flexible_layout/undock.svg | 22 ++++++++++++++ addons/flexible_layout/undock.svg.import | 37 +++++++++++++++++++++++ material_maker/theme/birch.tres | 3 +- material_maker/theme/dark.tres | 3 +- material_maker/theme/default.tres | 1 + material_maker/theme/green.tres | 3 +- material_maker/theme/light.tres | 3 +- material_maker/theme/mangosteen.tres | 3 +- 12 files changed, 77 insertions(+), 37 deletions(-) delete mode 100644 addons/flexible_layout/undock.png create mode 100644 addons/flexible_layout/undock.svg create mode 100644 addons/flexible_layout/undock.svg.import diff --git a/README.md b/README.md index 1a15643d7..54f502712 100644 --- a/README.md +++ b/README.md @@ -27,7 +27,7 @@ choco install material-maker.portable Can't wait for next release? Automated builds from master branch are available (use at your own risk): - Build Passing + Build Passing ## Documentation diff --git a/addons/flexible_layout/flexible_tab.gd b/addons/flexible_layout/flexible_tab.gd index 7196b2373..c046a4fc7 100644 --- a/addons/flexible_layout/flexible_tab.gd +++ b/addons/flexible_layout/flexible_tab.gd @@ -1,9 +1,11 @@ extends Container +# Represents a single tab within a MM_FlexibleLayout. +# Use Theme Overrides or Theme Files to style it. var flex_panel : Control -var updating : bool = false +var updating : bool = false func _ready(): $Container/Close.texture_normal = get_theme_icon("close", "TabBar") @@ -22,15 +24,6 @@ func get_flex_layout(): var flex_tab = get_parent().get_parent().get_flex_tab() return flex_tab.flexible_layout -<<<<<<< HEAD -func _draw(): - var is_current : bool = (get_index() == get_parent().get_parent().current) - draw_style_box(get_theme_stylebox("tab_selected" if is_current else "tab_unselected", "TabBar"), Rect2(Vector2(), size)) - $Container/ButtonSeparator.visible = is_current - $Container/Undock.visible = is_current and get_flex_layout().main_control.allow_undock - $Container/UndockSeparator.visible = is_current - $Container/Close.visible = is_current -======= func update(): if not updating: updating = true @@ -39,7 +32,6 @@ func update(): $Container/Undock.visible = is_current and get_flex_layout().main_control.allow_undock $Container/Close.visible = is_current updating = false ->>>>>>> upstream/master func _on_undock_pressed(): get_flex_layout().undock(flex_panel) diff --git a/addons/flexible_layout/flexible_tab.tscn b/addons/flexible_layout/flexible_tab.tscn index e421662ab..d4d83575d 100644 --- a/addons/flexible_layout/flexible_tab.tscn +++ b/addons/flexible_layout/flexible_tab.tscn @@ -1,7 +1,7 @@ [gd_scene load_steps=4 format=3 uid="uid://e06xegp2tp3f"] [ext_resource type="Script" path="res://addons/flexible_layout/flexible_tab.gd" id="1"] -[ext_resource type="Texture2D" uid="uid://xuy6dfh1rsne" path="res://addons/flexible_layout/undock.png" id="2_nx0qp"] +[ext_resource type="Texture2D" uid="uid://ixxv8s23pc3e" path="res://addons/flexible_layout/undock.svg" id="2_22txf"] [sub_resource type="PlaceholderTexture2D" id="PlaceholderTexture2D_bok24"] size = Vector2(16, 16) @@ -10,17 +10,8 @@ size = Vector2(16, 16) offset_right = 41.0 offset_bottom = 26.0 size_flags_horizontal = 0 -<<<<<<< HEAD -size_flags_vertical = 0 -mouse_filter = 0 -theme_override_constants/margin_left = 10 -theme_override_constants/margin_top = 5 -theme_override_constants/margin_right = 10 -theme_override_constants/margin_bottom = 5 -======= size_flags_vertical = 8 theme_type_variation = &"MM_FlexibleTab" ->>>>>>> upstream/master script = ExtResource("1") [node name="Container" type="HBoxContainer" parent="."] @@ -29,27 +20,19 @@ layout_mode = 2 size_flags_horizontal = 0 size_flags_vertical = 0 mouse_filter = 2 +theme_override_constants/separation = 6 [node name="Label" type="Label" parent="Container"] layout_mode = 2 size_flags_horizontal = 0 size_flags_vertical = 0 -[node name="ButtonSeparator" type="Control" parent="Container"] -visible = false -custom_minimum_size = Vector2(2, 0) -layout_mode = 2 - [node name="Undock" type="TextureButton" parent="Container"] visible = false layout_mode = 2 size_flags_horizontal = 4 size_flags_vertical = 4 -texture_normal = ExtResource("2_nx0qp") - -[node name="UndockSeparator" type="Control" parent="Container"] -visible = false -layout_mode = 2 +texture_normal = ExtResource("2_22txf") [node name="Close" type="TextureButton" parent="Container"] visible = false diff --git a/addons/flexible_layout/undock.png b/addons/flexible_layout/undock.png deleted file mode 100644 index 835c8115b0c9fc5db18a6ed4fc30fe0ff9915683..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 4518 zcmeHKYj6|S6<)`HjmPFuJAu%oS=OF{A*+38C9O7=v5^c`h>T(zV^b2kk1KhDq?NU6 zOMZ~Jb$Qqj3`{#fN)ief(m+U{VWwk49OAg71X`LQlY|y<(>hQS9;Qs(013S-`8mx@ z$J6r9nvr(zd3^Vr@0@c-x6xg&FePb55`rKp&U{B9d`{87i4)-OWByHt?2Jvg^;v-C>I+R46-+T-5CUANN5ZNhpUS8sirI{E1A)lI&( z#O{5mcb-gBzo|>Tx%TbF8Tpf@%`xnu8@nE;e15(7`+wYCeXRGn>SuedeYVD&@WRz+ zfArp08&h^RG2@fpoN);`_vV(8DRf=Wi|dx8?AtZ-c1Gz3?Y5T}tgs?wfA|Ty{qG18 z*C5;NZl~QokPu8`$EwY?{EnPQI#(36V86gTQz|}izx?GcY-3AP-dpZ-NpEo5mfs%l zN_IA_-`%w=ctbqY)Ajj*{SEuk#OLdO+sbCP<~QD3l!Oae?6nhZwasne`ZEWp(>;yx zF9m+NU7CM#TFIU>bKjf(vvspE`ZpVjt7ax#?5%7@R$LddKD_srSH&EBS#o0j`xTyT z=3cJ%)Lwt^!mNkN@=6;2*f{H{R zCkn2NOU#a6T63cPPvboEoQn4L<*8FXn_xKj#7l=0mS00U7O(N0Jeam8^XE^#d*|U* zMRC(x$KPIh?83P_>?$O5_T!IIg2BWMTQh4gsRWz2Jgl2^#4_D||&<_DuHmqFJf*e7F!(l_%Xi!34g0fnz1W6M#jYA7u ztqy2>1P`d`Iz$Y^0aP(02Q^sRLJHmP(_oy+na=AE%B3A0* zIUP1k-=C8dQI@#qD@9rbtH;XVM$!Ush8B#tz_Sw0kc?FTG;8KXFbv8WP&Gav0v!s1 z8)S%M=4rE0vQW55kSLr1Rx>UbB>^s3L1H~7k_7xPh{Yipb|vo{9+eIyK`4`C7L1fp z#2JZa;16ShP^5%gX_JRB@;pr$r6`mnatoA@pNHj?{k#_t!GJfa&q-A)@u8^|Gv z+sA7j=m2Lx4oFH^9a0s`eo&-CT8-8rqY@BOVK3^a6lpM;qZ++1 z983pN%j=yA0itr44QCGlUQZV=1V7 z6^L;Rv0^H*oDX;bJU{vyc0ewFM>AL{n&m~%BR#TLP zL3CB|Xkk7Ca=nm8$Q5kRC|Bt0{!(R*v=5g9y$+BvoT70^8O3rm%P|y2-2e1=qiCUd z)`A;>)q*pkiNtv;FykU?;yt9v!vfkeGTi?;y@8GxNH2@f55$3DW)c5U?wG-_6BN=C zlfjc29`wZEN#D;GEXDo&^tajl+yX_%HW?MaV|0ztH7W*1WjxkhV|0y*fl(Qcb=Uum zuB4&6A_%}gcwu-GY}t~!0p21f2#XdvqW4MUYkS)Z@NHr+zf6T!PyPDY5qCm)O@hJ% z&FRWZxRg9K?ePgSk8Ll3qL9;(Tg-lVbu%^TT{JoVYE$2l^!V%I< + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/addons/flexible_layout/undock.svg.import b/addons/flexible_layout/undock.svg.import new file mode 100644 index 000000000..df927d73e --- /dev/null +++ b/addons/flexible_layout/undock.svg.import @@ -0,0 +1,37 @@ +[remap] + +importer="texture" +type="CompressedTexture2D" +uid="uid://ixxv8s23pc3e" +path="res://.godot/imported/undock.svg-0e462ba8ce32a7b4dbda8774c1ab8185.ctex" +metadata={ +"vram_texture": false +} + +[deps] + +source_file="res://addons/flexible_layout/undock.svg" +dest_files=["res://.godot/imported/undock.svg-0e462ba8ce32a7b4dbda8774c1ab8185.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 diff --git a/material_maker/theme/birch.tres b/material_maker/theme/birch.tres index b256ebd76..e751db65e 100644 --- a/material_maker/theme/birch.tres +++ b/material_maker/theme/birch.tres @@ -1,6 +1,6 @@ [gd_resource type="Theme" load_steps=124 format=3 uid="uid://bnw8qp6oanlqw"] -[ext_resource type="FontFile" path="res://material_maker/theme/font.tres" id="1_jd14k"] +[ext_resource type="FontFile" uid="uid://bbh5pjbblx75w" path="res://material_maker/theme/font.tres" id="1_jd14k"] [ext_resource type="Texture2D" uid="uid://dns037k5om74b" path="res://material_maker/theme/dark/checkbox_checked.png" id="2_47wpj"] [ext_resource type="Texture2D" uid="uid://d0jps0u7dybnk" path="res://material_maker/theme/dark/checkbox_radio_checked.png" id="3_umeqq"] [ext_resource type="Texture2D" uid="uid://dgy8i2xtjcbox" path="res://material_maker/theme/dark/checkbox_radio_unchecked.png" id="4_pmwt5"] @@ -850,6 +850,7 @@ LineEdit/styles/normal = SubResource("StyleBoxFlat_a28yg") LineEdit/styles/read_only = SubResource("StyleBoxFlat_ynapp") LinkButton/colors/font_color = Color(0.8275, 0.8165, 0.8, 1) LinkButton/styles/focus = SubResource("StyleBoxEmpty_ntbfm") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.8275, 0.8165, 0.8, 1) MenuButton/colors/font_color_disabled = Color(1, 1, 1, 0.3) MenuButton/colors/font_color_hover = Color(0.8965, 0.8899, 0.88, 1) diff --git a/material_maker/theme/dark.tres b/material_maker/theme/dark.tres index 365b84241..25facbe0e 100644 --- a/material_maker/theme/dark.tres +++ b/material_maker/theme/dark.tres @@ -57,7 +57,7 @@ [ext_resource type="Texture2D" uid="uid://rs23woqfg04o" path="res://material_maker/theme/dark/popupmenu_visibility_xray.png" id="55"] [ext_resource type="Texture2D" uid="uid://dw0lvt1ip8ifp" path="res://material_maker/theme/dark/popupmenu_submenu.png" id="56"] [ext_resource type="Texture2D" uid="uid://c1s6ailuulpow" path="res://material_maker/theme/dark/popupmenu_checked.png" id="57"] -[ext_resource type="FontFile" path="res://material_maker/theme/font.tres" id="58"] +[ext_resource type="FontFile" uid="uid://bbh5pjbblx75w" path="res://material_maker/theme/font.tres" id="58"] [ext_resource type="FontFile" uid="uid://btybkvkb8rtol" path="res://material_maker/fonts/DroidSansFallback.ttf" id="59"] [sub_resource type="StyleBoxFlat" id="StyleBoxFlat_8ihgd"] @@ -849,6 +849,7 @@ LineEdit/styles/normal = SubResource("61") LineEdit/styles/read_only = SubResource("58") LinkButton/colors/font_color = Color(0.787255, 0.787255, 0.787255, 1) LinkButton/styles/focus = SubResource("80") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.787255, 0.787255, 0.787255, 1) MenuButton/colors/font_disabled_color = Color(1, 1, 1, 0.3) MenuButton/colors/font_hover_color = Color(0.872353, 0.872353, 0.872353, 1) diff --git a/material_maker/theme/default.tres b/material_maker/theme/default.tres index ad6f747e2..c715a0115 100644 --- a/material_maker/theme/default.tres +++ b/material_maker/theme/default.tres @@ -838,6 +838,7 @@ LineEdit/styles/normal = SubResource("StyleBoxFlat_e7upo") LineEdit/styles/read_only = SubResource("StyleBoxFlat_ba0xr") LinkButton/colors/font_color = Color(0.8, 0.8075, 0.8275, 1) LinkButton/styles/focus = SubResource("StyleBoxEmpty_5hivt") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.8, 0.8075, 0.8275, 1) MenuButton/colors/font_color_disabled = Color(1, 1, 1, 0.3) MenuButton/colors/font_color_hover = Color(0.88, 0.8845, 0.8965, 1) diff --git a/material_maker/theme/green.tres b/material_maker/theme/green.tres index 623b3c77d..39888fdc8 100644 --- a/material_maker/theme/green.tres +++ b/material_maker/theme/green.tres @@ -1,6 +1,6 @@ [gd_resource type="Theme" load_steps=124 format=3 uid="uid://madwyufrcvg3"] -[ext_resource type="FontFile" path="res://material_maker/theme/font.tres" id="1_anphx"] +[ext_resource type="FontFile" uid="uid://bbh5pjbblx75w" path="res://material_maker/theme/font.tres" id="1_anphx"] [ext_resource type="Texture2D" uid="uid://dns037k5om74b" path="res://material_maker/theme/dark/checkbox_checked.png" id="2_vx81v"] [ext_resource type="Texture2D" uid="uid://d0jps0u7dybnk" path="res://material_maker/theme/dark/checkbox_radio_checked.png" id="3_ehkys"] [ext_resource type="Texture2D" uid="uid://dgy8i2xtjcbox" path="res://material_maker/theme/dark/checkbox_radio_unchecked.png" id="4_orvtq"] @@ -850,6 +850,7 @@ LineEdit/styles/normal = SubResource("StyleBoxFlat_1beoj") LineEdit/styles/read_only = SubResource("StyleBoxFlat_sgfku") LinkButton/colors/font_color = Color(0.8055, 0.8275, 0.8, 1) LinkButton/styles/focus = SubResource("StyleBoxEmpty_2auyi") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.8055, 0.8275, 0.8, 1) MenuButton/colors/font_color_disabled = Color(1, 1, 1, 0.3) MenuButton/colors/font_color_hover = Color(0.8833, 0.8965, 0.88, 1) diff --git a/material_maker/theme/light.tres b/material_maker/theme/light.tres index 312196670..d9768fcfe 100644 --- a/material_maker/theme/light.tres +++ b/material_maker/theme/light.tres @@ -1,6 +1,6 @@ [gd_resource type="Theme" load_steps=126 format=3 uid="uid://d12pe6icsioje"] -[ext_resource type="FontFile" path="res://material_maker/theme/font.tres" id="1_ib7yq"] +[ext_resource type="FontFile" uid="uid://bbh5pjbblx75w" path="res://material_maker/theme/font.tres" id="1_ib7yq"] [ext_resource type="Texture2D" uid="uid://bg66nf03a1wj0" path="res://material_maker/theme/light/checkbox_checked.png" id="2_cx70j"] [ext_resource type="Texture2D" uid="uid://ctamubqvnfppj" path="res://material_maker/theme/light/checkbox_radio_checked.png" id="3_gmi3y"] [ext_resource type="Texture2D" uid="uid://8ulk7ii706l4" path="res://material_maker/theme/light/checkbox_radio_unchecked.png" id="4_6qsc0"] @@ -905,6 +905,7 @@ LineEdit/styles/normal = SubResource("StyleBoxFlat_4qnsg") LineEdit/styles/read_only = SubResource("StyleBoxFlat_mt288") LinkButton/colors/font_color = Color(0.212745, 0.212745, 0.212745, 1) LinkButton/styles/focus = SubResource("StyleBoxEmpty_yjk8e") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.212745, 0.212745, 0.212745, 1) MenuButton/colors/font_disabled_color = Color(0, 0, 0, 0.3) MenuButton/colors/font_hover_color = Color(0.127647, 0.127647, 0.127647, 1) diff --git a/material_maker/theme/mangosteen.tres b/material_maker/theme/mangosteen.tres index 81334ffa7..0e7e677b6 100644 --- a/material_maker/theme/mangosteen.tres +++ b/material_maker/theme/mangosteen.tres @@ -1,6 +1,6 @@ [gd_resource type="Theme" load_steps=124 format=3 uid="uid://c8isn6xerh652"] -[ext_resource type="FontFile" path="res://material_maker/theme/font.tres" id="1_xi23j"] +[ext_resource type="FontFile" uid="uid://bbh5pjbblx75w" path="res://material_maker/theme/font.tres" id="1_xi23j"] [ext_resource type="Texture2D" uid="uid://dns037k5om74b" path="res://material_maker/theme/dark/checkbox_checked.png" id="2_1tmpj"] [ext_resource type="Texture2D" uid="uid://d0jps0u7dybnk" path="res://material_maker/theme/dark/checkbox_radio_checked.png" id="3_fgb41"] [ext_resource type="Texture2D" uid="uid://dgy8i2xtjcbox" path="res://material_maker/theme/dark/checkbox_radio_unchecked.png" id="4_6dxbb"] @@ -850,6 +850,7 @@ LineEdit/styles/normal = SubResource("StyleBoxFlat_ywaco") LineEdit/styles/read_only = SubResource("StyleBoxFlat_4xl1u") LinkButton/colors/font_color = Color(0.8275, 0.8, 0.8165, 1) LinkButton/styles/focus = SubResource("StyleBoxEmpty_urbbl") +MM_FlexibleTab/base_type = &"TabBar" MenuButton/colors/font_color = Color(0.8275, 0.8, 0.8165, 1) MenuButton/colors/font_color_disabled = Color(1, 1, 1, 0.3) MenuButton/colors/font_color_hover = Color(0.8965, 0.88, 0.8899, 1)