#78 Add text different adjust types

druid/base/text.lua

@@ -33,7 +33,7 @@
 -- @tfield vector3 text_area
 
 --- Current text size adjust settings
--- @tfield bool is_no_adjust
+-- @tfield number adjust_type
 
 --- Current text color
 -- @tfield vector3 color
@@ -42,6 +42,7 @@
 
 local Event = require("druid.event")
 local const = require("druid.const")
+local utf8 = require("druid.system.utf8")
 local component = require("druid.component")
 
 local Text = component.create("text", { component.ON_LAYOUT_CHANGE })
@@ -57,10 +58,16 @@ local function update_text_size(self)
 end
 
 
---- Setup scale x, but can only be smaller, than start text scale
-local function update_text_area_size(self)
+--- Reset initial scale for text
+local function reset_default_scale(self)
 	gui.set_scale(self.node, self.start_scale)
 	gui.set_size(self.node, self.start_size)
+end
+
+
+--- Setup scale x, but can only be smaller, than start text scale
+local function update_text_area_size(self)
+	reset_default_scale(self)
 
 	local max_width = self.text_area.x
 	local max_height = self.text_area.y
@@ -74,6 +81,10 @@ local function update_text_area_size(self)
 	local scale_modifier_height = max_height / metrics.height
 	scale_modifier = math.min(scale_modifier, scale_modifier_height)
 
+	if self._minimal_scale then
+		scale_modifier = math.max(scale_modifier, self._minimal_scale)
+	end
+
 	local new_scale = vmath.vector3(scale_modifier, scale_modifier, cur_scale.z)
 	gui.set_scale(self.node, new_scale)
 	self.scale = new_scale
@@ -84,6 +95,33 @@ local function update_text_area_size(self)
 end
 
 
+local function update_text_with_trim(self, trim_postfix)
+	local max_width = self.text_area.x
+	local text_width = self:get_text_width()
+
+	if text_width > max_width then
+		local text_length = utf8.len(self.last_value)
+		local new_text = self.last_value
+		while text_width > max_width do
+			text_length = text_length - 1
+			new_text = utf8.sub(self.last_value, 1, text_length)
+			text_width = self:get_text_width(new_text .. trim_postfix)
+		end
+
+		gui.set_text(self.node, new_text .. trim_postfix)
+	end
+end
+
+
+local function update_text_with_anchor_shift(self)
+	if self:get_text_width() >= self.text_area.x then
+		self:set_pivot(const.REVERSE_PIVOTS[self.start_pivot])
+	else
+		self:set_pivot(self.start_pivot)
+	end
+end
+
+
 -- calculate space width with font
 local function get_space_width(self, font)
 	if not self._space_width[font] then
@@ -96,15 +134,56 @@ local function get_space_width(self, font)
 end
 
 
+local function update_adjust(self)
+	if not self.adjust_type or self.adjust_type == const.TEXT_ADJUST.NO_ADJUST then
+		reset_default_scale(self)
+		return
+	end
+
+	if self.adjust_type == const.TEXT_ADJUST.DOWNSCALE then
+		update_text_area_size(self)
+	end
+
+	if self.adjust_type == const.TEXT_ADJUST.TRIM then
+		update_text_with_trim(self, self.style.TRIM_POSTFIX)
+	end
+
+	if self.adjust_type == const.TEXT_ADJUST.DOWNSCALE_LIMITED then
+		update_text_area_size(self)
+	end
+
+	if self.adjust_type == const.TEXT_ADJUST.SCROLL then
+		update_text_with_anchor_shift(self)
+	end
+
+	if self.adjust_type == const.TEXT_ADJUST.SCALE_THEN_SCROLL then
+		update_text_area_size(self)
+		update_text_with_anchor_shift(self)
+	end
+end
+
+
+--- Component style params.
+-- You can override this component styles params in druid styles table
+-- or create your own style
+-- @table style
+-- @tfield[opt=...] string TRIM_POSTFIX The postfix for TRIM adjust type
+function Text.on_style_change(self, style)
+	self.style = {}
+	self.style.TRIM_POSTFIX = style.TRIM_POSTFIX or "..."
+end
+
+
 --- Component init function
 -- @tparam Text self
 -- @tparam node node Gui text node
 -- @tparam[opt] string value Initial text. Default value is node text from GUI scene.
