Add marked_text support. Add input example page

docs_md/changelog.md

@@ -14,6 +14,7 @@ Druid 0.3.0:
 	- You can setup max length of the text
 	- You can setup allowed characters. On add not allowed characters `on_input_wrong` will be called. By default it cause simple shake animation
 	- The keyboard for input will not show on mobile HTML5
+	- To make work different keyboard type, make sure value in game.project Android:InputMethod set to HidderInputField (https://defold.com/manuals/project-settings/#input-method)
 
 - Add button on_click_outside event. You can subscribe on this event in button. Was needed for Input component (click outside to deselect input field).
 - Add start_pos to button component

druid/base/input.lua

@@ -11,12 +11,28 @@ local utf8 = require("druid.system.utf8")
 local M = component.create("input", { const.ON_INPUT, const.ON_FOCUS_LOST })
 
 
+--- Mask text by replacing every character with a mask character
+-- @tparam string text
+-- @tparam string mask
+-- @treturn string Masked text
+local function mask_text(text, mask)
+	mask = mask or "*"
+	local masked_text = ""
+	for uchar in utf8.gmatch(text, ".") do
+		masked_text = masked_text .. mask
+	end
+
+	return masked_text
+end
+
+
 local function select(self)
 	gui.reset_keyboard()
 	self.marked_value = ""
 	if not self.selected then
 		self.previous_value = self.value
 		self.selected = true
+		print("type", self.keyboard_type)
 		gui.show_keyboard(self.keyboard_type, false)
 		self.on_input_select:trigger(self:get_context())
 
@@ -43,7 +59,10 @@ end
 
 
 local function clear_and_select(self)
-	self:set_text("")
+	if self.style.IS_LONGTAP_ERASE then
+		self:set_text("")
+	end
+
 	select(self)
 end
 
@@ -54,10 +73,10 @@ function M.init(self, click_node, text_node, keyboard_type)
 	self.text = self.druid:new_text(text_node)
 
 	self.selected = false
-	self.previous_value = ""
+	self.value = self.text.last_value
-	self.value = ""
+	self.previous_value = self.text.last_value
+	self.current_value = self.text.last_value
 	self.marked_value = ""
-	self.current_value = ""
 	self.is_empty = true
 
 	self.text_width = 0
@@ -67,7 +86,7 @@ function M.init(self, click_node, text_node, keyboard_type)
 	self.max_length = nil
 	self.allowed_characters = nil
 
-	self.keyboard_type = keyboard_type or gui.KEYBOARD_TYPE_NUMBER_PAD
+	self.keyboard_type = keyboard_type or gui.KEYBOARD_TYPE_DEFAULT
 
 	self.button = self.druid:new_button(click_node, select)
 	self.button:set_style(self.style)
@@ -116,8 +135,9 @@ function M.on_input(self, action_id, action)
 		if action_id == const.ACTION_MARKED_TEXT then
 			self.marked_value = action.text or ""
 			if self.max_length then
-				input_text = utf8.sub(self.marked_value, 1, self.max_length)
+				self.marked_value = utf8.sub(self.marked_value, 1, self.max_length)
 			end
+			print("marked text", self.marked_value)
 		end
 
 		if action_id == const.ACTION_BACKSPACE and (action.pressed or action.repeated) then
@@ -139,7 +159,7 @@ function M.on_input(self, action_id, action)
 			return true
 		end
 
-		if input_text then
+		if input_text or #self.marked_value > 0 then
 			self:set_text(input_text)
 			return true
 		end
@@ -154,13 +174,22 @@ function M.on_focus_lost(self)
 end
 
 
+function M.on_input_interrupt(self)
+	-- unselect(self)
+end
+
+
 --- Set text for input field
 -- @function input:set_text
 -- @tparam string input_text The string to apply for input field
 function M.set_text(self, input_text)
-	self.value = input_text
+	-- Case when update with marked text
+	if input_text then
+		self.value = input_text
+	end
 
-	-- only update the text if it has changed
+	-- Only update the text if it has changed
+	print("set text", self.value, ":::", self.marked_value)
 	local current_value = self.value .. self.marked_value
 
 	if current_value ~= self.current_value then
@@ -169,8 +198,9 @@ function M.set_text(self, input_text)
 		-- mask text if password field
 		local masked_value, masked_marked_value
 		if self.keyboard_type == gui.KEYBOARD_TYPE_PASSWORD then
-			masked_value = M.mask_text(self.text, "*")
+			local mask_char = self.style.MASK_DEFAULT_CHAR or "*"
-			masked_marked_value = M.mask_text(self.marked_text, "*")
+			masked_value = mask_text(self.value, mask_char)
+			masked_marked_value = mask_text(self.marked_value, mask_char)
 		end
 
 		-- text + marked text

druid/const.lua

@@ -5,12 +5,14 @@
 local M = {}
 
 M.ACTION_TEXT = hash("text")
-M.ACTION_TOUCH = hash("touch")
 M.ACTION_MARKED_TEXT = hash("marked_text")
+
 M.ACTION_BACKSPACE = hash("key_backspace")
 M.ACTION_ENTER = hash("key_enter")
-M.ACTION_BACK = hash("back")
+M.ACTION_BACK = hash("key_back")
 M.ACTION_ESC = hash("key_esc")
+
+M.ACTION_TOUCH = hash("touch")
 M.ACTION_SCROLL_UP = hash("scroll_up")
 M.ACTION_SCROLL_DOWN = hash("scroll_down")
 
@@ -24,14 +26,14 @@ M.ALL = "all"
 
 
 --- Component Interests
-M.ON_MESSAGE = hash("on_message")
-M.ON_UPDATE = hash("on_update")
-M.ON_INPUT_HIGH = hash("on_input_high")
 M.ON_INPUT = hash("on_input")
-M.ON_LANGUAGE_CHANGE = hash("on_language_change")
+M.ON_UPDATE = hash("on_update")
-M.ON_LAYOUT_CHANGE = hash("on_layout_change")
+M.ON_MESSAGE = hash("on_message")
+M.ON_INPUT_HIGH = hash("on_input_high")
 M.ON_FOCUS_LOST = hash("on_focus_lost")
 M.ON_FOCUS_GAINED = hash("on_focus_gained")
+M.ON_LAYOUT_CHANGE = hash("on_layout_change")
+M.ON_LANGUAGE_CHANGE = hash("on_language_change")
 
 
 M.PIVOTS = {
@@ -48,10 +50,10 @@ M.PIVOTS = {
 
 
 M.SPECIFIC_UI_MESSAGES = {
-	[M.ON_LANGUAGE_CHANGE] = "on_language_change",
-	[M.ON_LAYOUT_CHANGE] = "on_layout_change",
 	[M.ON_FOCUS_LOST] = "on_focus_lost",
 	[M.ON_FOCUS_GAINED] = "on_focus_gained",
+	[M.ON_LAYOUT_CHANGE] = "on_layout_change",
+	[M.ON_LANGUAGE_CHANGE] = "on_language_change",
 }
 
 

druid/styles/default/style.lua

@@ -83,7 +83,9 @@ M["swipe"] = {
 
 
 M["input"] = {
+	IS_LONGTAP_ERASE = true,
 	BUTTON_SELECT_INCREASE = 1.1,
+	MASK_DEFAULT_CHAR = "*",
 
 	on_select = function(self, button_node)
 		local target_scale = self.button.start_scale

example/gui/main/main.gui_script

@@ -8,6 +8,7 @@ local text_page = require("example.page.texts")
 local button_page = require("example.page.button")
 local scroll_page = require("example.page.scroll")
 local slider_page = require("example.page.slider")
+local input_page = require("example.page.input")
 
 local pages = {
 	"main_page",
@@ -15,6 +16,7 @@ local pages = {
 	"button_page",
 	"scroll_page",
 	"slider_page",
+	"input_page",
 }
 
 local function on_control_button(self, delta)
@@ -70,6 +72,7 @@ function init(self)
 	button_page.setup_page(self)
 	scroll_page.setup_page(self)
 	slider_page.setup_page(self)
+	input_page.setup_page(self)
 
 	-- Refresh state
 	on_control_button(self, 0)

example/lang.lua

@@ -8,6 +8,7 @@ local en = {
 	button_page = "Button page",
 	scroll_page = "Scroll page",
 	slider_page = "Slider page",
+	input_page = "Input page",
 	ui_section_button = "Button",
 	ui_section_text = "Text",
 	ui_section_timer = "Timer",
@@ -25,6 +26,7 @@ local ru = {
 	button_page = "Кнопки",
 	scroll_page = "Скролл",
 	slider_page = "Слайдеры",
+	input_page = "Текст. ввод",
 	ui_section_button = "Кнопка",
 	ui_section_text = "Текст",
 	ui_section_timer = "Таймер",

example/page/input.lua

@@ -0,0 +1,12 @@
+local M = {}
+
+
+function M.setup_page(self)
+	self.druid:new_input("input_box_usual", "input_text_usual")
+	self.druid:new_input("input_box_password", "input_text_password", gui.KEYBOARD_TYPE_PASSWORD)
+	self.druid:new_input("input_box_email", "input_text_email", gui.KEYBOARD_TYPE_EMAIL)
+	self.druid:new_input("input_box_numpad", "input_text_numpad", gui.KEYBOARD_TYPE_NUMBER_PAD)
+end
+
+
+return M

game.project

@@ -38,4 +38,5 @@ texture_profiles = /example/custom.texture_profiles
 
 [android]
 package = com.insality.druid
+input_method = HiddenInputField
 

input/game.input_binding

@@ -4,7 +4,7 @@ key_trigger {
 }
 key_trigger {
   input: KEY_BACK
-  action: "back"
+  action: "key_back"
 }
 key_trigger {
   input: KEY_SPACE