diff --git a/README.md b/README.md index b900540..7db2ffa 100644 --- a/README.md +++ b/README.md @@ -23,7 +23,13 @@ More info and code is over at [readthedocs](http://suit.readthedocs.org/en/lates local suit = require 'suit' -- storage for text input -local input = {text = ""} +local input = {text = "", candidate_text = {text="", start=0, length=0}} + +-- make love use font which support CJK text +function love.load() + local font = love.graphics.newFont("NotoSansHans-Regular.otf", 20) + love.graphics.setFont(font) +end -- all the UI is defined in love.update or functions that are called from here function love.update(dt) @@ -33,7 +39,7 @@ function love.update(dt) -- put an input widget at the layout origin, with a cell size of 200 by 30 pixels suit.Input(input, suit.layout:row(200,30)) - + -- put a label that displays the text below the first cell -- the cell size is the same as the last one (200x30 px) -- the label text will be aligned to the left @@ -41,7 +47,7 @@ function love.update(dt) -- put an empty cell that has the same size as the last cell (200x30 px) suit.layout:row() - + -- put a button of size 200x30 px in the cell below -- if the button is pressed, quit the game if suit.Button("Close", suit.layout:row()).hit then @@ -54,6 +60,11 @@ function love.draw() suit.draw() end +function love.textedited(text, start, length) + -- for IME input + input.candidate_text = {text = text, start= start, length = length} +end + function love.textinput(t) -- forward text input to SUIT suit.textinput(t) diff --git a/core.lua b/core.lua index 702e8c5..3b92337 100644 --- a/core.lua +++ b/core.lua @@ -64,6 +64,7 @@ function suit:isActive(id) return id == self.active end + function suit:setHit(id) self.hit = id -- simulate mouse release on button -- see suit:mouseReleasedOn() diff --git a/input.lua b/input.lua index 57a4e48..5c9f29d 100644 --- a/input.lua +++ b/input.lua @@ -57,7 +57,7 @@ return function(core, input, ...) opt.state = core:registerHitbox(opt.id, x,y,w,h) opt.hasKeyboardFocus = core:grabKeyboardFocus(opt.id) - if opt.hasKeyboardFocus then + if (input.candidate_text.text == "") and opt.hasKeyboardFocus then local keycode,char = core:getPressedKey() -- text input if char and char ~= "" then diff --git a/theme.lua b/theme.lua index c052348..71081fa 100644 --- a/theme.lua +++ b/theme.lua @@ -123,12 +123,26 @@ function theme.Input(input, opt, x,y,w,h) love.graphics.setFont(opt.font) love.graphics.print(input.text, x, y+(h-th)/2) + -- candidate text + local tw = opt.font:getWidth(input.text) + local ctw = opt.font:getWidth(input.candidate_text.text) + love.graphics.setColor((opt.color and opt.color.normal and opt.color.normal.fg) or theme.color.normal.fg) + love.graphics.print(input.candidate_text.text, x + tw, y+(h-th)/2) + + -- candidate text rectangle box + love.graphics.rectangle("line", x + tw, y+(h-th)/2, ctw, th) + -- cursor if opt.hasKeyboardFocus and (love.timer.getTime() % 1) > .5 then + local ct = input.candidate_text; + local ss = ct.text:sub(1, utf8.offset(ct.text, ct.start)) + local ws = opt.font:getWidth(ss) + if ct.start == 0 then ws = 0 end + love.graphics.setLineWidth(1) love.graphics.setLineStyle('rough') - love.graphics.line(x + opt.cursor_pos, y + (h-th)/2, - x + opt.cursor_pos, y + (h+th)/2) + love.graphics.line(x + opt.cursor_pos + ws, y + (h-th)/2, + x + opt.cursor_pos + ws, y + (h+th)/2) end -- reset scissor