This library includes components very similar to the default VGUI components (like "DFrame" and "DButton"), but they actually look good (thank god). They also have some unique cases that you'll have to pay attention to when using this library.
This library is ONLY for use with Dynamic Devs addons, not for personal use unless in certain circumstances (this is subject to change). When packaging the library with your addon, delete the readme, test folder, and any other git-specific things in the folder.
Utilize new branches branch to make new commits. Once you have reviewed your own code, create a pull request to be reviewed by JoshJOkayguy which (if accepted) will be merged into the main
branch. You should make new pull requests for every feature you complete.
All variables that are used more than once should be named using PascalCase, if it's a minor value that only gets used once right after declaration it may be in snake_case.
Commits from this point forwards should begin with the type of commit (feat for features, fix for bug fixes, etc.) then a descriptive yet brief commit message. If more is needed utilize commit descriptions.
Whether or not to draw the header.
Sets the title.
Blur: Whether or not to blur the background behind the frame. Leave empty or falsy to return current blur value.
Minimize: (boolean) True to minimize, false to maximize.
Can only use on frames and panels (only recommended to use on the main frame, but if you want to try it on some child panel then don't cry about it if something breaks).
Animates out when hovered, has an indicator of the active tab that moves to wherever the button for the aforementioned tab is.
After creating a tab, you can add stuff to the actual panel of the tab by indexing the "Tabs" table of the sidebar element. Example:
local sidebar = vgui.Create("DynSidebar", frame)
sidebar:AddTab("The First Tab", SomeMaterial, true)
local btn = sidebar.Tabs["The First Tab"]:Add("DButton")
btn:SetText("Click Me")
btn:Center()
Name: Name of the tab to reference by as well as what shows up in the menu.
Material: Material for the icon using the Material() function. Can not be nil.
First: Whether or not this is the tab you want to be already active when the menu first opens. DO NOT SET THIS TO TRUE ON MULTIPLE TABS
There is currently a bug where you can't make the buttons too tall or else they will look weird github issue with image. Sorry but I don't have a fix right now, and frankly the buttons should never be that big anyways.
Sets the background color, the shadow is automatically generated.
Self explanatory. Useful if you have a dark button color.
Sets the title of the button. Make sure you add the "D", I have that there so that I don't mess with the default label behavior.
A toggleable switch.
Determines whether or not to start the switch toggled. Not required. If no arguments are passed (or the argument is falsy) it will simply return whether or not the switch is toggled, like a "Get" function.
Pretty tooltips that appear when certain elements are hovered. Attach it to an element using the following method.
Frame: Usually the "main" panel. The tooltip just needs a place to live. In a normal UI workflow, we would place this within the tab (see above) that we want it to appear in.
Element: The element that we want the tooltip to appear on when we hover.
Message: The message that you want to appear when the tooltip is activated.
Width (optional*): Sets the width of the tooltip. *If the message takes up more than 100 pixels of width, you need to set this to accomadate for the extra space.
Note: Does NOT support multiple lines or super fucking long messages, use a notification or something if you need to say something
big.
Note 2: Usually 20 pixels of horizontal padding works best when setting the width.
Most of the normal DTextEntry functions that you actually use will be available to use on this. If it's not and you need it, make a feature request or some shit.
You shouldn't make the height go over 40 if you don't want text centering issues, in fact if you just set the width the default height will be 40. Also, setting the text color after text has been written may not work as intended.
Sets/Gets the color of the accent bar on the bottom of the text entry.
Similar to derma query, creates a new "confirmation prompt" with customizable text that accepts callbacks when confirmed.
ttl: The title at the top of the frame, if nil the text will default to "Are You Sure?"
text: The text in the center of the frame, make this concise yet clear. If nil the text will default to "Please confirm this action."
callback: The callback for when the "Confirm Action" button is clicked.
closecallback: Same thing as above but for when the "cancel" button is clicked. Both of these options aren't required but it
s pointless not to have at least one of them.
Returns the frame that the prompt is held within.