ButtonToggle class

A Button you can toggle on and off

ButtonToggle Class

--[[
-- ButtonToggle v1.1
-- Free to modify and use!
-- Matjaž Bravc
v1.1 - 2023-11-30 update to use setVisible
v1.0 - 2013-03-19 Initial release
]]

ButtonToggle = Core.class(Sprite)

function ButtonToggle:init(upState, downState)
	self.upState = upState
	self.downState = downState
	self:addChild(self.upState)
	if self.downState then self:addChild(self.downState) end

	self.focus = false
	self.toggled = false

	-- set the visual state
	self:updateVisualState(self.toggled)

	self:addEventListener(Event.MOUSE_DOWN, self.onMouseDown, self)
	self:addEventListener(Event.MOUSE_MOVE, self.onMouseMove, self)
	self:addEventListener(Event.MOUSE_UP, self.onMouseUp, self)

	self:addEventListener(Event.TOUCHES_BEGIN, self.onTouchesBegin, self)
	self:addEventListener(Event.TOUCHES_MOVE, self.onTouchesMove, self)
	self:addEventListener(Event.TOUCHES_END, self.onTouchesEnd, self)
	self:addEventListener(Event.TOUCHES_CANCEL, self.onTouchesCancel, self)
end

function ButtonToggle:onMouseDown(ev)
	if self:hitTestPoint(ev.x, ev.y) then
		self.focus = true
		ev:stopPropagation()
	end
end

function ButtonToggle:onMouseMove(ev)
	if self.focus then
		if not self:hitTestPoint(ev.x, ev.y) then
			self.focus = false
		end
		ev:stopPropagation()
	end
end

function ButtonToggle:onMouseUp(ev)
	if self.focus then
		self.focus = false
		self:updateVisualState(not self.toggled)
		self:dispatchEvent(Event.new("clicked")) -- button is clicked, dispatch "clicked" event
		ev:stopPropagation()
	end
end

-- if button is on focus, stop propagation of touch events
function ButtonToggle:onTouchesBegin(ev)
	if self.focus then
		ev:stopPropagation()
	end
end

-- if button is on focus, stop propagation of touch events
function ButtonToggle:onTouchesMove(ev)
	if self.focus then
		ev:stopPropagation()
	end
end

-- if button is on focus, stop propagation of touch events
function ButtonToggle:onTouchesEnd(ev)
	if self.focus then
		ev:stopPropagation()
	end
end

-- if touches are cancelled, reset the state of the button
function ButtonToggle:onTouchesCancel(ev)
	if self.focus then
		self.focus = false
		self:updateVisualState(false)
		ev:stopPropagation()
	end
end

-- if state is true show downState else show upState
function ButtonToggle:updateVisualState(state)
	self.toggled = state

	-- Modification to allow single state buttons (checkboxes etc)
	if not self.downState then
		self.upState:setVisible(true)
		return
	end

	if self.toggled then
		if self.downState then
			self.upState:setVisible(false)
			self.downState:setVisible(true)
		else
			self.upState:setVisible(true)
		end
	else
		if self.downState then
			self.upState:setVisible(true)
			self.downState:setVisible(false)
		else
			self.upState:setVisible(true)
		end
	end
end

function ButtonToggle:setToggled(bool)
	self:updateVisualState(bool)
end

function ButtonToggle:isToggled()
	return self.toggled
end

ButtonToggle Demo

-- ButtonToggle Demo
-- bg
application:setBackgroundColor(0x6c6c6c)
-- textures
local texup = Texture.new("gfx/ui/btn_01_off.png")
local texdown = Texture.new("gfx/ui/btn_01_on.png")
-- buttons
local btntoggle = ButtonToggle.new(Bitmap.new(texup), Bitmap.new(texdown))
local btntoggle2 = ButtonToggle.new(Bitmap.new(texup), Bitmap.new(texdown))
-- params
btntoggle:setScale(0.5, 0.5)
btntoggle2:setScale(0.5, 0.5)
btntoggle2:setToggled(true)
-- position
btntoggle:setPosition(16*1, 16*4)
btntoggle2:setPosition(16*6, 16*4)
-- order
stage:addChild(btntoggle)
stage:addChild(btntoggle2)
-- listeners
btntoggle:addEventListener("clicked", function()
	print("button is toggled: ", btntoggle:isToggled())
end)
btntoggle2:addEventListener("clicked", function()
	print("button2 is toggled: ", btntoggle2:isToggled())
end)

UI Buttons

---

• Main Page
• Lua API
• Main API
• Plugins