Better scroll and slider API

druid/base/scroll.lua

@@ -380,6 +380,29 @@ function M.scroll_to(self, point, is_instant)
 	self.on_scroll_to:trigger(self:get_context(), point, is_instant)
 end
 
+--- Start scroll to target scroll percent
+-- @function scroll:scroll_to_percent
+-- @tparam point vector3 target percent
+-- @tparam[opt] bool is_instant instant scroll flag
+-- @usage scroll:scroll_to_percent(vmath.vector3(0.5, 0, 0))
+function M.scroll_to_percent(self, percent, is_instant)
+	local border = self.border
+
+	local size_x = math.abs(border.z - border.x)
+	if size_x == 0 then
+		size_x = 1
+	end
+	local size_y = math.abs(border.w - border.y)
+	if size_y == 0 then
+		size_y = 1
+	end
+
+	local pos = vmath.vector3(
+		-size_x * percent.x + border.x,
+		-size_y * percent.y + border.y,
+		0)
+	M.scroll_to(self, pos, is_instant)
+end
 
 --- Scroll to item in scroll by point index
 -- @function scroll:init
@@ -450,4 +473,29 @@ function M.set_border(self, content_size)
 end
 
 
+--- Return current scroll progress
+-- @function scroll:get_scroll_percent
+-- @tparam table self Component instance
+-- @return vmath.vector3 Scroll progress
+function M.get_scroll_percent(self)
+	local border = self.border
+	local size_x = math.abs(border.z - border.x)
+	if size_x == 0 then
+		size_x = 1
+	end
+
+	local size_y = math.abs(border.w - border.y)
+	if size_y == 0 then
+		size_y = 1
+	end
+	local pos = self.pos
+
+	return vmath.vector3(
+		(border.x - pos.x) / size_x,
+		(border.y - pos.y) / size_y,
+		0
+	)
+end
+
+
 return M

druid/base/slider.lua

@@ -79,13 +79,15 @@ function M.on_input(self, action_id, action)
 end
 
 
-function M.set(self, value)
+function M.set(self, value, is_silent)
 	value = helper.clamp(value, 0, 1)
 
 	gui.set_position(self.node, self.start_pos + self.dist * value)
 	self.value = value
+	if not is_silent then
 		on_change_value(self)
 	end
+end
 
 
 return M

example/kenney/gui/main/main.gui

@@ -6153,7 +6153,7 @@ nodes {
   }
   type: TYPE_TEXT
   blend_mode: BLEND_MODE_ALPHA
-  text: "Tap me!"
+  text: "<<<"
   font: "game"
   id: "button_left/text"
   xanchor: XANCHOR_NONE
@@ -6179,6 +6179,7 @@ nodes {
   alpha: 1.0
   outline_alpha: 0.0
   shadow_alpha: 0.78
+  overridden_fields: 8
   template_node_child: true
   text_leading: 1.0
   text_tracking: 0.0
@@ -6311,7 +6312,7 @@ nodes {
   }
   type: TYPE_TEXT
   blend_mode: BLEND_MODE_ALPHA
-  text: "Tap me!"
+  text: ">>>"
   font: "game"
   id: "button_right/text"
   xanchor: XANCHOR_NONE
@@ -6337,6 +6338,7 @@ nodes {
   alpha: 1.0
   outline_alpha: 0.0
   shadow_alpha: 0.78
+  overridden_fields: 8
   template_node_child: true
   text_leading: 1.0
   text_tracking: 0.0

example/kenney/page/scroll.lua

@@ -17,17 +17,16 @@ local function init_grid(self)
 	end
 
 	gui.set_enabled(prefab, false)
+
 	local grid_scroll = self.druid:new_scroll("grid_content", "scroll_with_grid_size")
-	local size = grid:get_size()
 	grid_scroll:set_border(grid:get_size())
 
 	local scroll_slider = self.druid:new_slider("grid_scroll_pin", vmath.vector3(300, 0, 0), function(_, value)
-		grid_scroll:scroll_to(vmath.vector3(-size.x * value, size.y, size.z), true)
+		grid_scroll:scroll_to_percent(vmath.vector3(value, 0, 0), true)
 	end)
 
 	grid_scroll.on_scroll:subscribe(function(_, point)
-		local value = -point.x / size.x
+		scroll_slider:set(grid_scroll:get_scroll_percent().x, true)
-		scroll_slider:set(value)
 	end)
 end