I'd like to know more on how this is done. I'm having trouble understanding how ROBLOX Battle did it even while looking at the source code.
What is entailed in getting a 3D object in a Gui? I see it has something to do with Billboard guis in the player gui, but I'm hoping someone can give me a few tips here.
Thanks.
I was originally not going to answer this question, but I feel that enough people are confused about the topic that I must. ROBLOX's Games team used the a function in the following code to convert the object's position into a vector2. They then cloned an ImageLabel to that position. There was never a 3D object in the GUI. Here is the code, please note that it was made by the Games team, not me.
local function PointToScreenSpace(at) local point = Workspace.CurrentCamera.CoordinateFrame:pointToObjectSpace(at) local aspectRatio = ScreenGui.AbsoluteSize.X / ScreenGui.AbsoluteSize.Y local hfactor = math.tan(math.rad(Camera.FieldOfView)/2) local wfactor = aspectRatio*hfactor -- local x = (point.x/point.z) / -wfactor local y = (point.y/point.z) / hfactor -- return Vector2.new(ScreenGui.AbsoluteSize.X*(0.5 + 0.5*x), ScreenGui.AbsoluteSize.Y*(0.5 + 0.5*y)) end PlayerGotCoin_Event.Changed:connect(function() if PlayerGotCoin_Player.Value == Player then local at = PlayerGotCoin_Location.Value -- local pos = PointToScreenSpace(at) local pointSet = { PointToScreenSpace(at + Vector3.new( 0.75, 0, 0.75)); PointToScreenSpace(at + Vector3.new(-0.75, 0, 0.75)); PointToScreenSpace(at + Vector3.new(-0.75, 0, -0.75)); PointToScreenSpace(at + Vector3.new( 0.75, 0, -0.75)); } local minx, maxx, miny, maxy = math.huge, -math.huge, math.huge, -math.huge for _, pt in pairs(pointSet) do if pt.x > maxx then maxx = pt.x end if pt.x < minx then minx = pt.x end if pt.y > maxy then maxy = pt.y end if pt.y < miny then miny = pt.y end end local width = maxx - minx local height = maxy - miny local avg = (width+height)/2 width = avg height = avg -- make the coin GUI local coinGui = Create'ImageLabel'{ Name = 'Coin'; Image = 'http://www.roblox.com/asset/?id=121148238'; BackgroundTransparency = 1; ZIndex = 1; } if at ~= Vector3.new(0,0,0) and pos.x >= 0 and pos.y >= 0 and pos.x <= ScreenGui.AbsoluteSize.x and pos.y <= ScreenGui.AbsoluteSize.y then -- onscreen coinGui.Position = UDim2.new(0, pos.x-width/2, 0, pos.y-height/2) coinGui.Size = UDim2.new(0, width, 0, height) else -- offscreen, just show it comming from the center of the screen coinGui.Position = UDim2.new(0.5, -20, 0.5, -20) coinGui.Size = UDim2.new(0, 40, 0, 40) end coinGui.Parent = ScreenGui -- tween the coin to the side display, and show the shownamount --Delay(0.5, ShowAmount) local function endTweenFunc() coinGui:Destroy() MyCoinCount.Value = MyCoinCount.Value + 1 end coinGui:TweenSizeAndPosition(UDim2.new(0, 70, 0, 70), UDim2.new(0, 9, 0.4, 50), 'In', 'Quad', 0.9, true, endTweenFunc) end end)
Not sure, but I guess its not inside the gui. There is a frame around the 3D character, that is actually a normal model with a part behind as background, they just changed the camera position. If you notice, there is no other 3D space being shown in that screen, what means it's not a gui.
I'll tell you how they did it.
It's not possible to put a 3D object in a GUI because ROBLOX can only render one 3D space at once.
They placed a decal background as the "GUIs" and placed the bricks in front of the decal. They then locked your camera to be looking at it to simulate having a 3D GUI.