surface.DrawPoly template?

Hello, I was wondering if anyone has a template or any examples for surface.DrawPoly?
I’m having tons of trouble using it and I really don’t want to stick with surface.DrawRect and making a crappy looking HUD.
So if you are willing to release a template of some sorts for me to follow along that would be greatly appreciated.
Thanks.

EDIT: It would be nice if you can show how to make it kind of like this

Notice the curves in the HUD?

Basically, you have to do it in proper sequence. That one would look like:

[lua]
1 2
3 4
5
7 6

[/lua]

Wow, had it properly coded but for some reason there’s still a bug so it didn’t show…

Here’s 2 ways to do it:

DRAW as 1 piece ( Poly may not contain concave areas )
[lua]local myMat = Material( “vgui/alpha-back.vtf” );

hook.Add( “HUDPaint”, “PolyTest”, function( )
local _h = ScrH( ) - 50
local _w = ScrW( ) / 2
local _poly = {
{ x = 0, y = _h, u = 0, v = 0 }, // This is 1
{ x = _w / 2, y = _h, u = 0, v = 0 }, // 2
{ x = _w / 2 + 15, y = _h+15, u = 0, v = 0 }, // 3
{ x = _w - 15, y = _h+15, u = 0, v = 0 }, // 4
{ x = _w, y = _h+15+15, u = 0, v = 0 }, // 5
{ x = _w, y = _h + 50, u = 0, v = 0 }, // 6
{ x = 0, y = _h + 50, u = 0, v = 0 }, // 7
};
surface.SetMaterial( myMat )
surface.SetDrawColor( Color( 255, 255, 255, 255 ) )
surface.DrawPoly( _poly )[/lua]

Draw in CHUNKS ( )
[lua]local myMat = Material( “vgui/alpha-back.vtf” );

hook.Add( “HUDPaint”, “PolyTest”, function( )
local _h = ScrH( ) - 50
local _w = ScrW( ) / 2
local _poly = {
{ x = 0, y = _h, u = 0, v = 0 }, // This is 1
{ x = _w / 2, y = _h, u = 0, v = 0 }, // 2
{ x = _w / 2 + 15, y = _h+15, u = 0, v = 0 }, // 3
{ x = _w - 15, y = _h+15, u = 0, v = 0 }, // 4
{ x = _w, y = _h+15+15, u = 0, v = 0 }, // 5
{ x = _w, y = _h + 50, u = 0, v = 0 }, // 6
{ x = 0, y = _h + 50, u = 0, v = 0 }, // 7
};
surface.SetMaterial( myMat )
surface.SetDrawColor( Color( 255, 255, 255, 255 ) )

for k, v in pairs( _poly ) do
	if ( k > 1 ) then
		// Draws the outline NOT NEEDED but shows you what is happening.
		surface.DrawLine( v.x, v.y, _poly[ k - 1 ].x, _poly[ k - 1 ].y )

		// Fills it in - this draws it in chunks - kind of like little squares - 
		// I may have messed the perfect order up because there's a bug where poly doesn't work unless something has been drawn in that hook before then it worked, then I played....
		surface.DrawPoly( { 
			{ x = _poly[ k - 1 ].x, y = _poly[ k - 1 ].y, u = 0, v = 0 };
			{ x = v.x, y = v.y, u = 0, v = 0 };
			{ x = v.x, y = _h + 50, u = 0, v = 0 };
			{ x = _poly[ k - 1 ].x, y = _h + 50, u = 0, v = 0 };
		} )
	end

	// To show you that it works like my diagram above in text, change DEBUG_TEXT for some text you made.
	draw.SimpleTextOutlined( k, "DEBUG_FONT", v.x + 15, v.y - 15, COLOR_WHITE, TEXT_ALIGN_CENTER, TEXT_ALIGN_CENTER, 1, COLOR_BLACK ) 
end

end )
[/lua]

Essentially though, to make a poly you put in x / y coords, it plays connect the dots and there you go. If you want to TEXTURE IT, the u and v vars tells the poly how many times to repeat the texture along the vertical and horizonal axis.

Hope this helps! If it resolved your question please feel free to mark this topic as solved in the upper left corner next to the reply button; otherwise please feel free to continue asking questions :slight_smile:

Both of these examples yields the same shape you are looking at. Here’s an image, I moved the text 15 right, 15 up to show the shape…

http://cloud-2.steampowered.com/ugc/633043075520065770/3DD7A638C50EA0774F965C20CBC42E2395E04D6F/

Just make a texture instead, it’ll look nicer in the end.

Wow, Thank you so much Acecool! This helped me so much. Idk what to say besides thanks. Wow this helped me alot. Time to make awesome huds! :smiley: Thanks man! :smiley:

You can also apply textures to a poly and have it repeat. You can resize the texture and make it smaller by increasing the number of u / v., or make it larger by decreasing that size to the point of filling the entire area by stretching the texture.

A custom texture would definitely look good, but creating shapes this way is a nice way to ensure it stays crisp ( Although there is a way to ensure textures stay crisp and can be resized; but I am unsure how, maybe brandonj4 can post that for reference? )

Remember: With poly’s it’s a game of connect the dots, they must be in the proper sequence!