More UI progress...

Refactored preview stuff and updated new UI
This commit is contained in:
Rodolphe Suescun 2018-08-07 09:31:41 +02:00
parent 30c711920f
commit 0e1f891910
13 changed files with 209 additions and 40 deletions

4
.gitignore vendored
View File

@ -16,3 +16,7 @@ addons/procedural_material/models/models.dae.import
/examples/*.import /examples/*.import
examples/input_image.png.import examples/input_image.png.import
examples/input_image.png.import examples/input_image.png.import
*.import
*.import
*.import
*.import

View File

@ -8,13 +8,23 @@ func get_drag_data(position):
var selected_item = get_selected() var selected_item = get_selected()
if selected_item != null: if selected_item != null:
var data = selected_item.get_metadata(0) var data = selected_item.get_metadata(0)
var preview
if data.has("icon") && data.has("library"):
var filename = data.library.left(data.library.rfind("."))+"/"+data.icon+".png"
preview = TextureRect.new()
preview.texture = ImageTexture.new()
preview.texture.load(filename)
else:
preview = Label.new()
preview.text = data.tree_item
set_drag_preview(preview)
return data return data
return null return null
func _ready(): func _ready():
var root = create_item() var root = create_item()
add_library("res://addons/procedural_material/material_library.json") add_library("res://addons/procedural_material/library/base.json")
add_library("res://addons/procedural_material/library/user.json")
func add_library(filename): func add_library(filename):
var root = get_root() var root = get_root()
@ -24,6 +34,7 @@ func add_library(filename):
var lib = parse_json(file.get_as_text()) var lib = parse_json(file.get_as_text())
file.close() file.close()
for m in lib.lib: for m in lib.lib:
m.library = filename
add_item(m, m.tree_item, root) add_item(m, m.tree_item, root)
func add_item(item, item_name, item_parent): func add_item(item, item_name, item_parent):

View File

@ -6,6 +6,7 @@
}, },
{ {
"tree_item":"Generators/Pattern", "tree_item":"Generators/Pattern",
"icon":"pattern",
"type":"pattern", "type":"pattern",
"mix":0, "mix":0,
"x_scale":4, "x_scale":4,
@ -16,6 +17,7 @@
{ {
"tree_item":"Generators/Bricks", "tree_item":"Generators/Bricks",
"type":"bricks", "type":"bricks",
"icon":"bricks",
"bevel":0.1, "bevel":0.1,
"columns":3, "columns":3,
"mortar":0.1, "mortar":0.1,
@ -25,6 +27,7 @@
{ {
"tree_item":"Generators/Perlin Noise", "tree_item":"Generators/Perlin Noise",
"type":"perlin", "type":"perlin",
"icon":"perlin",
"iterations":3, "iterations":3,
"persistence":0.5, "persistence":0.5,
"scale_x":4, "scale_x":4,
@ -33,6 +36,7 @@
{ {
"tree_item":"Generators/Voronoi Noise", "tree_item":"Generators/Voronoi Noise",
"type":"voronoi", "type":"voronoi",
"icon":"voronoi",
"intensity":1, "intensity":1,
"scale_x":4, "scale_x":4,
"scale_y":4 "scale_y":4
@ -40,8 +44,7 @@
{ {
"tree_item":"Filters/Colorize", "tree_item":"Filters/Colorize",
"type":"colorize", "type":"colorize",
"gradient":[{"b":0,"g":0,"pos":0,"r":0},{"b":1,"g":1,"pos":1,"r":1}], "gradient":[{"b":0,"g":0,"pos":0,"r":0},{"b":1,"g":1,"pos":1,"r":1}]
"name":"colorize_0"
}, },
{ {
"tree_item":"Filters/Blend", "tree_item":"Filters/Blend",

Binary file not shown.

After

Width:  |  Height:  |  Size: 455 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 646 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 3.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.4 KiB

View File

@ -14,6 +14,7 @@ const MENU = [
{ menu="File" }, { menu="File" },
{ menu="File", command="close_material", description="Close material" }, { menu="File", command="close_material", description="Close material" },
{ menu="File", command="exit", description="Exit" }, { menu="File", command="exit", description="Exit" },
{ menu="Tools", command="save_icons", description="Save icons for selected nodes" },
{ menu="Help", command="about", description="About" } { menu="Help", command="about", description="About" }
] ]
@ -37,10 +38,14 @@ func create_menu(menu, menu_name):
menu.add_separator() menu.add_separator()
return menu return menu
func new_material(): func new_pane():
var graph_edit = preload("res://addons/procedural_material/graph_edit.tscn").instance() var graph_edit = preload("res://addons/procedural_material/graph_edit.tscn").instance()
$VBoxContainer/HBoxContainer/Projects.add_child(graph_edit) $VBoxContainer/HBoxContainer/Projects.add_child(graph_edit)
$VBoxContainer/HBoxContainer/Projects.current_tab = graph_edit.get_index() $VBoxContainer/HBoxContainer/Projects.current_tab = graph_edit.get_index()
return graph_edit
func new_material():
var graph_edit = new_pane()
graph_edit.update_tab_title() graph_edit.update_tab_title()
func load_material(): func load_material():
@ -54,9 +59,7 @@ func load_material():
dialog.popup_centered() dialog.popup_centered()
func do_load_material(filename): func do_load_material(filename):
var graph_edit = preload("res://addons/procedural_material/graph_edit.tscn").instance() var graph_edit = new_pane()
$VBoxContainer/HBoxContainer/Projects.add_child(graph_edit)
$VBoxContainer/HBoxContainer/Projects.current_tab = graph_edit.get_index()
graph_edit.do_load_file(filename) graph_edit.do_load_file(filename)
func save_material(): func save_material():
@ -68,6 +71,12 @@ func save_material_as():
func close_material(): func close_material():
$VBoxContainer/HBoxContainer/Projects.get_current_tab_control().queue_free() $VBoxContainer/HBoxContainer/Projects.get_current_tab_control().queue_free()
func save_icons():
var graphedit = $VBoxContainer/HBoxContainer/Projects.get_current_tab_control()
for n in graphedit.get_children():
if n is GraphNode and n.selected:
graphedit.export_texture(n, "res://addons/procedural_material/library/icons/"+n.name+".png", 64)
func exit(): func exit():
queue_free() queue_free()
@ -76,11 +85,28 @@ func _on_PopupMenu_id_pressed(id):
if MENU[id].has("command"): if MENU[id].has("command"):
call(MENU[id].command) call(MENU[id].command)
# Preview
func update_preview(): func update_preview():
var material_node = $VBoxContainer/HBoxContainer/Projects.get_current_tab_control().get_node("Material") var material_node = $VBoxContainer/HBoxContainer/Projects.get_current_tab_control().get_node("Material")
if material_node != null: if material_node != null:
material_node.update_materials($VBoxContainer/HBoxContainer/VBoxContainer/Preview.get_materials()) material_node.update_materials($VBoxContainer/HBoxContainer/VBoxContainer/Preview.get_materials())
update_preview_2d()
func update_preview_2d(node = null):
var graphedit = $VBoxContainer/HBoxContainer/Projects.get_current_tab_control()
var preview = $VBoxContainer/HBoxContainer/VBoxContainer/Preview
if node == null:
for n in graphedit.get_children():
if n is GraphNode and n.selected:
node = n
break
if node != null:
graphedit.setup_material(preview.get_2d_material(), node.get_textures(), node.generate_shader())
func _on_Projects_tab_changed(tab): func _on_Projects_tab_changed(tab):
$VBoxContainer/HBoxContainer/Projects.get_current_tab_control().connect("graph_changed", self, "update_preview") if tab != current_tab:
current_tab = tab $VBoxContainer/HBoxContainer/Projects.get_current_tab_control().connect("graph_changed", self, "update_preview")
$VBoxContainer/HBoxContainer/Projects.get_current_tab_control().connect("node_selected", self, "update_preview_2d")
current_tab = tab
update_preview()

View File

@ -4,7 +4,7 @@
[ext_resource path="res://addons/procedural_material/library.gd" type="Script" id=2] [ext_resource path="res://addons/procedural_material/library.gd" type="Script" id=2]
[ext_resource path="res://addons/procedural_material/preview.tscn" type="PackedScene" id=3] [ext_resource path="res://addons/procedural_material/preview.tscn" type="PackedScene" id=3]
[node name="MainWindow" type="Panel" index="0"] [node name="MainWindow" type="Panel"]
anchor_left = 0.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
@ -74,14 +74,64 @@ flat = true
align = 1 align = 1
items = [ ] items = [ ]
[node name="Help" type="MenuButton" parent="VBoxContainer/Menu" index="1"] [node name="Edit" type="MenuButton" parent="VBoxContainer/Menu" index="1"]
anchor_left = 0.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
anchor_right = 0.0 anchor_right = 0.0
anchor_bottom = 0.0 anchor_bottom = 0.0
margin_left = 39.0 margin_left = 39.0
margin_right = 81.0 margin_right = 75.0
margin_bottom = 20.0
rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false
mouse_filter = 0
mouse_default_cursor_shape = 0
size_flags_horizontal = 1
size_flags_vertical = 1
toggle_mode = false
action_mode = 0
enabled_focus_mode = 0
shortcut = null
group = null
text = "Edit"
flat = true
align = 1
items = [ ]
[node name="Tools" type="MenuButton" parent="VBoxContainer/Menu" index="2"]
anchor_left = 0.0
anchor_top = 0.0
anchor_right = 0.0
anchor_bottom = 0.0
margin_left = 79.0
margin_right = 125.0
margin_bottom = 20.0
rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false
mouse_filter = 0
mouse_default_cursor_shape = 0
size_flags_horizontal = 1
size_flags_vertical = 1
toggle_mode = false
action_mode = 0
enabled_focus_mode = 0
shortcut = null
group = null
text = "Tools"
flat = true
align = 1
items = [ ]
[node name="Help" type="MenuButton" parent="VBoxContainer/Menu" index="3"]
anchor_left = 0.0
anchor_top = 0.0
anchor_right = 0.0
anchor_bottom = 0.0
margin_left = 129.0
margin_right = 171.0
margin_bottom = 20.0 margin_bottom = 20.0
rect_pivot_offset = Vector2( 0, 0 ) rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false rect_clip_content = false

View File

@ -107,12 +107,12 @@ func generate_shader():
if $GraphEdit/Material != null: if $GraphEdit/Material != null:
$GraphEdit/Material.update_materials($Preview/Preview.get_materials()) $GraphEdit/Material.update_materials($Preview/Preview.get_materials())
if selected_node != null: if selected_node != null:
$GraphEdit.setup_material(texture_preview_material, selected_node.get_textures(), selected_node.generate_shader()) $GraphEdit.setup_material($Preview/Preview.get_2d_material(), selected_node.get_textures(), selected_node.generate_shader())
func _on_GraphEdit_node_selected(node): func _on_GraphEdit_node_selected(node):
var selected_node = get_selected_node() var selected_node = get_selected_node()
if selected_node != null: if selected_node != null:
$GraphEdit.setup_material(texture_preview_material, selected_node.get_textures(), selected_node.generate_shader()) $GraphEdit.setup_material($Preview/Preview.get_2d_material(), selected_node.get_textures(), selected_node.generate_shader())
func _on_SelectedPreview_gui_input(ev): func _on_SelectedPreview_gui_input(ev):
if ev is InputEventMouseButton && ev.button_index == 1 && ev.doubleclick: if ev is InputEventMouseButton && ev.button_index == 1 && ev.doubleclick:

View File

@ -4,7 +4,7 @@
[ext_resource path="res://addons/procedural_material/graph_edit.tscn" type="PackedScene" id=2] [ext_resource path="res://addons/procedural_material/graph_edit.tscn" type="PackedScene" id=2]
[ext_resource path="res://addons/procedural_material/preview.tscn" type="PackedScene" id=3] [ext_resource path="res://addons/procedural_material/preview.tscn" type="PackedScene" id=3]
[sub_resource type="Shader" id=1] [sub_resource type="Shader" id=5]
code = "shader_type canvas_item; code = "shader_type canvas_item;
@ -14,10 +14,10 @@ void fragment() {
" "
_sections_unfolded = [ "Resource" ] _sections_unfolded = [ "Resource" ]
[sub_resource type="ShaderMaterial" id=2] [sub_resource type="ShaderMaterial" id=6]
render_priority = 0 render_priority = 0
shader = SubResource( 1 ) shader = SubResource( 5 )
[sub_resource type="Animation" id=3] [sub_resource type="Animation" id=3]
@ -103,7 +103,7 @@ tracks/2/keys = {
"values": [ 3 ] "values": [ 3 ]
} }
[node name="ProceduralMaterialEditor" type="MarginContainer"] [node name="ProceduralMaterialEditor" type="MarginContainer" index="0"]
anchor_left = 0.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
@ -148,14 +148,15 @@ _sections_unfolded = [ "Mouse" ]
[node name="SelectedPreview" type="ColorRect" parent="Preview/Preview" index="4"] [node name="SelectedPreview" type="ColorRect" parent="Preview/Preview" index="4"]
material = SubResource( 2 ) visible = false
material = SubResource( 6 )
anchor_left = 0.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
anchor_right = 0.0 anchor_right = 0.0
anchor_bottom = 0.0 anchor_bottom = 0.0
margin_left = 2.0 margin_left = 2.0
margin_top = 252.0 margin_top = 2.0
margin_right = 98.0 margin_right = 348.0
margin_bottom = 348.0 margin_bottom = 348.0
rect_min_size = Vector2( 96, 96 ) rect_min_size = Vector2( 96, 96 )
rect_pivot_offset = Vector2( 0, 0 ) rect_pivot_offset = Vector2( 0, 0 )

View File

@ -1,6 +1,8 @@
tool tool
extends ViewportContainer extends ViewportContainer
var preview_maximized = false
const ENVIRONMENTS = [ const ENVIRONMENTS = [
"experiment", "lobby", "night", "park", "schelde" "experiment", "lobby", "night", "park", "schelde"
] ]
@ -10,19 +12,36 @@ func _ready():
$MaterialPreview/Objects/Cube.set_surface_material(0, m) $MaterialPreview/Objects/Cube.set_surface_material(0, m)
$MaterialPreview/Objects/Cylinder.set_surface_material(0, m) $MaterialPreview/Objects/Cylinder.set_surface_material(0, m)
$ObjectRotate.play("rotate") $ObjectRotate.play("rotate")
_on_Environment_item_selected($Environment.selected) $Preview2D.material = $Preview2D.material.duplicate(true)
_on_Environment_item_selected($Config/Environment.selected)
_on_Preview_resized()
func _on_Environment_item_selected(id): func _on_Environment_item_selected(id):
$MaterialPreview/WorldEnvironment.environment.background_sky.panorama = load("res://addons/procedural_material/panoramas/"+ENVIRONMENTS[id]+".hdr") $MaterialPreview/WorldEnvironment.environment.background_sky.panorama = load("res://addons/procedural_material/panoramas/"+ENVIRONMENTS[id]+".hdr")
func _on_Model_item_selected(id): func _on_Model_item_selected(id):
var model = $Model.get_item_text(id) var model = $Config/Model.get_item_text(id)
for c in $MaterialPreview/Objects.get_children(): for c in $MaterialPreview/Objects.get_children():
c.visible = (c.get_name() == model) c.visible = (c.get_name() == model)
func get_materials(): func get_materials():
return [ $MaterialPreview/Objects/Cube.get_surface_material(0) ] return [ $MaterialPreview/Objects/Cube.get_surface_material(0) ]
func get_2d_material():
return $Preview2D.material
func _on_Preview_resized():
if preview_maximized:
var size = min(rect_size.x, rect_size.y)
$Preview2D.rect_position = 0.5*Vector2(rect_size.x-size, rect_size.y-size)
$Preview2D.rect_size = Vector2(size, size)
else:
$Preview2D.rect_position = Vector2(0, rect_size.y-64)
$Preview2D.rect_size = Vector2(64, 64)
func _on_Preview2D_gui_input(ev):
if ev is InputEventMouseButton && ev.button_index == 1 && ev.doubleclick:
preview_maximized = !preview_maximized
_on_Preview_resized()
func _on_Preview_item_rect_changed():
$MaterialPreview.size = rect_size

View File

@ -1,4 +1,4 @@
[gd_scene load_steps=9 format=2] [gd_scene load_steps=11 format=2]
[ext_resource path="res://addons/procedural_material/preview.gd" type="Script" id=1] [ext_resource path="res://addons/procedural_material/preview.gd" type="Script" id=1]
[ext_resource path="res://addons/procedural_material/panoramas/park.hdr" type="Texture" id=2] [ext_resource path="res://addons/procedural_material/panoramas/park.hdr" type="Texture" id=2]
@ -195,16 +195,27 @@ adjustment_contrast = 1.0
adjustment_saturation = 1.0 adjustment_saturation = 1.0
_sections_unfolded = [ "Background" ] _sections_unfolded = [ "Background" ]
[sub_resource type="Shader" id=7]
code = "shader_type canvas_item;
"
[sub_resource type="ShaderMaterial" id=8]
render_priority = 0
shader = SubResource( 7 )
[node name="Preview" type="ViewportContainer"] [node name="Preview" type="ViewportContainer"]
anchor_left = 1.0 anchor_left = 1.0
anchor_top = 0.0 anchor_top = 0.0
anchor_right = 1.0 anchor_right = 1.0
anchor_bottom = 0.0 anchor_bottom = 0.0
margin_left = -364.0 margin_left = -398.0
margin_top = 3.0 margin_top = 3.0
margin_right = -14.0 margin_right = -3.0
margin_bottom = 353.0 margin_bottom = 373.0
rect_min_size = Vector2( 200, 200 )
rect_pivot_offset = Vector2( 0, 0 ) rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false rect_clip_content = false
mouse_filter = 2 mouse_filter = 2
@ -230,7 +241,7 @@ _sections_unfolded = [ "Playback Options" ]
[node name="MaterialPreview" type="Viewport" parent="." index="1"] [node name="MaterialPreview" type="Viewport" parent="." index="1"]
arvr = false arvr = false
size = Vector2( 350, 350 ) size = Vector2( 395, 370 )
own_world = true own_world = true
world = null world = null
transparent_bg = false transparent_bg = false
@ -256,7 +267,7 @@ _sections_unfolded = [ "GUI", "Render Target" ]
[node name="Objects" type="Spatial" parent="MaterialPreview" index="0"] [node name="Objects" type="Spatial" parent="MaterialPreview" index="0"]
transform = Transform( 0.965183, 0, -0.26156, 0, 1, 0, 0.26156, 0, 0.965183, 0, 0, 0 ) transform = Transform( -0.376032, 0, -0.926603, 0, 1, 0, 0.926603, 0, -0.376032, 0, 0, 0 )
_sections_unfolded = [ "Transform" ] _sections_unfolded = [ "Transform" ]
[node name="Cube" type="MeshInstance" parent="MaterialPreview/Objects" index="0"] [node name="Cube" type="MeshInstance" parent="MaterialPreview/Objects" index="0"]
@ -336,14 +347,31 @@ _sections_unfolded = [ "Transform" ]
environment = SubResource( 6 ) environment = SubResource( 6 )
[node name="Model" type="OptionButton" parent="." index="2"] [node name="Config" type="HBoxContainer" parent="." index="2"]
editor/display_folded = true
anchor_left = 0.0
anchor_top = 0.0
anchor_right = 1.0
anchor_bottom = 0.0
margin_bottom = 20.0
rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false
mouse_filter = 1
mouse_default_cursor_shape = 0
size_flags_horizontal = 1
size_flags_vertical = 1
alignment = 0
[node name="Model" type="OptionButton" parent="Config" index="0"]
anchor_left = 0.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
anchor_right = 0.0 anchor_right = 0.0
anchor_bottom = 0.0 anchor_bottom = 0.0
margin_right = 110.0 margin_right = 100.0
margin_bottom = 20.0 margin_bottom = 20.0
rect_min_size = Vector2( 100, 0 )
rect_pivot_offset = Vector2( 0, 0 ) rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false rect_clip_content = false
focus_mode = 2 focus_mode = 2
@ -361,15 +389,18 @@ flat = false
align = 0 align = 0
items = [ "Cube", null, false, 0, null, "Cylinder", null, false, 1, null ] items = [ "Cube", null, false, 0, null, "Cylinder", null, false, 1, null ]
selected = 0 selected = 0
_sections_unfolded = [ "Margin", "Rect" ]
[node name="Environment" type="OptionButton" parent="." index="3"] [node name="Environment" type="OptionButton" parent="Config" index="1"]
anchor_left = 1.0 anchor_left = 0.0
anchor_top = 0.0 anchor_top = 0.0
anchor_right = 1.0 anchor_right = 0.0
anchor_bottom = 0.0 anchor_bottom = 0.0
margin_left = -110.0 margin_left = 104.0
margin_right = 204.0
margin_bottom = 20.0 margin_bottom = 20.0
rect_min_size = Vector2( 100, 0 )
rect_pivot_offset = Vector2( 0, 0 ) rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false rect_clip_content = false
focus_mode = 2 focus_mode = 2
@ -387,9 +418,33 @@ flat = false
align = 0 align = 0
items = [ "Experiment", null, false, 0, null, "Lobby", null, false, 1, null, "Night", null, false, 2, null, "Park", null, false, 3, null, "Schelde", null, false, 4, null ] items = [ "Experiment", null, false, 0, null, "Lobby", null, false, 1, null, "Night", null, false, 2, null, "Park", null, false, 3, null, "Schelde", null, false, 4, null ]
selected = 3 selected = 3
_sections_unfolded = [ "Rect" ]
[connection signal="item_selected" from="Model" to="." method="_on_Model_item_selected"] [node name="Preview2D" type="ColorRect" parent="." index="3"]
[connection signal="item_selected" from="Environment" to="." method="_on_Environment_item_selected"] material = SubResource( 8 )
anchor_left = 0.0
anchor_top = 1.0
anchor_right = 0.0
anchor_bottom = 1.0
margin_top = -64.0
margin_right = 64.0
rect_min_size = Vector2( 64, 64 )
rect_pivot_offset = Vector2( 0, 0 )
rect_clip_content = false
mouse_filter = 1
mouse_default_cursor_shape = 0
size_flags_horizontal = 0
size_flags_vertical = 8
color = Color( 1, 1, 1, 1 )
_sections_unfolded = [ "Anchor", "Material", "Mouse", "Rect", "Size Flags" ]
[connection signal="resized" from="." to="." method="_on_Preview_resized"]
[connection signal="item_selected" from="Config/Model" to="." method="_on_Model_item_selected"]
[connection signal="item_selected" from="Config/Environment" to="." method="_on_Environment_item_selected"]
[connection signal="gui_input" from="Preview2D" to="." method="_on_Preview2D_gui_input"]