Make Moving draw.RoundedBox

I’m not sure how to make moving an info box like when we take an ammo on the ground and show the amount of clip on the middle of the screen.

[lua]draw.RoundedBox( 6, ScrW() / 2 + 360, ScrH() / 2 + 220, 170, 25, Color( 0, 0, 0, 100 ) ) – Primary Ammo Type Box[/lua]

http://img209.imageshack.us/img209/2857/ammocollect.png

I’m pretty sure it uses the Derma_Anim function, but unfortunately there’s no documentation on that and I’m too lazy to go find it in the Luabin. However, there are some convenient functions for animation, such as panel.SizeTo and panel.MoveTo. These functions only work with derma, though. If you just want to animate a rounded box, you could set the width to a variable, say “x”, then increase/decrease x every frame in the HUDPaint hook or in an outside timer.

thanks it could be usefull but I’m not sure about where I can find the code for make the increase/decrease but I can try with panel.MoveTo .

This may also help
http://luabin.foszor.com/code?scope=&search=Derma_Anim

[editline]01:08PM[/editline]

and it works like this
[lua]

function Derma_Anim( name, panel, func )

    local anim = {}
    anim.Name = name
    anim.Panel = panel
    anim.Func = func

   setmetatable( anim, DermaAnimation )

    return anim

end
[/lua]

Fish, try to explain how it works, instead of taking a large snippet of code that you don’t even understand.

It works like a timer, so example this will fade in upon opening:

[lua]
function PANEL:Init()
self.animIn = Derma_Anim( “OpenAnim”, self, self.OpenAnim )

    self.animIn:Start( 0.05 )

end

function PANEL:OpenAnim( anim, delta, data )

    if ( anim.Started ) then
            self:SetAlpha( 0 )
    end
   
    if ( anim.Finished ) then
            self:SetAlpha( 255 )
    return end
   
    self:SetAlpha( 255 * delta )

end
[/lua]

The animation last’s for 0.05 second, delta is a “0-1” value, it increases with the time, example the time of the animation is “0.025” the delta would be “0.5”. You get the idea, if not just ask me to explain it better.

Thanks but the things I don’t understand is the self. … and the anim or animIn:Start

what does the self. and the animIn , how I can define it ?

Well self is just the PANEL, since it’s inside the function “self” will autodefine it’s self as PANEL.

and about the animIn.

That’s the name he decided to give to his animation. You can call it banjo if you want. :banjo:

sorry wrong post

It’s normal when I have inserted the code it does nothing ?
[lua]cLabel = {}; – We need a table to define and store our custom control in.
cLabel.Text = nil; – The text we are displaying
cLabel.TextAlign = nil; – How to align the text; 0 means left, 1 means center.
cLabel.Font = nil;
cLabel.Color = nil;

– Initialize function; this is called when the object is created
function cLabel:Init()
– Inside these functions, we use self.(property), because we are referencing
self.Text =""; –
self.TextAlign = 0; – unless otherwise specified, we will want to align left.
self.Font = “ScoreboardText”; – This is our default font
self.Color = Color( 255,255,255,255 );
end
function cLabel:Paint()
– This is where we do all the painting.
return true; – Returning true tells the renderer that it doesn’t need to call the Paint() function of the object that we derived this object from.
end

– Properties
– Here, we are basically making it so that instead of accessing the variables directly,
– we are making it so that we can check to make sure that the value is valid for what
– we are setting. Also, if you need to use it with a timer, you can use these instead of
– creating other functions.
function cLabel:SetText( text )
self.Text = text; – Make sure that you’re using self!
end
function cLabel:GetText()
return self.Text;
end

