More widgets: insert TitleBar (#8683)

SpinWidget, DoubleSpinWidget, DateTimeWidget, RadioButtonWidget got new TitleBar.
reviewable/pr8690/r1
hius07 2 years ago committed by GitHub
parent 517dfa3549
commit ca6d82e668
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -45,14 +45,12 @@ local GestureRange = require("ui/gesturerange")
local Font = require("ui/font")
local HorizontalGroup = require("ui/widget/horizontalgroup")
local InputContainer = require("ui/widget/container/inputcontainer")
local LineWidget = require("ui/widget/linewidget")
local NumberPickerWidget = require("ui/widget/numberpickerwidget")
local Size = require("ui/size")
local TextBoxWidget = require("ui/widget/textboxwidget")
local TextWidget = require("ui/widget/textwidget")
local TitleBar = require("ui/widget/titlebar")
local UIManager = require("ui/uimanager")
local VerticalGroup = require("ui/widget/verticalgroup")
local VerticalSpan = require("ui/widget/verticalspan")
local WidgetContainer = require("ui/widget/container/widgetcontainer")
local _ = require("gettext")
local Screen = Device.screen
@ -154,37 +152,15 @@ function DateTimeWidget:layout()
table.remove(date_group, 1)
end
local date_title = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.title,
bordersize = 0,
TextWidget:new{
text = self.title_text,
face = self.title_face,
max_width = self.width - 2 * (Size.padding.default + Size.margin.title),
},
}
local date_line = LineWidget:new{
dimen = Geom:new{
w = self.width,
h = Size.line.thick,
}
local title_bar = TitleBar:new{
width = self.width,
align = "left",
with_bottom_line = true,
title = self.title_text,
title_shrink_font_to_fit = true,
info_text = self.info_text,
show_parent = self,
}
local date_info
if self.info_text then
date_info = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.small,
bordersize = 0,
TextBoxWidget:new{
text = self.info_text,
face = Font:getFace("x_smallinfofont"),
width = math.floor(self.width * 0.9),
}
}
else
date_info = VerticalSpan:new{ width = 0 }
end
local buttons = {}
if self.default_value then
@ -254,9 +230,7 @@ function DateTimeWidget:layout()
background = Blitbuffer.COLOR_WHITE,
VerticalGroup:new{
align = "left",
date_title,
date_line,
date_info,
title_bar,
CenterContainer:new{
dimen = Geom:new{
w = self.width,

@ -8,15 +8,13 @@ local GestureRange = require("ui/gesturerange")
local Font = require("ui/font")
local HorizontalGroup = require("ui/widget/horizontalgroup")
local InputContainer = require("ui/widget/container/inputcontainer")
local LineWidget = require("ui/widget/linewidget")
local MovableContainer = require("ui/widget/container/movablecontainer")
local NumberPickerWidget = require("ui/widget/numberpickerwidget")
local Size = require("ui/size")
local TextBoxWidget = require("ui/widget/textboxwidget")
local TextWidget = require("ui/widget/textwidget")
local TitleBar = require("ui/widget/titlebar")
local UIManager = require("ui/uimanager")
local VerticalGroup = require("ui/widget/verticalgroup")
local VerticalSpan = require("ui/widget/verticalspan")
local WidgetContainer = require("ui/widget/container/widgetcontainer")
local _ = require("gettext")
local Screen = Device.screen
@ -153,37 +151,16 @@ function DoubleSpinWidget:update(numberpicker_left_value, numberpicker_right_val
right_vertical_group
}
}
local widget_title = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.title,
bordersize = 0,
TextWidget:new{
text = self.title_text,
face = self.title_face,
max_width = self.width - 2 * (Size.padding.default + Size.margin.title),
},
}
local widget_line = LineWidget:new{
dimen = Geom:new{
w = self.width,
h = Size.line.thick,
}
local title_bar = TitleBar:new{
width = self.width,
align = "left",
with_bottom_line = true,
title = self.title_text,
title_shrink_font_to_fit = true,
info_text = self.info_text,
show_parent = self,
}
local widget_info
if self.info_text then
widget_info = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.small,
bordersize = 0,
TextBoxWidget:new{
text = self.info_text,
face = Font:getFace("x_smallinfofont"),
width = math.floor(self.width * 0.9),
}
}
else
widget_info = VerticalSpan:new{ width = 0 }
end
local buttons = {}
if self.default_values then
@ -259,9 +236,7 @@ function DoubleSpinWidget:update(numberpicker_left_value, numberpicker_right_val
background = Blitbuffer.COLOR_WHITE,
VerticalGroup:new{
align = "left",
widget_title,
widget_line,
widget_info,
title_bar,
CenterContainer:new{
dimen = Geom:new{
w = self.width,

@ -5,15 +5,12 @@ local Device = require("device")
local FrameContainer = require("ui/widget/container/framecontainer")
local Geom = require("ui/geometry")
local GestureRange = require("ui/gesturerange")
local Font = require("ui/font")
local HorizontalGroup = require("ui/widget/horizontalgroup")
local InputContainer = require("ui/widget/container/inputcontainer")
local LineWidget = require("ui/widget/linewidget")
local MovableContainer = require("ui/widget/container/movablecontainer")
local RadioButtonTable = require("ui/widget/radiobuttontable")
local Size = require("ui/size")
local TextBoxWidget = require("ui/widget/textboxwidget")
local TextWidget = require("ui/widget/textwidget")
local TitleBar = require("ui/widget/titlebar")
local UIManager = require("ui/uimanager")
local VerticalGroup = require("ui/widget/verticalgroup")
local WidgetContainer = require("ui/widget/container/widgetcontainer")
@ -22,7 +19,6 @@ local Screen = Device.screen
local RadioButtonWidget = InputContainer:new{
title_text = "",
title_face = Font:getFace("x_smalltfont"),
info_text = nil,
width = nil,
width_factor = nil,
@ -92,22 +88,16 @@ function RadioButtonWidget:update()
value_widget,
}
local value_title = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.title,
bordersize = 0,
TextWidget:new{
text = self.title_text,
max_width = self.width - 2 * (Size.padding.default + Size.margin.title),
face = self.title_face,
},
}
local value_line = LineWidget:new{
dimen = Geom:new{
w = self.width,
h = Size.line.thick,
}
local title_bar = TitleBar:new{
width = self.width,
align = "left",
with_bottom_line = true,
title = self.title_text,
title_shrink_font_to_fit = true,
info_text = self.info_text,
show_parent = self,
}
local buttons = {
{
{
@ -162,21 +152,8 @@ function RadioButtonWidget:update()
local vgroup = VerticalGroup:new{
align = "left",
value_title,
value_line,
title_bar,
}
if self.info_text then
table.insert(vgroup, FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.small,
bordersize = 0,
TextBoxWidget:new{
text = self.info_text,
face = Font:getFace("x_smallinfofont"),
width = math.floor(self.width * 0.9),
}
})
end
table.insert(vgroup, CenterContainer:new{
dimen = Geom:new{
w = self.width,

@ -5,15 +5,12 @@ local Device = require("device")
local FrameContainer = require("ui/widget/container/framecontainer")
local Geom = require("ui/geometry")
local GestureRange = require("ui/gesturerange")
local Font = require("ui/font")
local HorizontalGroup = require("ui/widget/horizontalgroup")
local InputContainer = require("ui/widget/container/inputcontainer")
local LineWidget = require("ui/widget/linewidget")
local MovableContainer = require("ui/widget/container/movablecontainer")
local NumberPickerWidget = require("ui/widget/numberpickerwidget")
local Size = require("ui/size")
local TextBoxWidget = require("ui/widget/textboxwidget")
local TextWidget = require("ui/widget/textwidget")
local TitleBar = require("ui/widget/titlebar")
local UIManager = require("ui/uimanager")
local VerticalGroup = require("ui/widget/verticalgroup")
local WidgetContainer = require("ui/widget/container/widgetcontainer")
@ -23,7 +20,6 @@ local T = require("ffi/util").template
local SpinWidget = InputContainer:new{
title_text = "",
title_face = Font:getFace("x_smalltfont"),
info_text = nil,
width = nil,
width_factor = nil, -- number between 0 and 1, factor to the smallest of screen width and height
@ -111,21 +107,14 @@ function SpinWidget:update(numberpicker_value, numberpicker_value_index)
value_widget,
}
local value_title = FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.title,
bordersize = 0,
TextWidget:new{
text = self.title_text,
max_width = self.width - 2 * (Size.padding.default + Size.margin.title),
face = self.title_face,
},
}
local value_line = LineWidget:new{
dimen = Geom:new{
w = self.width,
h = Size.line.thick,
}
local title_bar = TitleBar:new{
width = self.width,
align = "left",
with_bottom_line = true,
title = self.title_text,
title_shrink_font_to_fit = true,
info_text = self.info_text,
show_parent = self,
}
local buttons = {}
@ -202,7 +191,7 @@ function SpinWidget:update(numberpicker_value, numberpicker_value_index)
})
local ok_cancel_buttons = ButtonTable:new{
width = self.width - 2*Size.padding.default,
width = self.width - 2 * Size.padding.default,
buttons = buttons,
zero_sep = true,
show_parent = self,
@ -210,21 +199,8 @@ function SpinWidget:update(numberpicker_value, numberpicker_value_index)
local vgroup = VerticalGroup:new{
align = "left",
value_title,
value_line,
title_bar,
}
if self.info_text then
table.insert(vgroup, FrameContainer:new{
padding = Size.padding.default,
margin = Size.margin.small,
bordersize = 0,
TextBoxWidget:new{
text = self.info_text,
face = Font:getFace("x_smallinfofont"),
width = math.floor(self.width * 0.9),
}
})
end
table.insert(vgroup, CenterContainer:new{
dimen = Geom:new{
w = self.width,

@ -38,6 +38,10 @@ local TitleBar = OverlapGroup:extend{
subtitle_fullwidth = false, -- true to allow subtitle to extend below the buttons
subtitle_multilines = false, -- multilines if overflow
info_text = nil, -- additional text displayed below bottom line
info_text_face = Font:getFace("x_smallinfofont"),
info_text_h_padding = nil, -- default to title_h_padding
title_top_padding = nil, -- computed if none provided
title_h_padding = Size.padding.large, -- horizontal padding (this replaces button_padding on the inner/title side)
title_subtitle_v_padding = Screen:scaleBySize(3),
@ -317,6 +321,24 @@ function TitleBar:init()
return
end
if self.info_text then
local h_padding = self.info_text_h_padding or self.title_h_padding
local v_padding = self.with_bottom_line and Size.padding.default or 0
local filler_and_info_text = VerticalGroup:new{
VerticalSpan:new{ width = self.titlebar_height + v_padding },
HorizontalGroup:new{
HorizontalSpan:new{ width = h_padding },
TextBoxWidget:new{
text = self.info_text,
face = self.info_text_face,
width = self.width - 2 * h_padding,
}
}
}
table.insert(self, filler_and_info_text)
self.titlebar_height = filler_and_info_text:getSize().h + self.bottom_v_padding
end
self.dimen = Geom:new{
w = self.width,
h = self.titlebar_height, -- buttons can overflow this

Loading…
Cancel
Save