Wave 1 Button Texture Research

Summary

The SWF extractions contain stone/gray button textures that match the original LCE main menu appearance. The buttons are NOT red/brown -- they are gray cobblestone-textured rectangles with a thin dark outline border and a blue/purple highlighted variant for the selected/hover state.

The button system uses a 3-layer composite approach:

Norm (normal state fill) -- gray stone texture
Over (hover/selected state fill) -- blue/purple tinted stone texture
Outline -- bright yellow selection indicator (rendered as a border around the active button)

CORRECT Button Textures (HD - skinHDGraphics)

These are the files we should use. Located in: /Users/cole/Downloads/minecraft_swf_pngs/Minecraft.Client/Common/Media/skinHDGraphics/

File	Dimensions	Description	Visual
`191_FJ_MainMenuButton_Norm.png`	600x60	Normal state -- GRAY STONE texture with subtle dark edges. This is the correct stone/gray button.	Gray cobblestone rectangle
`189_MainMenuButton_Over.png`	600x60	Hover/selected state -- BLUE/PURPLE tinted stone texture. This is what highlights when selected.	Blue-purple cobblestone rectangle
`190_MainMenuButton_Outline.png`	606x66	Selection outline -- BRIGHT YELLOW border (3px larger on each side). Rendered behind the selected button.	Solid yellow rectangle (used as glow/outline mask)

ListButton (Used in list menus, settings, etc.)

File	Dimensions	Description	Visual
`185_ListButton_Norm.png`	600x90	Normal state -- same gray stone texture, taller than MainMenuButton	Gray cobblestone, 90px tall
`183_ListButton_Over.png`	600x90	Hover/selected state -- blue/purple tinted	Blue-purple cobblestone, 90px tall
`184_ListButton_Outline.png`	606x96	Selection outline -- yellow border	Yellow rectangle outline

LayoutButton (Smaller UI buttons)

File	Dimensions	Description	Visual
`188_Layout_Button_Bmp.png`	210x60	Normal state -- gray stone, smaller width	Gray cobblestone, 210px wide
`186_LayoutButton_Over.png`	210x60	Hover/selected -- blue/purple tinted	Blue-purple cobblestone
`187_LayoutButton_Outline.png`	216x66	Selection outline -- yellow border	Yellow rectangle

LeaderboardButton (Wide, thinner variant)

File	Dimensions	Description	Visual
`173_LeaderboardButton_Norm.png`	1005x60	Normal state -- gray stone, very wide	Gray cobblestone, 1005px wide
`172_LeaderboardButton_Over.png`	1005x60	Hover/selected -- blue/purple tinted	Blue-purple cobblestone

SD Equivalents (skinGraphics - for reference)

Located in: /Users/cole/Downloads/minecraft_swf_pngs/Minecraft.Client/Common/Media/skinGraphics/

These are 2/3 scale versions (SD resolution):

File	Dimensions	HD Equivalent
`197_FJ_MainMenuButton_Norm.png`	400x40	191 (HD 600x60)
`195_MainMenuButton_Over.png`	400x40	189 (HD 600x60)
`196_MainMenuButton_Outline.png`	404x44	190 (HD 606x66)
`191_ListButton_Norm.png`	400x60	185 (HD 600x90)
`189_ListButton_Over.png`	400x60	183 (HD 600x90)
`190_ListButton_Outline.png`	404x64	184 (HD 606x96)
`194_Layout_Button_Bmp.png`	140x40	188 (HD 210x60)
`192_LayoutButton_Over.png`	140x40	186 (HD 210x60)
`193_LayoutButton_Outline.png`	144x44	187 (HD 216x66)
`180_LeaderboardButton_Norm.png`	670x40	173 (HD 1005x60)
`179_LeaderboardButton_Over.png`	670x40	172 (HD 1005x60)

How LCE Renders Buttons (Composite System)

The original LCE SWF renders buttons as a layered composite:

Base layer: The _Norm texture is always drawn (gray stone fill)
Hover layer: When selected/hovered, the _Over texture replaces or overlays the norm (blue/purple tint)
Outline layer: The _Outline texture (yellow) is drawn BEHIND the selected button as a highlight border. The outline is 6px wider and 6px taller (3px padding on each side), creating a visible selection ring.

The button text is rendered ON TOP of these textures using the SWF label system (white text, with black shadow).

DefineSprite Directories (NOT Useful)

The DefineSprite button directories in the skin/ directory contain only tiny placeholder frames:

DefineSprite_125_fourj.Buttons.FJ_MenuButton_Normal/ -- 30 frames, all 2x2 px
DefineSprite_67_fourj.Buttons.FJ_MenuButton_Small/ -- 30 frames, all 2x2 px
DefineSprite_113_fourj.Buttons.FJ_ListButton_Normal/ -- 30 frames, all 10x16 px
DefineSprite_82_fourj.Buttons.FJ_ListButton_Small/ -- 30 frames, all 6x6 px
DefineSprite_61_FJ_Button_Outline/ -- 4 frames, all 1x1 px

These are animation timeline placeholders from the SWF, not usable rendered textures. The actual button appearance comes from the bitmap assets listed above.

Files Already in Project

The project at /Users/cole/Documents/LegacyVulkEdition/Assets/ui/skinHDGraphics/ already has copies of all the HD button textures:

191_FJ_MainMenuButton_Norm.png (gray stone - normal)
189_MainMenuButton_Over.png (blue/purple - hover)
190_MainMenuButton_Outline.png (yellow - selection outline)
185_ListButton_Norm.png
183_ListButton_Over.png
184_ListButton_Outline.png
188_Layout_Button_Bmp.png
186_LayoutButton_Over.png
187_LayoutButton_Outline.png
172_LeaderboardButton_Over.png
173_LeaderboardButton_Norm.png

Key Findings

The correct button textures ARE the MainMenuButton files -- 191_FJ_MainMenuButton_Norm.png is gray/stone colored, matching the original LCE screenshot. These are NOT red/brown.
The stone appearance comes from a subtle cobblestone noise pattern baked into the PNG. Looking at the actual pixels, the _Norm textures have a slightly noisy gray pattern (reminiscent of Minecraft cobblestone) with slightly darker edges creating a beveled look.
The "Over" (hover) textures have a blue/purple tint applied to the same cobblestone noise pattern. This creates the highlighted button look when selected with a controller.
The yellow "Outline" textures are selection indicators, not part of the button face itself. They render as a bright border behind the currently selected button.
The textures are already present in the project -- the issue is likely in how they're being rendered/composited in the UI code, not in the texture files themselves.

Recommended Button Rendering Approach

For the main menu buttons at 1080p:

Use 191_FJ_MainMenuButton_Norm.png (600x60) as the default button background
Use 189_MainMenuButton_Over.png (600x60) as the hover/selected background
Use 190_MainMenuButton_Outline.png (606x66) drawn BEHIND and CENTERED on the selected button for the selection glow
Scale buttons proportionally to fit the target resolution
The dark outline visible on the buttons is part of the _Norm and _Over textures themselves (the edges are darker/beveled)

7.1 KiB Raw Blame History