Adjusting editbox width

Benalish · 01-11-23, 10:24 AM

Finally I created my combobox template. Only one thing missing: since the dropdown menu width is automatic, how can I make the editbox and the dropdown menu have the same width?

Code:

<Frame name="combobox_template" virtual="true">
	<Size x="1" y="1" />
	<Frames>
		<EditBox name="$parent_flageditbox" parentKey="flageditbox">
			<Size x="75" y="20" />
			<Anchors>
				<Anchor point="LEFT" >
					<Offset>
						<AbsDimension x="27" y="5"/>
					</Offset>
				</Anchor>
			</Anchors>
			<Backdrop bgFile="Interface\Buttons\WHITE8X8" edgeFile="Interface\Tooltips\UI-Tooltip-Border" tile="true">
				<BackgroundInsets>
					<AbsInset left="2" right="2" top="2" bottom="2" />
				</BackgroundInsets>
				<EdgeSize>
					<AbsValue val="10"/>
				</EdgeSize>
			</Backdrop>
			<Scripts>
				<OnLoad>
					self:EnableKeyboard(false)
					self:EnableMouse(false)
					self:SetTextInsets(0,0,-3,0)
					self:SetBackdropColor(0, 0, 0, 0.75)
					self:SetBackdropBorderColor(0.3, 0.3, 0.3, 1)
				</OnLoad>
			</Scripts>
			<FontString justifyH="CENTER" justifyV="TOP" inherits="GameFontNormal"/>
			<Frames>
				<Button name="$parentFlagButton" parentKey="button" enableMouse="true">
					<Size>
						<AbsDimension x="24" y="24"/>
					</Size>
					<Anchors>
						<Anchor point="LEFT" relativeTo="$parent" relativePoint="RIGHT">
							<Offset x="-3" y="0"/>
						</Anchor>
					</Anchors>
					<Scripts>
						<OnMouseDown> flag_dd_OnClick() </OnMouseDown>
					</Scripts>
					<HighlightTexture file="Interface/Buttons/UI-Common-MouseHilight" alphaMode="ADD"/>
					<NormalTexture file="Interface/CHATFRAME/UI-ChatIcon-ScrollDown-Up" setAllPoints="true"/>
					<PushedTexture file="Interface/CHATFRAME/UI-ChatIcon-ScrollDown-Down" setAllPoints="true"/>
				</Button>
			</Frames>
		</EditBox>
		<Frame name="flag_dd" inherits="UIDropDownMenuTemplate" enableMouse="true" hidden="true">
			<Anchors>
				<Anchor point="TOP"/>
			</Anchors>
			<Scripts>
				<OnLoad>
					UIDropDownMenu_Initialize(self, flag_dd_OnLoad, "MENU");
				</OnLoad>
			</Scripts>
		</Frame>
	</Frames>
</Frame>

Lua Code:

CreateFrame("Frame", nil, UIParent, "combobox_template")
main:SetSize(100,25)
main:SetPoint("CENTER")
 
local flags = { "player", "target", "focus", "pet", "mouseover", "arena1", "arena2" }
 
function flag_dd_OnLoad(self)
    for _, flag in ipairs(flags) do
        local info = UIDropDownMenu_CreateInfo()
        info.text = flag
        function info.func(button)
            main.flageditbox:SetText(flag)
        end
        UIDropDownMenu_AddButton(info)
    end
 end
 
function flag_dd_OnClick()
    ToggleDropDownMenu(1, nil, flag_dd, main.flageditbox, 0, 1);
end

Fizzlemizz · 01-11-23, 10:42 AM

I would do it the other way and have the list portion set the the width of the editbox when it's shown. More flexible for different size entries.

Benalish · 01-11-23, 11:17 AM

I tried

Code:

<OnShow>
   self:SetWitdh(75)
</OnShow>

both

Code:

<OnShow>
   UIDropDownMenu_SetWidth(self, 75, 0)
</OnShow>

and seems doesn't works

Fizzlemizz · 01-11-23, 12:11 PM

Lua Code:

function flag_dd_OnClick()
    ToggleDropDownMenu(1, nil, flag_dd, main.flageditbox, 0, 1);
    UIDropDownMenu_SetWidth(flag_dd, self:GetParent():GetWidth())
end

or something like that.

Benalish · 01-12-23, 08:16 AM

Originally Posted by Fizzlemizz

Lua Code:

function flag_dd_OnClick()
    ToggleDropDownMenu(1, nil, flag_dd, main.flageditbox, 0, 1);
    UIDropDownMenu_SetWidth(flag_dd, self:GetParent():GetWidth())
end

or something like that.

Thank you! One last thing: do you know UIDeropDownMenu bgFile and highlight texture file path?

Fizzlemizz · 01-12-23, 09:06 AM

There isn't a backdrop. This is the definition

Code:

	<Frame name="UIDropDownMenuTemplate" virtual="true">
		<Size x="40" y="32"/>
		<Layers>
			<Layer level="ARTWORK">
				<Texture name="$parentLeft" parentKey="Left" file="Interface\Glues\CharacterCreate\CharacterCreate-LabelFrame">
					<Size x="25" y="64"/>
					<Anchors>
						<Anchor point="TOPLEFT" x="0" y="17"/>
					</Anchors>
					<TexCoords left="0" right="0.1953125" top="0" bottom="1"/>
				</Texture>
				<Texture name="$parentMiddle" parentKey="Middle" file="Interface\Glues\CharacterCreate\CharacterCreate-LabelFrame">
					<Size x="115" y="64"/>
					<Anchors>
						<Anchor point="LEFT" relativeKey="$parent.Left" relativePoint="RIGHT"/>
					</Anchors>
					<TexCoords left="0.1953125" right="0.8046875" top="0" bottom="1"/>
				</Texture>
				<Texture name="$parentRight" parentKey="Right" file="Interface\Glues\CharacterCreate\CharacterCreate-LabelFrame">
					<Size x="25" y="64"/>
					<Anchors>
						<Anchor point="LEFT" relativeKey="$parent.Middle" relativePoint="RIGHT"/>
					</Anchors>
					<TexCoords left="0.8046875" right="1" top="0" bottom="1"/>
				</Texture>
				<FontString parentKey="Text" name="$parentText" inherits="GameFontHighlightSmall" wordwrap="false" justifyH="RIGHT">
					<Size x="0" y="10"/>
					<Anchors>
						<Anchor point="RIGHT" relativeKey="$parent.Right" x="-43" y="2"/>
					</Anchors>
				</FontString>
			</Layer>
			<Layer level="OVERLAY">
				<Texture parentKey="Icon" name="$parentIcon" hidden="true">
					<Size x="16" y="16"/>
					<Anchors>
						<Anchor point="LEFT">
							<Offset x="30" y="2"/>
						</Anchor>
					</Anchors>
				</Texture>
			</Layer>
		</Layers>
		<Frames>
			<DropDownToggleButton parentKey="Button" name="$parentButton" inherits="UIDropDownMenuButtonScriptTemplate" motionScriptsWhileDisabled="true" >
				<Size x="24" y="24"/>
				<Anchors>
					<Anchor point="TOPRIGHT" relativeKey="$parent.Right" x="-16" y="-18"/>
				</Anchors>
				<NormalTexture name="$parentNormalTexture" parentKey="NormalTexture" file="Interface\ChatFrame\UI-ChatIcon-ScrollDown-Up">
					<Size x="24" y="24"/>
					<Anchors>
						<Anchor point="RIGHT"/>
					</Anchors>
				</NormalTexture>
				<PushedTexture name="$parentPushedTexture" parentKey="PushedTexture" file="Interface\ChatFrame\UI-ChatIcon-ScrollDown-Down">
					<Size x="24" y="24"/>
					<Anchors>
						<Anchor point="RIGHT"/>
					</Anchors>
				</PushedTexture>
				<DisabledTexture name="$parentDisabledTexture" parentKey="DisabledTexture" file="Interface\ChatFrame\UI-ChatIcon-ScrollDown-Disabled">
					<Size x="24" y="24"/>
					<Anchors>
						<Anchor point="RIGHT"/>
					</Anchors>
				</DisabledTexture>
				<HighlightTexture name="$parentHighlightTexture" parentKey="HighlightTexture" file="Interface\Buttons\UI-Common-MouseHilight" alphaMode="ADD">
					<Size x="24" y="24"/>
					<Anchors>
						<Anchor point="RIGHT"/>
					</Anchors>
				</HighlightTexture>
			</DropDownToggleButton>
		</Frames>
		<Scripts>
			<OnHide>
				CloseDropDownMenus();
			</OnHide>
		</Scripts>
	</Frame>