--- @tparam[opt] bool no_adjust If true, text will be not auto-adjust size
-function Text.init(self, node, value, no_adjust)
+-- @tparam[opt=0] int adjust_type Adjust type for text. By default is DOWNSCALE. Look const.TEXT_ADJUST for reference
+function Text.init(self, node, value, adjust_type)
 	self.node = self:get_node(node)
 	self.pos = gui.get_position(self.node)
 
+	self.start_pivot = gui.get_pivot(self.node)
 	self.start_scale = gui.get_scale(self.node)
 	self.scale = gui.get_scale(self.node)
 
@@ -113,7 +192,7 @@ function Text.init(self, node, value, no_adjust)
 	self.text_area.x = self.text_area.x * self.start_scale.x
 	self.text_area.y = self.text_area.y * self.start_scale.y
 
-	self.is_no_adjust = no_adjust
+	self.adjust_type = adjust_type or const.TEXT_ADJUST.DOWNSCALE
 	self.color = gui.get_color(self.node)
 
 	self.on_set_text = Event()
@@ -156,49 +235,59 @@ end
 --- Set text to text field
 -- @tparam Text self
 -- @tparam string set_to Text for node
+-- @treturn Text Current text instance
 function Text.set_to(self, set_to)
 	self.last_value = set_to
 	gui.set_text(self.node, set_to)
 
 	self.on_set_text:trigger(self:get_context(), set_to)
 
-	if not self.is_no_adjust then
-		update_text_area_size(self)
-	end
+	update_adjust(self)
+
+	return self
 end
 
 
 --- Set color
 -- @tparam Text self
 -- @tparam vector4 color Color for node
+-- @treturn Text Current text instance
 function Text.set_color(self, color)
 	self.color = color
 	gui.set_color(self.node, color)
+
+	return self
 end
 
 
 --- Set alpha
 -- @tparam Text self
 -- @tparam number alpha Alpha for node
+-- @treturn Text Current text instance
 function Text.set_alpha(self, alpha)
 	self.color.w = alpha
 	gui.set_color(self.node, self.color)
+
+	return self
 end
 
 
 --- Set scale
 -- @tparam Text self
 -- @tparam vector3 scale Scale for node
+-- @treturn Text Current text instance
 function Text.set_scale(self, scale)
 	self.last_scale = scale
 	gui.set_scale(self.node, scale)
+
+	return self
 end
 
 
---- Set text pivot. Text will re-anchor inside
--- his text area
+--- Set text pivot. Text will re-anchor inside text area
 -- @tparam Text self
 -- @tparam gui.pivot pivot Gui pivot constant
+-- @treturn Text Current text instance
 function Text.set_pivot(self, pivot)
 	local prev_pivot = gui.get_pivot(self.node)
 	local prev_offset = const.PIVOTS[prev_pivot]
@@ -216,6 +305,8 @@ function Text.set_pivot(self, pivot)
 	gui.set_position(self.node, self.pos)
 
 	self.on_set_pivot:trigger(self:get_context(), pivot)
+
+	return self
 end
 
 
@@ -227,4 +318,36 @@ function Text.is_multiline(self)
 end
 
 
