Well I'm moving this tutorial over from Half-Life Coding Index to Wavelength since HLCI is hosted at Wavelength anyways, and HLCI is an index, not a tutorial. Feel free to PM/E-Mail me about any mistakes, but if you have any problems with VGUI please ask your questions on the Half-Life coding forum. I haven't touched Half-Life in about a year aside from updating my website, so I'm sure there are more qualified people who are willing to help on the forum. This tutorial also requires you have finished Part 1 and 2! It's a continuation. If you don't do parts 1 and 2 first, this will not work.
In this tutorial, we will add one image and an editbox to our menu. We know you've seen an image before, but what about an editbox? This is a feature that is not commonly used in VGUI menus (at the time I'm writing this). This may be because it may not have been fully finished, as I can't seem to figure out how to change it's colours, and it's selecting is a bit off. However, with a little tweak, it is good enough to use in this menu, at least so that you can know about it, because it can be very useful when getting information from the user. Let's update our CFirstMenu class in vgui_TeamFortressViewport.h:
| | | class CFirstMenu : public CMenuPanel
{
private:
CommandButton *m_pCancelButton;
CTransparentPanel *m_pPanel;
Label *m_pTitle;
CommandButton *m_pSpeak;
int m_iShowText;
Label *m_pText;
CommandButton *m_pShowButton;
CommandButton *m_pHideButton;
TextEntry *m_pEditbox;
CImageLabel *m_pMyPicture;
public:
CFirstMenu(int iTrans, int iRemoveMe, int x, int y, int wide, int tall);
void SetActiveInfo( int iShowText );
void setVisible( bool visible );
}; |
The first line we added (TextEntry) is our editbox. TextEntry means a space to enter text. Make sense? The next line is our picture, an Image Label. As you may have noticed, there is a new function added too. I'll explain this later, do not worry.
Open up vgui_FirstMenu.cpp and we'll add a few more lines at the bottom of our constructor to make our editbox and picture actually show up:
| | | m_pHideButton->setParent( m_pPanel );
m_pHideButton->addInputSignal( new CHandler_MenuButtonOver(this, 0) );
m_pEditbox = new TextEntry( "Testing!", XRES(200), YRES(230), XRES(230), 17);
m_pEditbox->setVisible( true );
m_pEditbox->setParent( m_pPanel );
m_pMyPicture = new CImageLabel( "hlci", XRES(1), YRES(181) );
m_pMyPicture->setVisible( true );
m_pMyPicture->setParent( m_pPanel );
} |
Okay... for m_pEditbox, we are creating a TextEntry box with the string "Testing!" inside, at those coordinates. With the default font, a height of 17 would be most appropriate (as you'll see in your test). The next two lines should be familiar by now. For m_pMyPicture, we are creating a new image label at those coordinates, yet we see a string called "hlci". For our test, do NOT change this value. I'll now explain how this string works. The "hlci" string will go through a number of commands to get our picture. Firstly, it will create the WHOLE filename. In other words, it won't look for "hlci" in your vgui folder. If you are in 640x480 mode or higher, it will actually look for "640_hlci.tga", and if it's lower than that, it will look for "320_hlci.tga". The files will be searched in your mod's gfx/vgui folder. I used to be hosting these pictures on 3ddownloads back when I was at valveworld, but they were lost when valveworld was removed. You basically need to make a 32-bit TGA to make it compatible with VGUI. Your best bet is using Adobe Photoshop, since MS Paint can't do it.
Now, if you tried the code already, you will have noticed something: You couldn't build the dll. Yes, well, simple reason: The TextEntry header hasn't been included yet. So, add this line to the rest of the #includes in the top of the vgui_TeamFortressViewport.h file:
| | | #include<VGUI_ScrollBar.h>
#include<VGUI_Slider.h>
#include<VGUI_TextEntry.h>
|
NOW, if you tried to build it, you will have noticed three things: 1. Wow, that picture's pretty cool! ;) 2. Nice editbox! 3. I'M PRESSING KEYS AND IT'S MAKING ME DO THINGS. Yes, that's what I thought at first. Yet, it's preventable. The most simple way to do this, is to modify how CFirstMenu's setVisible function works. That's why we declared it in our class above. Add this function to the bottom of vgui_FirstMenu.cpp:
| | | void CFirstMenu :: setVisible( bool visible )
{
if (visible)
ClientCmd("unbindall\n");
else
ClientCmd("exec config.cfg\n");
CMenuPanel::setVisible(visible);
} |
If we are making our menu visible, we will unbind all the keys so that when the user presses something, nothing will happen. If we are setting it to be hidden, re-exec config.cfg which binds all of our keys back. Afterwards, call the usual setVisible function so that we can proceed with the normal actions.
For extra excitement, let's make it so that our show and hide buttons will show us the text in our editbox! Nifty, huh? Replace our SetActiveInfo function with the following:
| | | void CFirstMenu :: SetActiveInfo( int iInfo )
{
if (iInfo >= 0 && iInfo <= 1)
{
if (!iInfo)
{
m_pText->setVisible( false );
}
else
{
char temp[128];
m_pEditbox->getText(0,temp,128);
m_pText->setText(temp);
m_pText->setVisible( true );
}
}
} |
Notice I kind of changed it around a bit. This makes it a bit easier to add more active info things for different buttons. If iInfo == 0, we will hide our label, as usual. But if it equals 1, we will make a string called temp, get the text from editbox with a maxlength of 128, set our label's text to the text in temp, and show it. Try it out! Nifty 2x!! There you have it for images and editboxes!
That's it for part for the tutorial! I had originally planned to add more, but it turned out all the neat things I wanted to write about were not functional, such as the 3D window, message boxes (which do work but aren't good at all), and writing VGUI applications, which should be possible but isn't quite. I had asked Valve about helping me with VGUI apps and they said they were going to write something on it, so who knows. That was about over a year ago. I guess it doesn't matter since VGUI2 can do it, but we can't dev for it yet.
Until VGUI2,
this has been rkzad. |
