Graal Forums  

Go Back   Graal Forums > Development Forums > Graphic Design
FAQ Members List Calendar Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Search this Thread Display Modes
  #1  
Old 09-01-2008, 12:41 AM
Programmer Programmer is offline
Coder
Programmer's Avatar
Join Date: Jan 2008
Location: -78.464422, 106.837328
Posts: 449
Programmer has a spectacular aura aboutProgrammer has a spectacular aura about
Send a message via AIM to Programmer Send a message via MSN to Programmer Send a message via Yahoo to Programmer
Custom GUI Image Tutorial

I figured this fell more into Graphics rather than scripting, so I placed it here. This is a small tutorial to teach you how to create a Graal GUI skin from scratch. Criticisms/Comments welcome. Rep if you like it/found it helpful.

Attached Images
   
Attached Files
File Type: txt guicode.txt (876 Bytes, 316 views)
__________________
- Iᴀɴ Zɪᴍᴍᴇʀᴍᴀɴ

Last edited by Programmer; 09-01-2008 at 12:44 AM.. Reason: Noticed a small transparency issue in the final image.
Reply With Quote
  #2  
Old 09-01-2008, 12:59 AM
Switch Switch is offline
o.o
Switch's Avatar
Join Date: Jan 2007
Location: Philadelphia
Posts: 3,038
Switch has a spectacular aura about
Send a message via MSN to Switch
Very nice
Now more pixelers will know how to make guis
++rep
__________________
Oh squiggly line in my eye fluid. I see you lurking there on the peripheral of my vision.
But when I try to look at you, you scurry away.
Are you shy, squiggly line?
Why only when I ignore you, do you return to the center of my eye?
Oh, squiggly line, it's alright, you are forgiven.
Reply With Quote
  #3  
Old 09-01-2008, 01:01 AM
cbk1994 cbk1994 is offline
the fake one
cbk1994's Avatar
Join Date: Mar 2003
Location: San Francisco
Posts: 10,718
cbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond repute
Send a message via AIM to cbk1994
Very nice!
__________________
Reply With Quote
  #4  
Old 09-01-2008, 06:11 AM
MrAnonymous_P2P MrAnonymous_P2P is offline
Retired Oldbie
MrAnonymous_P2P's Avatar
Join Date: Oct 2006
Location: Cambodia
Posts: 722
MrAnonymous_P2P is an unknown quantity at this point
lol Nice one.

You already taught me this
Reply With Quote
  #5  
Old 09-01-2008, 07:01 AM
Demisis_P2P Demisis_P2P is offline
Kanto League Champion
Demisis_P2P's Avatar
Join Date: Jan 2005
Posts: 2,357
Demisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud of
Do these support alphatransparencies?
__________________
Reply With Quote
  #6  
Old 09-01-2008, 07:08 AM
Programmer Programmer is offline
Coder
Programmer's Avatar
Join Date: Jan 2008
Location: -78.464422, 106.837328
Posts: 449
Programmer has a spectacular aura aboutProgrammer has a spectacular aura about
Send a message via AIM to Programmer Send a message via MSN to Programmer Send a message via Yahoo to Programmer
Quote:
Originally Posted by Demisis_P2P View Post
Do these support alphatransparencies?
They have full support for alpha transparencies.
__________________
- Iᴀɴ Zɪᴍᴍᴇʀᴍᴀɴ
Reply With Quote
  #7  
Old 09-01-2008, 07:38 AM
Oni Oni is offline
perfection
Oni's Avatar
Join Date: Aug 2008
Location: Los Angeles
Posts: 108
Oni has a spectacular aura about
nice tutorial
Reply With Quote
  #8  
Old 09-01-2008, 08:26 AM
Demisis_P2P Demisis_P2P is offline
Kanto League Champion
Demisis_P2P's Avatar
Join Date: Jan 2005
Posts: 2,357
Demisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud of
Here is my take on a loosely vista-themed one.

It made it with Era's gui template so it's much smaller than yours.

It looks pretty good in game, but I can't change text colors, etc. so it doesn't fit perfectly.
Attached Images
 
__________________
Reply With Quote
  #9  
Old 09-01-2008, 08:28 AM
cbk1994 cbk1994 is offline
the fake one
cbk1994's Avatar
Join Date: Mar 2003
Location: San Francisco
Posts: 10,718
cbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond reputecbk1994 has a reputation beyond repute
Send a message via AIM to cbk1994
Quote:
Originally Posted by Demisis_P2P View Post
Here is my take on a loosely vista-themed one.