+--- Set text adjust, refresh the current text visuals, if needed
+-- @tparam Text self
+-- @tparam[opt] number adjust_type See const.TEXT_ADJUST. If pass nil - use current adjust type
+-- @tparam[opt] number minimal_scale If pass nil - not use minimal scale
+-- @treturn Text Current text instance
+function Text.set_text_adjust(self, adjust_type, minimal_scale)
+	self.adjust_type = adjust_type
+	self._minimal_scale = minimal_scale
+	self:set_to(self.last_value)
+
+	return self
+end
+
+
+--- Set minimal scale for DOWNSCALE_LIMITED or SCALE_THEN_SCROLL adjust types
+-- @tparam Text self
+-- @tparam number minimal_scale If pass nil - not use minimal scale
+-- @treturn Text Current text instance
+function Text.set_minimal_scale(self, minimal_scale)
+	self._minimal_scale = minimal_scale
+
+	return self
+end
+
+
+--- Return current text adjust type
+-- @treturn number The current text adjust type
+function Text.get_text_adjust(self, adjust_type)
+	return self.adjust_type
+end
+
+
 return Text

druid/const.lua

@@ -54,6 +54,19 @@ M.PIVOTS = {
 	[gui.PIVOT_NW] = vmath.vector3(-0.5, 0.5, 0),
 }
 
+M.REVERSE_PIVOTS = {
+	[gui.PIVOT_CENTER] = gui.PIVOT_CENTER,
+	[gui.PIVOT_N] = gui.PIVOT_S,
+	[gui.PIVOT_NE] = gui.PIVOT_SW,
+	[gui.PIVOT_E] = gui.PIVOT_W,
+	[gui.PIVOT_SE] = gui.PIVOT_NW,
+	[gui.PIVOT_S] = gui.PIVOT_N,
+	[gui.PIVOT_SW] = gui.PIVOT_NE,
+	[gui.PIVOT_W] = gui.PIVOT_E,
+	[gui.PIVOT_NW] = gui.PIVOT_SE,
+}
+
+
 M.VECTOR_ZERO = vmath.vector3(0)
 M.VECTOR_ONE = vmath.vector3(1)
 M.SYS_INFO = sys.get_sys_info()
@@ -77,6 +90,16 @@ M.SHIFT = {
 }
 
 
