feat: add keyboard support for button table

frontend/ui/widget/button.lua

@@ -66,9 +66,7 @@ function Button:init()
         }
     }
     if self.preselect then
-        self.frame.color = Blitbuffer.COLOR_BLACK
-    else
-        self.frame.color = Blitbuffer.gray(0.33)
+        self:onFocus()
     end
     self.dimen = self.frame:getSize()
     self[1] = self.frame
@@ -105,12 +103,12 @@ function Button:setIcon(icon)
 end
 
 function Button:onFocus()
-    self[1].color = Blitbuffer.COLOR_BLACK
+    self.frame.invert = true
     return true
 end
 
 function Button:onUnfocus()
-    self[1].color = Blitbuffer.gray(0.33)
+    self.frame.invert = false
     return true
 end
 

frontend/ui/widget/buttontable.lua

@@ -1,13 +1,16 @@
-local VerticalGroup = require("ui/widget/verticalgroup")
 local HorizontalGroup = require("ui/widget/horizontalgroup")
+local VerticalGroup = require("ui/widget/verticalgroup")
 local VerticalSpan = require("ui/widget/verticalspan")
+local FocusManager = require("ui/widget/focusmanager")
 local LineWidget = require("ui/widget/linewidget")
-local Button = require("ui/widget/button")
-local Screen = require("device").screen
-local Geom = require("ui/geometry")
 local Blitbuffer = require("ffi/blitbuffer")
+local Button = require("ui/widget/button")
+local UIManager = require("ui/uimanager")
+local Geom = require("ui/geometry")
+local Device = require("device")
+local Screen = Device.screen
 
-local ButtonTable = VerticalGroup:new{
+local ButtonTable = FocusManager:new{
     width = Screen:getWidth(),
     buttons = {
         {
@@ -24,7 +27,8 @@ local ButtonTable = VerticalGroup:new{
 }
 
 function ButtonTable:init()
-    --local vertical_group = VerticalGroup:new{}
+    self.container = VerticalGroup:new{ width = self.width }
+    table.insert(self, self.container)
     if self.zero_sep then
         self:addHorizontalSep()
     end
@@ -53,28 +57,42 @@ function ButtonTable:init()
                     h = button_dim.h,
                 }
             }
+            self.buttons[i][j] = button
             table.insert(horizontal_group, button)
             if j < #line then
                 table.insert(horizontal_group, vertical_sep)
             end
         end -- end for each button
-        table.insert(self, horizontal_group)
+        table.insert(self.container, horizontal_group)
         if i < #self.buttons then
             self:addHorizontalSep()
         end
     end -- end for each button line
+    if Device:hasKeys() then
+        self.layout = self.buttons
+        self.layout[1][1]:onFocus()
+        self.key_events.SelectByKeyPress = { {{"Press", "Enter"}} }
+    else
+        self.key_events = {}  -- deregister all key press event listeners
+    end
 end
 
 function ButtonTable:addHorizontalSep()
-    table.insert(self, VerticalSpan:new{ width = Screen:scaleBySize(2) })
-    table.insert(self, LineWidget:new{
+    table.insert(self.container,
+                 VerticalSpan:new{ width = Screen:scaleBySize(2) })
+    table.insert(self.container, LineWidget:new{
         background = Blitbuffer.gray(0.5),
         dimen = Geom:new{
             w = self.width,
             h = self.sep_width,
         }
     })
-    table.insert(self, VerticalSpan:new{ width = Screen:scaleBySize(2) })
+    table.insert(self.container,
+                 VerticalSpan:new{ width = Screen:scaleBySize(2) })
+end
+
+function ButtonTable:onSelectByKeyPress()
+    self:getFocusItem().callback()
 end
 
 return ButtonTable

frontend/ui/widget/container/centercontainer.lua

@@ -6,18 +6,18 @@ CenterContainer centers its content (1 widget) within its own dimensions
 local CenterContainer = WidgetContainer:new()
 
 function CenterContainer:paintTo(bb, x, y)
-    local contentSize = self[1]:getSize()
-    if contentSize.w > self.dimen.w or contentSize.h > self.dimen.h then
+    local content_size = self[1]:getSize()
+    if content_size.w > self.dimen.w or content_size.h > self.dimen.h then
         -- throw error? paint to scrap buffer and blit partially?
         -- for now, we ignore this
     end
     local x_pos = x
     local y_pos = y
     if self.ignore ~= "height" then
-        y_pos = y + math.floor((self.dimen.h - contentSize.h)/2)
+        y_pos = y + math.floor((self.dimen.h - content_size.h)/2)
     end
     if self.ignore ~= "width" then
-        x_pos = x + math.floor((self.dimen.w - contentSize.w)/2)
+        x_pos = x + math.floor((self.dimen.w - content_size.w)/2)
     end
     self[1]:paintTo(bb, x_pos, y_pos)
 end

frontend/ui/widget/focusmanager.lua

@@ -101,4 +101,8 @@ function FocusManager:onWrapLast()
     return true
 end
 
+function FocusManager:getFocusItem()
+    return self.layout[self.selected.y][self.selected.x]
+end
+
 return FocusManager