function cLabel:SetAlign( align )
if ( align == 0 || align == 1 ) then
self.TextAlign = align;
else
Msg( “Invalid align [” … align … "] passed to control!
" );
end
end
function cLabel:GetAlign()
return self.TextAlign;
end

function cLabel:SetFont( font )
self.Font = font;
end
function cLabel:GetFont()
return self.Font;
end

function cLabel:SetColor( color )
if ( string.lower( type( color ) ) != “color” ) then
Msg( "Invalid color passed to label!
" );
return false;
else
self.Color = color;
end
end
function cLabel:GetColor()
return self.Color;
end

function cLabel:Paint()
– This is where we do all the painting.
if ( self.TextAlign == 1 ) then
x = self:GetWide() / 2;
else
x = 0;
end

– Arguments: Text, Font, X Pos, Y Pos, Color, Text Alignment
draw.DrawText( self.Text, self.Font, x, 0, self.Color, self.TextAlign );
return true;
end

vgui.Register( “cLabel”, cLabel, “Panel” );

cButton = {};

cButton = {};
cButton.OnMouseDown = nil; – More on these two later
cButton.OnMouseUp = nil;
cButton.State = nil;
– States:
– 0: Idle
– 1: User is holding down the mouse on this control

function cLabel:Init()
self.animIn = Derma_Anim( “OpenAnim”, self, self.OpenAnim )

    self.animIn:Start( 0.05 )

end

function cLabel:OpenAnim( anim, delta, data )

	if ( anim.Started ) then
            self:SetAlpha( 0 )
    end
   
    if ( anim.Finished ) then
            self:SetAlpha( 255 )
    return end
   
    self:SetAlpha( 255 * delta )

end

function cButton:Init()
– onmousedown and onmouseup are still nil.
self.State = 0;
self.Text = “Click Me!”; – For a button, we may as well have a different text.
end

function cButton:Paint()
return true; – We don’t want the cLabel:Paint() function being called.
end

function cButton:OnMousePressed( m )
end
function cButton:OnMouseReleased( m )
end

cButton.OnMouseDown = nil; – More on these two later
cButton.OnMouseUp = nil;

function cButton:OnMousePressed( m )
self.State = 1; – Mouse Down
if ( self.OnMouseDown != nil ) then
self.OnMouseDown( m );
end
end
function cButton:OnMouseReleased( m )
self.State = 0; – Mouse Up
if ( self.OnMouseUp != nil ) then
self.OnMouseUp( m );
end
end

function cButton:Paint()
– Draw Border
if ( self.State == 1 ) then
surface.SetDrawColor( 0,0,200,255 ); – Blue
surface.DrawRect( 0,0,self:GetWide(),self:GetTall() );
else – The only other state should be 0, but if it’s something else for some weird reason, we still want to draw it.
surface.SetDrawColor( 200,100,0,255 ); – Orange
surface.DrawRect( 0,0,self:GetWide(),self:GetTall() );
end

– Draw Inside
surface.SetDrawColor( 100,100,100,255 );
surface.DrawRect( 4,4,self:GetWide()-8,self:GetTall()-8 );
– Draw Text
– Text, font, x, y, color, align
draw.DrawText( self.Text, self.Font, self:GetWide() / 2, 3, Color( 255,255,255,255 ), 1 );
return true;
end

cFrame = vgui.Create( “frame” );
cFrame:SetSize( 300,200 );
cFrame:SetPos( 50,50 );
cFrame:PostMessage( “SetTitle”, “text”, “cLabel Test” );
cFrame:SetVisible( true );

cLabelTest = vgui.Create( “cLabel”, cFrame );
cLabelTest:SetSize( 100, 25 );
cLabelTest:SetPos( 50, 50 );
cLabelTest:SetText( “Test” );
cLabelTest:SetAlign( 1 );

cButtonTest = vgui.Create( “cButton”, cFrame );
cButtonTest:SetSize( 100, 25 );
cButtonTest:SetPos( 55, 75 );
cButtonTest:SetText( “Click Me!” );
cButtonTest.OnMouseDown = function() cLabelTest:SetText(“Mouse Down!”) end
cButtonTest.OnMouseUp = function() cLabelTest:SetText(“Mouse Up!”) end

vgui.Register( “cButton”, cButton, “cLabel” );
[/lua]

You need to be able to quick scan your work for key words.

[lua]
function cLabel:Init()
self.animIn = Derma_Anim( “OpenAnim”, self, self.OpenAnim )

    self.animIn:Start( 0.05 )  

end

function cLabel:OpenAnim( anim, delta, data )

    if ( anim.Started ) then  
            self:SetAlpha( 0 )  
    end  
     
    if ( anim.Finished ) then  
            self:SetAlpha( 255 )  
    return end  
     
    self:SetAlpha( 255 * delta )  

end
[/lua]

Is in the wrong place. And: “cLabel:Init()” was already defined further up.

Ok I trying to understand the OpenAnim but I don’t understand.

I have read the half of programming of Lua like Lua-Pil I understand better Custom Table but I can’t figure out how to set in my code.

The thing I need to do is it to add in my code
[lua]function cLabel:SetAlpha()
end
function cLabel:GetAlpha()
end[/lua]

And after what I’m supposed to add inside of this ?

[lua]
function cLabel:SetAlpha(alpha)
clr = self:GetColor()
self:SetColor(self:GetColor(clr.r, clr.g, clr.b, alpha)
end
function cLabel:GetAlpha()
return self:GetColor().a or 255
end
[/lua]

Thanks but you forgot an ) after alpha , ( I think )

It’s normal if it do nothing ?

And I have an error to


 Warning: vgui.Create failed to create the VGUI component (cLabel)
autorun\client\MyFrame.lua:119: attempt to index global 'cLabelTest' (a nil value) 

[lua]
cLabel = {};
cLabel.Text = nil;
cLabel.TextAlign = nil;
cLabel.Font = nil;
cLabel.Color = nil;

function cLabel:Init()

self.Text ="";
self.TextAlign = 0;
self.Font = "ScoreboardText";
self.Color = Color( 255,255,255,255 );
self:SetPaintBackground( true )
self:SetPaintBorderEnabled( false )
self:SetPaintBackgroundEnabled( false )

self.animIn = Derma_Anim( "OpenAnim", self, self.OpenAnim )
self.animIn:Start( 0.05 )

end

function cLabel:Paint()

return true;

end

function cLabel:SetAlpha(alpha)
clr = self:GetColor()
self:SetColor(self:GetColor(clr.r, clr.g, clr.b, alpha))
end

function cLabel:GetAlpha()
return self:GetColor().a or 255
end

function cLabel:OpenAnim( anim, delta, data )

    if ( anim.Started ) then
            self:SetAlpha( 0 )
    end

    if ( anim.Finished ) then
            self:SetAlpha( 255 )
    return end

    self:SetAlpha( 255 * delta )

end

function cLabel:SetText ( text )
self.Text = text;
end
function cLabel:GetText()
return self.Text;
end

function cLabel:SetAlign( align )

if ( align == 0 || align == 1 ) then
	self.TextAlign = align;
else
	Msg( "Invalid align [" .. align .. "] passed to control!

" );
end
end
function cLabel:GetAlign()
return self.TextAlign;
end

function cLabel:SetFont( font )
self.Font = font;
end
function cLabel:GetFont()
return self.Font;
end

function cLabel:SetColor( Color )
if ( string.lower( type( color ) ) != “color” ) then
Msg( "Invalid color passed to label!
" );
return false;
else
self.Color = color;
end
end
function cLabel:GetColor()
self.Color = color;
end

function cLabel:Paint()

if ( self.TextAlign == 1 ) then
	x = self:GetWide() / 2;
else
	x = 0;
end


draw.DrawText( self.Text, self.Font, x, 0, self.Color, self.TextAlign );
return true;

end

cFrame = vgui.Create( “frame” );
cFrame:SetSize( 250,180 );
cFrame:SetPos( 100,100 );
cFrame:PostMessage( “SetTitle”, “text”, “cLabel Test” );
cFrame:SetVisible( true );

cLabelTest = vgui.Create( “cLabel”, cFrame );
cLabelTest:SetSize( 50, 10 );
cLabelTest:SetPos( 24, 70 );
cLabelTest:SetText( “Test” );
cLabelTest:SetAlign( 1 );

vgui.Register( “cLabel”, cLabel, “Panel” );
[/lua]

he didnt forget to add anything, he added something by mistake



self:SetColor(self:GetColor(clr.r, clr.g, clr.b, alpha))


should be:



self:SetColor(clr.r, clr.g, clr.b, alpha)


Also:

“vgui.Register( “cLabel”, cLabel, “Panel” );”

Add that before the cFrame section, instead of at the end otherwise your making something that doesn’t exist.

Good no error :slight_smile: thanks

But Just the little problem with the anim for the fade alpha, is not working.

self.animIn:Start( 0.05 )

Replace that with something like:

self.animIn:Start( 3 )

You’ll notice it then.

Nope nothing again. And again thanks for taking your time for help me :slight_smile:

[lua]
cLabel = {};
cLabel.Text = nil;
cLabel.TextAlign = nil;
cLabel.Font = nil;
cLabel.Color = nil;

function cLabel:Init()

self.Text ="";
self.TextAlign = 0;
self.Font = "ScoreboardText";
self.Color = Color( 255,255,255,255 );


self.animIn = Derma_Anim( "OpenAnim", self, self.OpenAnim )
self.animIn:Start( 3.00 )  -- I changed Here.

end

function cLabel:Paint()

return true;

end

function cLabel:SetAlpha(alpha)
clr = self:GetColor()
self:GetColor(clr.r, clr.g, clr.b, alpha)
end

function cLabel:GetAlpha()
return self:GetColor().a or 255
end

function cLabel:OpenAnim( anim, delta, data )

    if ( anim.Started ) then
            self:SetAlpha( 0 )
    end

    if ( anim.Finished ) then
            self:SetAlpha( 255 )
    return end

    self:SetAlpha( 255 * delta )

end

function cLabel:SetText ( text )
self.Text = text;
end
function cLabel:GetText()
return self.Text;
end

function cLabel:SetAlign( align )

if ( align == 0 || align == 1 ) then
	self.TextAlign = align;
else
	Msg( "Invalid align [" .. align .. "] passed to control!

" );
end
end
function cLabel:GetAlign()
return self.TextAlign;
end

function cLabel:SetFont( font )
self.Font = font;
end
function cLabel:GetFont()
return self.Font;
end

function cLabel:SetColor( Color )
if ( string.lower( type( color ) ) != “color” ) then
Msg( "Invalid color passed to label!
" );
return false;
else
self.Color = color;
end
end
function cLabel:GetColor()
self.Color = color;
end

function cLabel:Paint()

if ( self.TextAlign == 1 ) then
	x = self:GetWide() / 2;
else
	x = 0;
end


draw.DrawText( self.Text, self.Font, x, 20, self.Color, self.TextAlign );
return true;

end

vgui.Register( “cLabel”, cLabel, “Panel” );

cFrame = vgui.Create( “frame” );
cFrame:SetSize( 253,272 );
cFrame:SetPos( 630,300 );
cFrame:PostMessage( “SetTitle”, “text”, “Hud Ammo Modifier” );
cFrame:SetVisible( true );

BoxCategoryPistol = vgui.Create(“DCollapsibleCategory”, cFrame)
BoxCategoryPistol:SetPos( 25,50 )
BoxCategoryPistol:SetSize( 200, 50 ) – Keep the second number at 50
BoxCategoryPistol:SetExpanded( 1 ) – Expanded when popped up
BoxCategoryPistol:SetLabel( “Pistol Box hud” )

CategoryList = vgui.Create( “DPanelList” )
CategoryList:SetAutoSize( true )
CategoryList:SetSpacing( 8 )
CategoryList:EnableHorizontal( false )
CategoryList:EnableVerticalScrollbar( true )

BoxCategoryPistol:SetContents( CategoryList ) – Add our list above us as the contents of the collapsible category

DCheckBoxHide = vgui.Create( "DCheckBoxLabel" )
DCheckBoxHide:SetText( "Hide ?" )
DCheckBoxHide:SetConVar( "BoxColor" )
DCheckBoxHide:SetValue( 1 )
DCheckBoxHide:SizeToContents()

CategoryList:AddItem( DCheckBoxHide ) – Add the above item to our list

SliderBoxY = vgui.Create( "DNumSlider" )
SliderBoxY:SetSize( 150, 50 ) -- Keep the second number at 50
SliderBoxY:SetText( "Pistol Box Y" )
SliderBoxY:SetMin( 0 )
SliderBoxY:SetMax( 600 )
SliderBoxY:SetDecimals( 0 )
SliderBoxY:SetConVar( "BoxMoveY" )

CategoryList:AddItem( SliderBoxY )

SliderBoxX = vgui.Create( "DNumSlider" )
SliderBoxX:SetSize( 150, 50 ) -- Keep the second number at 50
SliderBoxX:SetText( "Pistol Box X" )
SliderBoxX:SetMin( 0 )
SliderBoxX:SetMax( 980 )
SliderBoxX:SetDecimals( 0 )
SliderBoxX:SetConVar( "BoxMoveX" )

CategoryList:AddItem( SliderBoxX )[/lua]