+M.TEXT_ADJUST = {
+	DOWNSCALE = 0,
+	TRIM = 1,
+	NO_ADJUST = 2,
+	DOWNSCALE_LIMITED = 3,
+	SCROLL = 4,
+	SCALE_THEN_SCROLL = 5,
+}
+
+
 M.SIDE = {
 	X = "x",
 	Y = "y"

druid/styles/default/style.lua

@@ -130,4 +130,9 @@ M["input"] = {
 }
 
 
+M["text"] = {
+	TRIM_POSTFIX = "..."
+}
+
+
 return M

example/example.collection

@@ -240,7 +240,7 @@ embedded_instances {
   }
 }
 embedded_instances {
-  id: "general_texts"
+  id: "texts_general"
   data: "components {\n"
   "  id: \"screen_factory\"\n"
   "  component: \"/monarch/screen_factory.script\"\n"
@@ -257,7 +257,7 @@ embedded_instances {
   "  }\n"
   "  properties {\n"
   "    id: \"screen_id\"\n"
-  "    value: \"general_texts\"\n"
+  "    value: \"texts_general\"\n"
   "    type: PROPERTY_TYPE_HASH\n"
   "  }\n"
   "  properties {\n"
@@ -269,7 +269,7 @@ embedded_instances {
   "embedded_components {\n"
   "  id: \"collectionfactory\"\n"
   "  type: \"collectionfactory\"\n"
-  "  data: \"prototype: \\\"/example/examples/general/texts/texts.collection\\\"\\n"
+  "  data: \"prototype: \\\"/example/examples/texts/texts_general/texts_general.collection\\\"\\n"
   "load_dynamically: false\\n"
   "\"\n"
   "  position {\n"
@@ -1121,3 +1121,66 @@ embedded_instances {
     z: 1.0
   }
 }
+embedded_instances {
+  id: "texts_adjust"
+  data: "components {\n"
+  "  id: \"screen_factory\"\n"
+  "  component: \"/monarch/screen_factory.script\"\n"
+  "  position {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "  }\n"
+  "  rotation {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "    w: 1.0\n"
+  "  }\n"
+  "  properties {\n"
+  "    id: \"screen_id\"\n"
+  "    value: \"texts_adjust\"\n"
+  "    type: PROPERTY_TYPE_HASH\n"
+  "  }\n"
+  "  properties {\n"
+  "    id: \"popup\"\n"
+  "    value: \"true\"\n"
+  "    type: PROPERTY_TYPE_BOOLEAN\n"
+  "  }\n"
+  "}\n"
+  "embedded_components {\n"
+  "  id: \"collectionfactory\"\n"
+  "  type: \"collectionfactory\"\n"
+  "  data: \"prototype: \\\"/example/examples/texts/texts_adjust/texts_adjust.collection\\\"\\n"
+  "load_dynamically: false\\n"
+  "\"\n"
+  "  position {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "  }\n"
+  "  rotation {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "    w: 1.0\n"
+  "  }\n"
+  "}\n"
+  ""
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale3 {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+}

example/example.gui

@@ -745,7 +745,7 @@ nodes {
 }
 nodes {
   position {
-    x: -230.0
+    x: -240.0
     y: -35.0
     z: 0.0
     w: 1.0
@@ -910,7 +910,7 @@ nodes {
 }
 nodes {
   position {
-    x: 230.0
+    x: 240.0
     y: -35.0
     z: 0.0
     w: 1.0
@@ -1093,7 +1093,7 @@ nodes {
     w: 1.0
   }
   size {
-    x: 300.0
+    x: 360.0
     y: 45.0
     z: 0.0
     w: 1.0

example/example.gui_script

@@ -38,6 +38,10 @@ local function init_top_panel(self)
 		sys.open_url("https://insality.github.io/druid/")
 	end)
 
+	-- self.button_code = self.druid:new_button("button_code/button", function()
+	-- 	sys.open_url("https://github.com/Insality/druid/blob/develop/example/examples/general/overview/overview.gui_script")
+	-- end)
+
 	self.text_header = self.druid:new_text("text_header", "Druid")
 end
 
@@ -98,8 +102,6 @@ local function init_lobby(self)
 	self.lobby_grid:add(get_title(self, "General examples"))
 	self.lobby_grid:add(get_button(self, "Overview", "general_overview"))
 	self.lobby_grid:add(get_button(self, "Buttons", "general_buttons"))
-	self.lobby_grid:add(get_button(self, "Texts", "general_texts"))
-	self.lobby_grid:add(get_button_disabled(self, "Lang Text", "scene_name"))
 	self.lobby_grid:add(get_button(self, "Sliders", "general_sliders"))
 	self.lobby_grid:add(get_button(self, "Scrolls", "general_scroll"))
 	self.lobby_grid:add(get_button(self, "Grids", "general_grid"))
@@ -110,6 +112,11 @@ local function init_lobby(self)
 	self.lobby_grid:add(get_button_disabled(self, "Swipe", "scene_name"))
 	self.lobby_grid:add(get_button_disabled(self, "Drag", "scene_name"))
 
+	self.lobby_grid:add(get_title(self, "Texts"))
+	self.lobby_grid:add(get_button(self, "Texts", "texts_general"))
+	self.lobby_grid:add(get_button(self, "Adjust types", "texts_adjust"))
+	self.lobby_grid:add(get_button_disabled(self, "Lang Text", "texts_lang_text"))
+
 	self.lobby_grid:add(get_title(self, "Scrolls"))
 	self.lobby_grid:add(get_button_disabled(self, "Nested scrolls", "scroll_scene"))
 	self.lobby_grid:add(get_button_disabled(self, "With points of interest", "scroll_scene"))

example/examples/texts/texts_adjust/texts_adjust.collection

@@ -0,0 +1,37 @@
+name: "texts_adjust"
+scale_along_z: 0
+embedded_instances {
+  id: "go"
+  data: "components {\n"
+  "  id: \"texts_adjust\"\n"
+  "  component: \"/example/examples/texts/texts_adjust/texts_adjust.gui\"\n"
+  "  position {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "  }\n"
+  "  rotation {\n"
+  "    x: 0.0\n"
+  "    y: 0.0\n"
+  "    z: 0.0\n"
+  "    w: 1.0\n"
+  "  }\n"
+  "}\n"
+  ""
+  position {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+  }
+  rotation {
+    x: 0.0
+    y: 0.0
+    z: 0.0
+    w: 1.0
+  }
+  scale3 {
+    x: 1.0
+    y: 1.0
+    z: 1.0
+  }
+}

example/examples/texts/texts_adjust/texts_adjust.gui_script

@@ -0,0 +1,59 @@
+local druid = require("druid.druid")
+local const = require("druid.const")
+
+
+function init(self)
+	self.druid = druid.new(self)
+
+	self.texts = {
+		self.druid:new_text("text_scale", nil, const.TEXT_ADJUST.DOWNSCALE),
+		self.druid:new_text("text_trim", nil, const.TEXT_ADJUST.TRIM),
+		self.druid:new_text("text_no_adjust", nil, const.TEXT_ADJUST.NO_ADJUST),
+		self.druid:new_text("text_scale_limited", nil, const.TEXT_ADJUST.DOWNSCALE_LIMITED)
+			:set_minimal_scale(0.5),
+		self.druid:new_text("text_scroll", nil, const.TEXT_ADJUST.SCROLL),
+		self.druid:new_text("text_scroll_scale", nil, const.TEXT_ADJUST.SCALE_THEN_SCROLL)
+			:set_minimal_scale(0.5)
+	}
+
+	local initial_texts = {}
+	local text_sizes = {}
+	for _, text in pairs(self.texts) do
+		initial_texts[text] = text.last_value
+		text_sizes[text] = 0
+	end
+
+
+	timer.delay(0.25, true, function()
+		for _, text in pairs(self.texts) do
+			local text_string = string.sub(initial_texts[text], 1, text_sizes[text])
+			text_sizes[text] = text_sizes[text] + 1
+
+			if text_sizes[text] > #initial_texts[text] then
+				text_sizes[text] = 0
+			end
+
+			text:set_to(text_string)
+		end
+	end)
+end
+
+
+function final(self)
+	self.druid:final()
+end
+
+
+function update(self, dt)
+	self.druid:update(dt)
+end
+
+
+function on_message(self, message_id, message, sender)
+	self.druid:on_message(message_id, message, sender)
+end
+
+
+function on_input(self, action_id, action)
+	return self.druid:on_input(action_id, action)
+end

example/examples/texts/texts_general/texts_general.collection

@@ -4,7 +4,7 @@ embedded_instances {
   id: "go"
   data: "components {\n"
   "  id: \"texts\"\n"
-  "  component: \"/example/examples/general/texts/texts.gui\"\n"
+  "  component: \"/example/examples/texts/texts_general/texts_general.gui\"\n"
   "  position {\n"
   "    x: 0.0\n"
   "    y: 0.0\n"

example/examples/texts/texts_general/texts_general.gui

@@ -1,4 +1,4 @@
-script: "/example/examples/general/texts/texts.gui_script"
+script: "/example/examples/texts/texts_general/texts_general.gui_script"
 fonts {
   name: "game"
   font: "/example/assets/fonts/game.font"

example/examples/texts/texts_general/texts_general.gui_script

@@ -1,4 +1,5 @@
 local druid = require("druid.druid")
+local const = require("druid.const")
 
 local pivots = {
 	gui.PIVOT_CENTER,
@@ -17,7 +18,7 @@ local function setup_texts(self)
 	self.druid:new_text("text_inline")
 	self.druid:new_text("text_multiline")
 	local anchoring = self.druid:new_text("text_anchoring")
-	self.druid:new_text("text_no_adjust", "Without adjust size", true)
+	self.druid:new_text("text_no_adjust", "Without adjust size", const.TEXT_ADJUST.NO_ADJUST)
 	self.druid:new_lang_text("text_locale", "ui_text_example")
 
 	local big_text = "Check max size"