Create skin other than buttons
This commit is contained in:
parent
c042ced031
commit
67af92b047
195
loveframes/skins/Clock/skin.lua
Normal file
195
loveframes/skins/Clock/skin.lua
Normal file
@ -0,0 +1,195 @@
|
|||||||
|
-- Module function
|
||||||
|
return function(loveframes)
|
||||||
|
|
||||||
|
local skin = {}
|
||||||
|
|
||||||
|
skin.name = "Clock"
|
||||||
|
skin.author = "Brandon Dyck"
|
||||||
|
skin.version = "0.1"
|
||||||
|
|
||||||
|
skin.directives = {}
|
||||||
|
|
||||||
|
skin.controls = {
|
||||||
|
small_font = love.graphics.newFont(11),
|
||||||
|
border_width = 2,
|
||||||
|
border_color = {0.56, 0.56, 1},
|
||||||
|
body_color = {0.85, 0.85, 0.85},
|
||||||
|
text_color = {0, 0, 0},
|
||||||
|
padding = 3,
|
||||||
|
}
|
||||||
|
skin.controls.button_text_font = skin.controls.small_font
|
||||||
|
skin.controls.panel_body_color = skin.controls.body_color
|
||||||
|
skin.controls.textinput_body_color = {1,1,1}
|
||||||
|
skin.controls.textinput_indicator_width = 2
|
||||||
|
skin.controls.textinput_text_color = skin.controls.text_color
|
||||||
|
skin.controls.textinput_highlight_color = {0, 0, 0.6}
|
||||||
|
skin.controls.textinput_selected_text_color = {1, 1, 1}
|
||||||
|
|
||||||
|
local function printOnPixel(text, x, y)
|
||||||
|
love.graphics.print(text, math.floor(x+0.5), math.floor(y+0.5))
|
||||||
|
end
|
||||||
|
|
||||||
|
local function outlinedRectangle(x, y, width, height)
|
||||||
|
love.graphics.push("all")
|
||||||
|
local line = skin.controls.border_width
|
||||||
|
local halfline = line / 2
|
||||||
|
love.graphics.setColor(skin.controls.border_color)
|
||||||
|
love.graphics.setLineWidth(skin.controls.border_width)
|
||||||
|
love.graphics.setLineJoin("miter")
|
||||||
|
love.graphics.setLineStyle("smooth")
|
||||||
|
love.graphics.rectangle("line", x + halfline, y + halfline, width - line, height - line)
|
||||||
|
love.graphics.pop()
|
||||||
|
end
|
||||||
|
|
||||||
|
function skin.button(object)
|
||||||
|
|
||||||
|
end
|
||||||
|
|
||||||
|
function skin.numberbox(object) end
|
||||||
|
|
||||||
|
function skin.textinput(object)
|
||||||
|
-- I don't use multiline text, so I won't bother implementing it.
|
||||||
|
-- In fact, I won't bother with most features.
|
||||||
|
local x, y = object:GetPos()
|
||||||
|
local width, height = object:GetSize()
|
||||||
|
local text = object:GetText()
|
||||||
|
local placeholder = object:GetPlaceholderText()
|
||||||
|
local font = object:GetFont()
|
||||||
|
local textWidth = font:getWidth(text)
|
||||||
|
local textHeight = font:getHeight()
|
||||||
|
local isSelected = object:IsAllTextSelected()
|
||||||
|
local textX = object:GetTextX()
|
||||||
|
local textY = object:GetTextY()
|
||||||
|
|
||||||
|
love.graphics.setColor(skin.controls.textinput_body_color)
|
||||||
|
love.graphics.rectangle("fill", x, y, width, height)
|
||||||
|
|
||||||
|
if isSelected then
|
||||||
|
love.graphics.setColor(skin.controls.textinput_highlight_color)
|
||||||
|
love.graphics.rectangle("fill", textX, textY, textWidth, textHeight)
|
||||||
|
end
|
||||||
|
|
||||||
|
love.graphics.setColor(skin.controls.text_color)
|
||||||
|
if object:GetIndicatorVisibility() and object:GetFocus() then
|
||||||
|
local indX = object:GetIndicatorX()
|
||||||
|
local indY = object:GetIndicatorY()
|
||||||
|
local indW = skin.controls.textinput_indicator_width
|
||||||
|
love.graphics.rectangle("fill", indX, indY, indW, textHeight)
|
||||||
|
end
|
||||||
|
|
||||||
|
love.graphics.setFont(font)
|
||||||
|
if isSelected then
|
||||||
|
love.graphics.setColor(skin.controls.textinput_selected_text_color)
|
||||||
|
end
|
||||||
|
printOnPixel(#text > 0 and text or placeholder, textX, textY)
|
||||||
|
end
|
||||||
|
|
||||||
|
function skin.panel(object)
|
||||||
|
local x, y = object:GetPos()
|
||||||
|
local width, height = object:GetSize()
|
||||||
|
love.graphics.setColor(skin.controls.panel_body_color)
|
||||||
|
love.graphics.rectangle("fill", x, y, width, height)
|
||||||
|
end
|
||||||
|
|
||||||
|
function skin.collapsiblecategory(object)
|
||||||
|
local text = object:GetText()
|
||||||
|
local child = object:GetObject()
|
||||||
|
local closedHeight = object:GetClosedHeight()
|
||||||
|
local open = object:GetOpen()
|
||||||
|
local x, y = object:GetPos()
|
||||||
|
local width, height = object:GetSize()
|
||||||
|
|
||||||
|
love.graphics.setColor(skin.controls.body_color)
|
||||||
|
love.graphics.rectangle("fill", x, y, width, height)
|
||||||
|
outlinedRectangle(x, y, width, height)
|
||||||
|
|
||||||
|
local offset = skin.controls.padding + skin.controls.border_width
|
||||||
|
love.graphics.setColor(skin.controls.text_color)
|
||||||
|
love.graphics.setFont(skin.controls.small_font)
|
||||||
|
printOnPixel(text, x + offset, y + offset)
|
||||||
|
|
||||||
|
local arrow
|
||||||
|
if open then
|
||||||
|
arrow = "–"
|
||||||
|
else
|
||||||
|
arrow = "+"
|
||||||
|
end
|
||||||
|
local arrowWidth = skin.controls.button_text_font:getWidth(arrow)
|
||||||
|
printOnPixel(arrow, x + width - arrowWidth - offset, y + offset)
|
||||||
|
end
|
||||||
|
|
||||||
|
-- Taken from the included Blue theme by Nikolai Resokav.
|
||||||
|
function skin.text(object)
|
||||||
|
local textdata = object.formattedtext
|
||||||
|
local x = object.x
|
||||||
|
local y = object.y
|
||||||
|
local shadow = object.shadow
|
||||||
|
local shadowxoffset = object.shadowxoffset
|
||||||
|
local shadowyoffset = object.shadowyoffset
|
||||||
|
local shadowcolor = object.shadowcolor
|
||||||
|
local inlist, list = object:IsInList()
|
||||||
|
local printfunc = function(text, x, y)
|
||||||
|
love.graphics.print(text, math.floor(x + 0.5), math.floor(y + 0.5))
|
||||||
|
end
|
||||||
|
|
||||||
|
for k, v in ipairs(textdata) do
|
||||||
|
local textx = v.x
|
||||||
|
local texty = v.y
|
||||||
|
local text = v.text
|
||||||
|
local color = v.color
|
||||||
|
local font = v.font
|
||||||
|
local link = v.link
|
||||||
|
local theight = font:getHeight("a")
|
||||||
|
if inlist then
|
||||||
|
local listy = list.y
|
||||||
|
local listhieght = list.height
|
||||||
|
if (y + texty) <= (listy + listhieght) and y + ((texty + theight)) >= listy then
|
||||||
|
love.graphics.setFont(font)
|
||||||
|
if shadow then
|
||||||
|
love.graphics.setColor(unpack(shadowcolor))
|
||||||
|
printfunc(text, x + textx + shadowxoffset, y + texty + shadowyoffset)
|
||||||
|
end
|
||||||
|
if link then
|
||||||
|
local linkcolor = v.linkcolor
|
||||||
|
local linkhovercolor = v.linkhovercolor
|
||||||
|
local hover = v.hover
|
||||||
|
if hover then
|
||||||
|
love.graphics.setColor(linkhovercolor)
|
||||||
|
else
|
||||||
|
love.graphics.setColor(linkcolor)
|
||||||
|
end
|
||||||
|
else
|
||||||
|
love.graphics.setColor(unpack(color))
|
||||||
|
end
|
||||||
|
printfunc(text, x + textx, y + texty)
|
||||||
|
end
|
||||||
|
else
|
||||||
|
love.graphics.setFont(font)
|
||||||
|
if shadow then
|
||||||
|
love.graphics.setColor(unpack(shadowcolor))
|
||||||
|
printfunc(text, x + textx + shadowxoffset, y + texty + shadowyoffset)
|
||||||
|
end
|
||||||
|
if link then
|
||||||
|
local linkcolor = v.linkcolor
|
||||||
|
local linkhovercolor = v.linkhovercolor
|
||||||
|
local hover = v.hover
|
||||||
|
if hover then
|
||||||
|
love.graphics.setColor(linkhovercolor)
|
||||||
|
else
|
||||||
|
love.graphics.setColor(linkcolor)
|
||||||
|
end
|
||||||
|
else
|
||||||
|
love.graphics.setColor(unpack(color))
|
||||||
|
end
|
||||||
|
printfunc(text, x + textx, y + texty)
|
||||||
|
end
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
loveframes.RegisterSkin(skin)
|
||||||
|
|
||||||
|
-- End module function
|
||||||
|
end
|
||||||
31
main.lua
31
main.lua
@ -38,9 +38,38 @@ function love.textinput(text)
|
|||||||
loveframes.textinput(text)
|
loveframes.textinput(text)
|
||||||
end
|
end
|
||||||
|
|
||||||
|
-- TODO delete this when the skin is done
|
||||||
|
function setupSkin(fontsize)
|
||||||
|
local font = love.graphics.newFont(fontsize)
|
||||||
|
loveframes.basicfont = font
|
||||||
|
loveframes.config["ACTIVESKIN"] = "Blue"
|
||||||
|
local skin = loveframes.GetActiveSkin()
|
||||||
|
skin.controls.smallfont = font
|
||||||
|
loveframes.RegisterTemplate({
|
||||||
|
name = "Clock",
|
||||||
|
properties = {
|
||||||
|
numberbox = {
|
||||||
|
height = fontsize+10
|
||||||
|
},
|
||||||
|
textinput = {
|
||||||
|
width = font:getWidth("999")+10
|
||||||
|
},
|
||||||
|
collapsiblecategory = {
|
||||||
|
height = fontsize+10,
|
||||||
|
closedheight = fontsize+10
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
end
|
||||||
|
|
||||||
function love.load()
|
function love.load()
|
||||||
if arg[#arg] == "-debug" then require("mobdebug").start() end
|
if arg[#arg] == "-debug" then require("mobdebug").start() end
|
||||||
|
|
||||||
|
loveframes.SetActiveSkin("Clock")
|
||||||
|
|
||||||
|
local fontsize = love.graphics.getHeight() / 20
|
||||||
|
-- setupSkin(fontsize)
|
||||||
|
|
||||||
local margin = love.graphics.getHeight() / 20
|
local margin = love.graphics.getHeight() / 20
|
||||||
|
|
||||||
local diameter = love.graphics.getHeight() - 2 * margin
|
local diameter = love.graphics.getHeight() - 2 * margin
|
||||||
@ -100,7 +129,7 @@ function love.load()
|
|||||||
|
|
||||||
local exitNote = "Press \"Esc\" to exit."
|
local exitNote = "Press \"Esc\" to exit."
|
||||||
local exitNoteWidth = love.graphics.getWidth() - column2X - margin
|
local exitNoteWidth = love.graphics.getWidth() - column2X - margin
|
||||||
local exitNoteFont = love.graphics.newFont(love.graphics.getHeight()/20)
|
local exitNoteFont = love.graphics.newFont(fontsize)
|
||||||
local _, wraps = exitNoteFont:getWrap(exitNote, exitNoteWidth)
|
local _, wraps = exitNoteFont:getWrap(exitNote, exitNoteWidth)
|
||||||
local exitNoteY = love.graphics.getHeight() - table.maxn(wraps) * exitNoteFont:getHeight() - margin
|
local exitNoteY = love.graphics.getHeight() - table.maxn(wraps) * exitNoteFont:getHeight() - margin
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user