How to go from Druid examples to standalone defold version?

Questions
#1

I am new to Defold and Druid, and am struggling on how to implement the examples.

https://insality.github.io/druid/druid/?example=ui_example_basic_scroll

For example druid/example/examples/basic/scroll/scroll.lua at develop · Insality/druid · GitHub and the corresponding druid/example/examples/basic/scroll/scroll.gui at develop · Insality/druid · GitHub If I wanted to implement this example standalone in my project, is there an example of what my *.gui_script would look like?

example scroll.lua

local component = require("druid.component")

---@class scroll: druid.base_component
---@field root node
---@field scroll druid.scroll
---@field druid druid_instance
local M = component.create("scroll")

---@param template string
---@param nodes table<hash, node>
function M:init(template, nodes)
	self.druid = self:get_druid(template, nodes)

	self.scroll = self.druid:new_scroll("scroll_view", "scroll_content")

	self.button_tutorial = self.druid:new_button("button_tutorial/root")
	self.button_stencil = self.druid:new_button("button_stencil/root")
end


return M
#2

Each Druid example is a “Custom Component”, so “View Code” button shows exactly the code of this component.

For case, when you want to use this example in the gui_script directly, you should use Druid instance that was created from druid.new(self) method.

--- Corresponding gui_script for the example
local druid = require("druid.druid")

function init(self)
	self.druid = druid.new(self)

	-- All next lines from the example

	-- "scroll_view" and "scroll_content" are nodes in the gui
	self.scroll = self.druid:new_scroll("scroll_view", "scroll_content")

	-- button_tutorial is a template with the root node in the gui
	self.button_tutorial = self.druid:new_button("button_tutorial/root")

	-- button_stencil is a template with the root node in the gui
	self.button_stencil = self.druid:new_button("button_stencil/root")
end

function final(self)
	self.druid:final()
end

function update(self, dt)
	self.druid:update(dt)
end

function on_input(self, action_id, action)
	return self.druid:on_input(action_id, action)
end

function on_message(self, message_id, message, sender)
	self.druid:on_message(message_id, message, sender)
end

return M
2 Likes