It made it with Era's gui template so it's much smaller than yours.

It looks pretty good in game, but I can't change text colors, etc. so it doesn't fit perfectly.
profile.fontcolor ?
__________________
Reply With Quote
  #10  
Old 09-01-2008, 08:30 AM
Demisis_P2P Demisis_P2P is offline
Kanto League Champion
Demisis_P2P's Avatar
Join Date: Jan 2005
Posts: 2,357
Demisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud of
Quote:
Originally Posted by cbk1994 View Post
profile.fontcolor ?
I'm not staff.
I'm just overwriting graphics locally to test them in game.
__________________
Reply With Quote
  #11  
Old 09-01-2008, 08:47 AM
WanDaMan WanDaMan is offline
Master Tux
WanDaMan's Avatar
Join Date: Aug 2002
Location: England, United Kingdom
Posts: 5,571
WanDaMan is a jewel in the roughWanDaMan is a jewel in the rough
Send a message via MSN to WanDaMan
I'd love to see a classic one :O! (Default Q Menu like this!)

+rep
__________________
V$:CONFL16T
Reply With Quote
  #12  
Old 09-01-2008, 08:49 AM
[email protected] sid.gottlieb@googlemail.com is offline
Banned
Join Date: Mar 2008
Posts: 861
sid.gottlieb@googlemail.com will become famous soon enough
i did a classic one on old vs, remember??

rep++ [you don't need the profile= part, btw]
Reply With Quote
  #13  
Old 09-01-2008, 02:39 PM
Demisis_P2P Demisis_P2P is offline
Kanto League Champion
Demisis_P2P's Avatar
Join Date: Jan 2005
Posts: 2,357
Demisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud ofDemisis_P2P has much to be proud of
I edited the tabs and the scrollbar images a bit too, so this is what the News gui looks like for me now on Era.
Attached Thumbnails
Click image for larger version

Name:	tabbbb.png
Views:	290
Size:	235.1 KB
ID:	45754  
__________________
Reply With Quote
  #14  
Old 09-01-2008, 03:26 PM
Inverness Inverness is offline
Incubator
Inverness's Avatar
Join Date: Aug 2004
Location: Houston, Texas
Posts: 3,613
Inverness is a jewel in the roughInverness is a jewel in the rough
I see that you have a single pixel on the bottom left that represents the background. What you're doing is just making Graal's job more difficult because it has to tile a single pixel rather than a larger set, which takes more CPU time.

If you want a solid colored background simply remove the background pixel from the image and set opaque to true in the Window's profile then change fillcolor accordingly.

Attached is the image I'm using for the simple gray window theme based on VGUI in the Source Engine. The image has 80 percent opacity.

And combined with this profile, it makes the window background to what I want it to be without having to put it in the image file.
Graal Script Code:
  new GuiBlueWindowProfile("GuiGrayWindowProfile") {
    
this.bitmap "guigray80_window.png";
    
this.fonttype "Verdana";
    
this.fontsize 14;
    
this.fontstyle "b";
    
this.fontcolor = {255255255};
    
this.fontcolorna = {176176176};
    
this.fontcolorhl = {000};
    
this.opaque true;
    
this.fillcolor = {888888255 0.80};
    
this.fillcolorhl = {2551640};
  } 
The result is also attached.
Attached Thumbnails
Click image for larger version

Name:	graygui1.jpg
Views:	132
Size:	10.9 KB
ID:	45756  
Attached Images
 
__________________
Reply With Quote
  #15  
Old 09-01-2008, 03:39 PM
Crow Crow is offline
ǝɔɐɹq ʎןɹnɔ
Crow's Avatar
Join Date: Dec 2006
Location: Germany
Posts: 5,153
Crow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond reputeCrow has a reputation beyond repute
I don't think Graal is tiling the single pixel. Theres a "tile" variable, I'm pretty sure it's being stretched when this is set to false.
__________________
Reply With Quote
Reply

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +2. The time now is 11:32 AM.


Powered by vBulletin® Version 3.8.3
Copyright ©2000 - 2019, Jelsoft Enterprises Ltd.
Copyright (C) 1998-2008 Linux cyberjoueurs All Rights Reserved.