interface case, acrylic ui, swap to make, lint

This commit is contained in:
Reid 2023-08-15 20:18:59 -07:00
parent f5584a9b0c
commit a5bc77030a
24 changed files with 353 additions and 92 deletions

View file

@ -4,15 +4,15 @@ import { useWorldContext } from "../contexts/worldContext"
import Padding from "ReplicatedStorage/ui/components/padding"
import { StarterGui } from "@rbxts/services"
interface hotbarProps extends Roact.JsxInstanceProperties<Frame> {
interface HotbarProps extends Roact.JsxInstanceProperties<Frame> {
Event?: Roact.JsxInstanceEvents<Frame>
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
StarterGui.SetCoreGuiEnabled(Enum.CoreGuiType.Backpack, false)
function hotbar(props: hotbarProps): Roact.Element {
const spreadableProps = { ...props } as Partial<hotbarProps>
function hotbar(props: HotbarProps): Roact.Element {
const spreadableProps = { ...props } as Partial<HotbarProps>
const { clientState } = useWorldContext()

View file

@ -3,8 +3,9 @@ import { useEffect } from "@rbxts/roact-hooked"
import { useWorldContext } from "../contexts/worldContext"
import { ContextActionService, HttpService } from "@rbxts/services"
import Padding from "ReplicatedStorage/ui/components/padding"
import Acrylic from "ReplicatedStorage/ui/components/acrylic"
interface slotProps extends Roact.JsxInstanceProperties<Frame> {
interface SlotProps extends Roact.JsxInstanceProperties<Frame> {
index: number
keycode: Enum.KeyCode
tool: Tool
@ -13,10 +14,10 @@ interface slotProps extends Roact.JsxInstanceProperties<Frame> {
Change?: Roact.JsxInstanceChangeEvents<Frame>
}
function slot(props: slotProps): Roact.Element {
function slot(props: SlotProps): Roact.Element {
const { index, keycode, tool } = props
const spreadableProps = { ...props } as Partial<slotProps>
const spreadableProps = { ...props } as Partial<SlotProps>
delete spreadableProps.index
delete spreadableProps.keycode
delete spreadableProps.tool
@ -48,37 +49,43 @@ function slot(props: slotProps): Roact.Element {
<frame
BackgroundColor3={Color3.fromHex("#11111b")}
BackgroundTransparency={
.7
.75
}
Size={new UDim2(1, 0, 1, 0)}
>
<Acrylic
radius={0}
distance={0.0001}
/>
<uiaspectratioconstraint
AspectRatio={6}
/>
<uicorner
CornerRadius={new UDim(0, 8)}
/>
<Padding
paddingY={new UDim(.3, 0)}
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.2, 0, 1, 0)}
Font={Enum.Font.GothamBold}
Text={tostring(index)}
TextScaled
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.8, 0, 1, 0)}
Position={new UDim2(.2, 0, 0, 0)}
Font={Enum.Font.Gotham}
Text={tool.Name}
TextXAlignment={Enum.TextXAlignment.Left}
TextScaled
/>
<frame BackgroundTransparency={1} Size={new UDim2(1, 0, 1, 0)}>
<Padding
paddingY={new UDim(.3, 0)}
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.2, 0, 1, 0)}
Font={Enum.Font.GothamBold}
Text={tostring(index)}
TextScaled
/>
<textlabel
TextColor3={Color3.fromHex("#cdd6f4")}
BackgroundTransparency={1}
Size={new UDim2(.8, 0, 1, 0)}
Position={new UDim2(.2, 0, 0, 0)}
Font={Enum.Font.Gotham}
Text={tool.Name}
TextXAlignment={Enum.TextXAlignment.Left}
TextScaled
/>
</frame>
</frame>
)
}