gui work

[scifi]

well im very new to lua scripts but i always thinked what the heck it shouldnt be that hard to add just a texture to a certain part off a screen


well i looked into some of pures work (just for learning purposes)
didnt copied args work

i modified some labels and saw how it worked then made my way around the file

then ill have to credited regrets red ui framework it has very mutch potential
his tooltip widget and build menu i used and modifyed

instead of just making predifined spaces like the already known uis you have there and then add a texture that aplys to that place

i made the other way around make a nice texture that fits and then add the recource panels into the texture with no background colour

its on a gadjet format..... (im knew at this maybe i could do it on a widget who knows........)



i mean anything i did here isnt good i mean its far from perfect i just took several lua files modifyed some stuff and voila it works
the texture i did it myself
this is just an inspiration to other people that are better than me
that a gui isnt that hard to code and texture imo

so get to work xD

heres some stuff i made




its just a show off of a possibility

and ingame its all more high resolution
its a screenshot uploaded as a jpeg

so low res =/
but ingame im using a png it looks good i think

[MidKnight]

A solid mockup is good, though you're using way too many textures in the GUI. also, a set of icons for the basic commands (move, hold fire, attack, etc.) would do wonders. Want me to make a set?

[scifi]

yeah i agree well if you can ill be happy to use it =D

[KaiserJ]

i dunno about too many textures, that looks pretty freaking awesome.

but +1 to the custom buttons for added win.

[Master-Athmos]

Looks fantastic!
As always I'm interested in performance though - can you do a comparison between having Spring's standard UI on and then yours and tell the fps differences?

[aegis]

you can use the actions' cursors for the actions... many rts games actually do so

[SinbadEV]

way too many textures in the GUI

based on my understanding of his post, he's using 4 there, how is that too many? :D

@scifi any reason your not posting the LUA files so we can figure out exactly what you are doing?

[MidKnight]

Er, I should clarify. The textures are a bit busy. That's all.

Also: Yay! Icons! I have something productive to do! I'm on it. If you give me some guidelines that'd be even better.

[scifi]

thanks for the interest but i need to test this thing first

1- for the first 3 seconds its the spring like prespective
then the new gui
2-fps ill test it
3- the lua file isnt done and i quinda complicate it a bit

must test if the texture doesnt shift if i change the resolution and sutch things


and the thing is its a texture with the aproximate size of the screen
and you just aply textures to it
the rest is transparancy. its simple to use and modify though i changed the recource disposition so its diferent than the normal one

i used regrets widgets to aply new build bars and the tooltip
so i just changed the border colour and the background colour to look transparent and its a fairly easy process
then i changed the position
x and y coordinates that are mentioned on regrest buildbar menu lua files and some more stuff.........

the lua file that contains the new recource management and the background image as i call it is below
it isnt finished and i dont recomend using it at ANY FORM
mostly because it needs
regrets modifyed widgets
red ui framework to look good it works but it looks messy without those
and needs touchup

this is by no means a lua guide =/ its just a file to look up to
its nothing special

Code: Select all

function gadget:GetInfo()
	return {
		name = "Simple GUI",
		desc = "AR GUI",
		author = "scifi",
		date = "March 2009",
		license = "Free",
		layer = 0,
		enabled = true,
	}
end

local InitialWait = 0
local Frame, TeamNum, TeamSide
local currentLevelEnergy, storageEnergy, pullEnergy, incomeEnergy, expenseEnergy
local currentLevelMetal, storageMetal, pullMetal, incomeMetal, expenseMetal
local eco

if (gadgetHandler:IsSyncedCode()) then

function gadget:GameFrame(f)

	if (f < InitialWait) then return
	else
		local temp = Spring.GetTeamList()
		for _,Team in ipairs(temp) do
			currentLevelEnergy, storageEnergy, pullEnergy, incomeEnergy, expenseEnergy = Spring.GetTeamResources(Team, 'energy')			
			currentLevelMetal, storageMetal, pullMetal, incomeMetal, expenseMetal = Spring.GetTeamResources(Team, 'metal')
	        eco = Spring.SendCommands("tooltip 0", "resbar 0")
			
			currentLevelEnergy = math.floor(currentLevelEnergy)
			currentLevelMetal = math.floor(currentLevelMetal)
			
			incomeEnergy = math.floor(incomeEnergy)
			incomeMetal = math.floor(incomeMetal)
	
			Frame = f
			
            SendToUnsynced("Resources", Team, 0, 0, incomeEnergy, incomeMetal, currentLevelEnergy, currentLevelMetal, storageEnergy, storageMetal, Frame)
		end
	if InitialWait == 1 then InitialWait = InitialWait + 31 else InitialWait = InitialWait + 32 end
	end
