forked from rojo-rbx/rojo
b88d34c639
* Add tooltips * Fix whitespace * Avoid overloaded word canvas * Clean render function * Switch folder to fragment
84 lines
2.0 KiB
Lua
84 lines
2.0 KiB
Lua
local Rojo = script:FindFirstAncestor("Rojo")
|
|
local Plugin = Rojo.Plugin
|
|
local Packages = Rojo.Packages
|
|
|
|
local Roact = require(Packages.Roact)
|
|
local Flipper = require(Packages.Flipper)
|
|
|
|
local Assets = require(Plugin.Assets)
|
|
local bindingUtil = require(Plugin.App.bindingUtil)
|
|
|
|
local HOVER_SPRING_PROPS = {
|
|
frequency = 5,
|
|
dampingRatio = 1.1,
|
|
}
|
|
|
|
local e = Roact.createElement
|
|
|
|
local IconButton = Roact.Component:extend("IconButton")
|
|
|
|
function IconButton:init()
|
|
self.motor = Flipper.SingleMotor.new(0)
|
|
self.binding = bindingUtil.fromMotor(self.motor)
|
|
end
|
|
|
|
function IconButton:render()
|
|
local iconSize = self.props.iconSize
|
|
|
|
return e("ImageButton", {
|
|
Size = UDim2.new(0, iconSize * 1.5, 0, iconSize * 1.5),
|
|
Position = self.props.position,
|
|
AnchorPoint = self.props.anchorPoint,
|
|
|
|
Visible = self.props.visible,
|
|
LayoutOrder = self.props.layoutOrder,
|
|
ZIndex = self.props.zIndex,
|
|
BackgroundTransparency = 1,
|
|
|
|
[Roact.Event.Activated] = self.props.onClick,
|
|
|
|
[Roact.Event.MouseEnter] = function()
|
|
self.motor:setGoal(
|
|
Flipper.Spring.new(1, HOVER_SPRING_PROPS)
|
|
)
|
|
end,
|
|
|
|
[Roact.Event.MouseLeave] = function()
|
|
self.motor:setGoal(
|
|
Flipper.Spring.new(0, HOVER_SPRING_PROPS)
|
|
)
|
|
end,
|
|
}, {
|
|
Icon = e("ImageLabel", {
|
|
Image = self.props.icon,
|
|
ImageColor3 = self.props.color,
|
|
ImageTransparency = self.props.transparency,
|
|
|
|
Size = UDim2.new(0, iconSize, 0, iconSize),
|
|
Position = UDim2.new(0.5, 0, 0.5, 0),
|
|
AnchorPoint = Vector2.new(0.5, 0.5),
|
|
|
|
BackgroundTransparency = 1,
|
|
}),
|
|
|
|
HoverCircle = e("ImageLabel", {
|
|
Image = Assets.Images.Circles[128],
|
|
ImageColor3 = self.props.color,
|
|
ImageTransparency = Roact.joinBindings({
|
|
hover = self.binding,
|
|
transparency = self.props.transparency,
|
|
}):map(function(values)
|
|
return bindingUtil.blendAlpha({ 0.85, 1 - values.hover, values.transparency })
|
|
end),
|
|
|
|
Size = UDim2.new(1, 0, 1, 0),
|
|
|
|
BackgroundTransparency = 1,
|
|
}),
|
|
|
|
Children = Roact.createFragment(self.props[Roact.Children]),
|
|
})
|
|
end
|
|
|
|
return IconButton
|