end
	
else

local team, metalPercent, energyPercent, metalChange, energyChange, oldMetal, oldEnergy, metalStorage, energyStorage = 0,0,0,0,0,0,0,0,0
local metal, energy, energySent, metalSent = 0,0,0,0
local IncomeEnergy, IncomeMetal = 0,0
local MetalValueRed, MetalValueGreen
local EnergyValueBlue, EnergyValueRed, EnergyValueGreen

local MetalXMin, MetalXMax, MetalYMin, MetalYMax
local EnergyXMin, EnergyXMax, EnergyYMin, EnergyYMax
local BackGroundXMin, BackGroundYMin, BackGroundXMax, BackGroundYMax
local buttonBackXMin, buttonBackYMin, buttonBackXMax, buttonBackYMax
local EnergyStorageX, EnergyStorageY, MetalStorageX, MetalStorageY
local EnergyChangeX, EnergyChangeY, MetalChangeX, MetalChangeY
local textSize, background, buttonBack
local backgroundoffset = 0
local backgroundheight = 0

local frame = 0

local GL_ONE = GL.ONE
local GL_ZERO = GL.ZERO
local GL_DST_COLOR = GL.DST_COLOR
local GL_LESS = GL.LESS
local glTexRect       	= gl.TexRect
local glColor         	= gl.Color
local glDepthTest     	= gl.DepthTest
local glTexture       	= gl.Texture
local glText          	= gl.Text
local glBlending      	= gl.Blending
local glGetViewSizes 	= gl.GetViewSizes
local IsGUIHidden  = Spring.IsGUIHidden
local GetLocalTeamID = Spring.GetLocalTeamID

buttonBack = ':anl:bitmaps/ui/ButtonTop.png'
background = ':anl:bitmaps/ui/NewGUItex.png'
backgroundheight = 1.396667 --current height in pixels, divided by 1200

function gadget:RecvFromSynced(name, Team, TeamNum, TeamSide, incomeEnergy, incomeMetal, currentLevelEnergy, currentLevelMetal, storageEnergy, storageMetal, Frame)

	if (name == 'Resources') then
		team = GetLocalTeamID()
		
		if team == Team then
		
			local x,y = glGetViewSizes()
			textSize = 15 * (x / 1600)
						
			IncomeEnergy = incomeEnergy
			IncomeMetal = incomeMetal
			
			metalStorage = storageMetal
			energyStorage = storageEnergy

			metal = currentLevelMetal
			energy = currentLevelEnergy
			
			metalPercent = metal / metalStorage
			energyPercent = energy / energyStorage

			metalChange = oldMetal - metal
			energyChange = oldEnergy - energy
			
			frame = Frame
			
			if energyChange < 0 then energyChange = (energyChange * -1) else energyChange = energy - oldEnergy end
			if metalChange < 0 then metalChange = (metalChange * -1) else metalChange = metal - oldMetal end

			BackGroundXMin = 0 
			BackGroundXMax = x 

			BackGroundYMin = 0
			BackGroundYMax = y * backgroundheight   

			buttonBackXMin = x * 0.84 -- 1600 - 256 / 1600 
			buttonBackYMin = y * backgroundheight

			buttonBackXMax = x
			buttonBackYMax = y * (backgroundheight * 2)
			
			MetalChangeX = x * 0.513
			MetalChangeY = y * 0.0785
			
			EnergyChangeX = x * 0.513
			EnergyChangeY = y * 0.0335		
			
			MetalX = x * 0.668
			MetalY = y * 0.0785
			
			EnergyX = x * 0.668
			EnergyY = y * 0.0335
			
			MetalStorageX = x * 0.752
			MetalStorageY = y * 0.0565
            
			EnergyStorageX = x * 0.752
			EnergyStorageY = y * 0.0125  

			MetalXMin = x * (0.405)
			MetalXMax = x * (0.405 + (0.328 * metalPercent))--0.015
			MetalYMin = y * (0.0615)
			MetalYMax = y * (0.0675) --0.0045
			--if (metalPercent) > 0.5 then MetalValueRed = 1.0 - (metalPercent) else MetalValueRed = 1.0 end
   			--if (metalPercent) < 0.5 then MetalValueGreen = 0.0 + (metalPercent) else MetalValueGreen = 1.0 end

			EnergyXMin = x * (0.405)
			EnergyXMax = x * (0.405 + (0.328 * energyPercent))
			EnergyYMin = y * (0.0175)
			EnergyYMax = y * (0.0235)
			--if (energyPercent) > 0.5 then EnergyValueGreen = 1.0 - (energyPercent) else EnergyValueGreen = 1.0 end
   			--if (energyPercent) < 0.5 then EnergyValueBlue = 0.0 + (energyPercent) else EnergyValueBlue = 1.0 end
   			
   			oldMetal = metal
   			oldEnergy = energy
		end
  	end
end

function gadget:DrawScreenEffects()
	if frame > 30 then
		if IsGUIHidden() == false then
	    	-------------------------------------------------------------BackGround
		glColor(1,1,1,1)	
		glTexture(background)
		glTexRect(BackGroundXMin,BackGroundYMin,BackGroundXMax,BackGroundYMax)

		glTexture(buttonBack)
		glTexRect(buttonBackXMin,buttonBackYMin,buttonBackXMax,buttonBackYMax)
		-------------------------------------------------------------BackGround

		-------------------------------------------------------------Resource Bars
		glTexture('bitmaps/ui_bar.tga')
		glColor(0.0, 1.0, 1.0, 1.0)
		glTexRect(MetalXMin, MetalYMin, MetalXMax, MetalYMax)

		glColor(1.0, 0.9, 0.0, 1.0)
		glTexRect(EnergyXMin, EnergyYMin, EnergyXMax, EnergyYMax)
		-------------------------------------------------------------Resource Bars
		
		-------------------------------------------------------------Text
		glColor(1.0,0.6,0,1.0)
		glText(metal, MetalX, MetalY, textSize, "n")
		
		glColor(1.0,0.6,0,1.0)
		glText(metalStorage, MetalStorageX, MetalStorageY, textSize, "n")

		glColor(1.0,0.6,0,1.0)
		--concatenate operation ".." == "concatenate these two things"
		glText(metalChange.." / "..IncomeMetal, MetalChangeX, MetalChangeY, textSize, "n")
		
		glColor(0.0,0.8,1.0,1.0)
		glText(energy, EnergyX, EnergyY, textSize, "n")
		
		glColor(0.0,0.8,1.0,1.0)
		glText(energyStorage, EnergyStorageX, EnergyStorageY, textSize, "n")

		glColor(0.0,0.8,1.0,1.0)
		--another concatenate operation
		glText(energyChange.." / "..IncomeEnergy, EnergyChangeX, EnergyChangeY, textSize, "n")
		end
	end
end

end

this is by no means all my work its parts from regrets, args
and my work
this is the gadget it is specified the texture location and sutch

[Jazcash]

Looks nice, I like it a lot. However, I would prefer the current GUI for one solid reason. Transparency.

I can see through most elements of the current GUI and with some I can even select through them. Having GUI elements without taking up precious game space is a big plus.

[SinbadEV]

Looks nice, I like it a lot. However, I would prefer the current GUI for one solid reason. Transparency.

I can see through most elements of the current GUI and with some I can even select through them. Having GUI elements without taking up precious game space is a big plus.

True, but not as pretty... and when it comes to interface design there are more people who want aesthetics then functionality... that said, it would be an intelligent design decision by any mod developer choosing to use a pretty interface to also not lock out the more functional version we have come to prefer and ensure that any needed LUA elements they add are supported by both the pretty and utilitarian views.

[aegis]

could also hold a key to make your interface fade out when mouse'd over and pass clicks through.

[scifi]

yeah for example the build menu could fade out

the comands sutch as reclaim move.........already do fade with the redui
build menu making the texture fade as well would enable a more eaasy interface to play with

[Jazcash]

could also hold a key to make your interface fade out when mouse'd over and pass clicks through.

Like this idea a lot. However, you've got to remember most of the GUI elements have clickable functions anyway so I dunno how hard it would be to make only the non interactive parts of the GUI would just become clickable through images.

[Neddie]

Well, that does mean I'm not entirely crazy.

Keep it up, it looks perfect for one of the *A projects. Hopefully somebody will adopt it.

[aegis]

only the non interactive parts of the GUI would just become clickable through images.

it's easy - whether the mousehook returns true or false is whether the click passes through, and the mousehook determines this by whether the mouse is over a clickable element.

[Jazcash]

I learn stuffz!

[Argh]

Looks cool, glad to see SimpleGUI finally getting used for something. Looking forward to seeing what it's like when complete.

[Satirik]

not perfect but looks promising, at least it's one of the first attempt to make a general textured gui for spring !! cool

[Caydr]

Looks cool. Remember that Spring players are very big fans of the interface being small(ish) and transparent though, it allows you to see more of the game. Also, people won't use it if it eats up too much CPU time.