[Help] Font Awesome On Blips In Map And Radar

[kloza16]

Hi, I Want To Use Font Awesome On The Map And Radar

I Use CustomBlips ReSource And CustomBlips Code From Wiki

https://community.multitheftauto.com/index.php?p=resources&s=details&id=960

https://wiki.multitheftauto.com/wiki/Resource:Customblips

I Make A New File Name AND Its 0-Blips And In It 

meta.xml

<meta>
    <info author="Khalid Mohammed" name="0-Blips" version="1.0" type="script" />

    <script src="client.lua" type="client" />
    <script src="server.lua" type="server" />

    <file src="Images/Residential.png" />
    <file src="Images/Industrial.png" />
    <file src="Images/Medical.png" />
    <file src="Images/Military.png" />

    <script src="icons.lua" type="client" />

    <export function="getIcon" type="client" />
    <export function="getFont" type="client" />
    <export function="getIcons" type="client" />
    <export function="drawIcon" type="client" />

    <file src="fonts/fontawesome.ttf" />
    <file src="fonts/fontawesome_brands.ttf" />
    <file src="fonts/roboto.ttf" />

    <min_mta_version server="1.5.8" client="1.5.8"></min_mta_version>
    <download_priority_group>10000</download_priority_group>
</meta>

client.lua

local cache = {}
local fonts = {
	["roboto"] = true
}

local debugEnabled = false

addEvent("onIconsStart", true)
addEventHandler("onClientResourceStart", resourceRoot, function()
	local count = 0
	local startTime = getTickCount()
	for i, v in pairs(fontawesome) do
		cache[i] = v
		count = count + 1
	end
	outputDebugString("[FONTAWESOME] Loaded "..count.." icons! ("..(getTickCount()-startTime).."ms)")
	triggerEvent("onIconsStart", localPlayer)
end)

function getIcon(name)
	if cache[name] then
		return cache[name]
	else
		outputDebugString("[FONTAWESOME] "..name.." icon doesn't exists!")
	end
	return ""
end

function getIcons()
	return cache
end

local fontCache = {}
function getFont(textOrFont, size, bold)
	local tex = false
	if textOrFont == "fontawesome" then
		tex = true
		textOrFont = "fa-"
	elseif textOrFont == "fontawesome_brands" then
		tex = true
		textOrFont = "fab-"
	elseif fonts[textOrFont] then
		tex = true
	else
		tex = getIcon(textOrFont)
	end
    if(not bold)then
        bold = "normal"
    else
        bold = "bold"
    end
	if(not tex)then
		return "default", size, bold
	end
	if type(tex) == "string" or (type(tex) == "boolean" and tex) then
		local font = "default"
		local firstLetters = tostring(textOrFont:sub(0, 3))
		if firstLetters == "fab" then
			font = "fontawesome_brands"
		elseif firstLetters == "fa-" then
			font = "fontawesome"
		elseif fonts[textOrFont] then
			font = textOrFont
		end
		if not fontCache[font] then
			fontCache[font] = {}
		end
		if not fontCache[font][size] then
			fontCache[font][size] = {}
		end
        if not fontCache[font][size][bold] then
			startTime = getTickCount()
			fontCache[font][size][bold] = dxCreateFont("fonts/"..font..".ttf", size, bold == "bold")
			if fontCache[font][size][bold] then
				if debugEnabled then
					outputDebugString("[FONTAWESOME] Font <"..font.."> cache ("..size..(", "..bold)..") created! ("..(getTickCount()-startTime).."ms)")
				end
			else
				fontCache[font][size][bold] = "default"
				outputDebugString("[FONTAWESOME] Font <"..font.."> cache ("..size..(", "..bold)..") failed!")
			end
		end
		
		fontCache[font][size].lastUse = getTickCount()
		return fontCache[font][size][bold]
	else
		return "default", size, bold
	end
end

function drawIcon(x, y, icon, size, color, rx, ry, rz)
	if(not size)then size = 9 end
	if(not color)then c = tocolor(0,0,0,255) end
	dxDrawText(getIcon(icon), x, y, 0, 0, color, 1, getFont(icon, size), "left", "top", false, false, false, false, false, rx or 0, ry or 0, rz or 0)
end

local debugDraw = false
if debugDraw then
	local sx, sy = guiGetScreenSize()
	addEventHandler("onClientRender", root, function()
		local sor = 0
		local hely = 0
		for i, v in pairs(fontawesome) do
			drawIcon(20 + (hely*30), 20 + (sor*30), i, 15, tocolor(255,255,255,255))
			hely = hely + 1
			if(hely>40)then
				hely = 0
				sor = sor + 1
			end
		end
	end)
end


-- Military Police Blibs
-- LV

-- SF

-- LS
Military_PershingSquare_LosSantos_Blip1 = exports.customblips:createCustomBlip ( 1555.5009765625 , -1675.6103515625, 12, 12, dxDrawText(getIcon("fa-spinner"), sx, sy, 0, 0, tocolor(255, 255, 255), 1, getFont("fontawesome", interpolate), "center", "center"), 0 )

server.lua Nothing In It Need For This Folder

icons.lua

fontawesome = {
    --- SOLID
    ["fa-chevron-down"] = "",
    ["fa-spinner"] = "",
    ["fa-grin-beam-sweat"] = "",
    ["fa-gavel"] = "",
    ["fa-hand-point-up"] = "",
    ["fa-kiwi-bird"] = "",
    ["fa-home"] = "",
    ["fab-monero"] = "",
    ["fab-yelp"] = "",
    ["fab-creative-commons-nc-eu"] = "",
    ["fab-pied-piper"] = "",
    ["fab-gitlab"] = "",
    ["fab-cc-jcb"] = "",
}

Fonts Folder in it

fontawesome.ttf

fontawesome_brands.ttf

roboto.ttf

 

Images Folder in it No Need For This Folder

Residential.png

Industrial.png

Medical.png

Military.png

 

I Use In client.lua

customblip exports.customblips:createCustomBlip ( float worldX, float worldY, int imageWidth, int imageHeight, string imagePath, [float streamRadius = 500] )

So Its Like 

 

Military_PershingSquare_LosSantos_Blip1 = exports.customblips:createCustomBlip ( 1555.5009765625 , -1675.6103515625, 12, 12, "Images/Military.png", 0 )

Its Working In Map And Radar

I Want To Change Images To Font Awesome So

How to use:

    1. Decide if you want the icon for a DX element or a GUI one.

    2. Go on https://fontawesome.com/icons?d=gallery and search for the icon that you want (pro/free).

    3. Copy the icon UniCode that you want.

    4. Now go in your resource and type:
        
        local fontAwesomeTable = exports['fontawesome']:transform("Icon UniCode here", "category", ID, fontSize)
        -- Replace `Icon UniCode here` with the one you want. EX: for youtube icon type `transform("f167", ID)`
        -- Replace `category` with the one you would like. (Brands, Duotone, Light, Regular, Solid); You can see them on the website
        -- ID: 1 - DX Elements; 2 - GUI elements
        -- fontSize is an optional argument
        -- Replace fontawesome with this resource name

        -- https://ibb.co/CVz2frq To see where the category and UniCode is

        -- FOR DX ELEMENTS

        dxDrawText(fontAwesomeTable[1], x, y, width, height, tocolor(255, 255, 255, 255), 1, fontAwesomeTable[2])

        -- FOR GUI ELEMENTS

        local button = guiCreateButton(x, y, width, height, fontAwesomeTable[1], relative)
        guiSetFont(button, fontAwesomeTable[2])

    5. You are done!

I Now Use CustomBlips Code

Military_PershingSquare_LosSantos_Blip1 = exports.customblips:createCustomBlip ( 1555.5009765625 , -1675.6103515625, 12, 12, "Images/Military.png", 0 )

And

dxDrawText(getIcon("fa-spinner"), sx, sy, 0, 0, tocolor(255, 255, 255), 1, getFont("fontawesome", interpolate), "center", "center")

To

Military_PershingSquare_LosSantos_Blip1 = exports.customblips:createCustomBlip ( 1555.5009765625 , -1675.6103515625, 12, 12, dxDrawText(getIcon("fa-spinner"), sx, sy, 0, 0, tocolor(255, 255, 255), 1, getFont("fontawesome", interpolate), "center", "center"), 0 )

Put Its Not Working Can Some One Help

Thanks

 

 

 

 

 

 

 

 

 

I Forget Something I Take The Code From This Code

local sx, sy = guiGetScreenSize()
addEventHandler("onClientRender", root, function()
	local interpolate = interpolateBetween(15, 0, 0, 30, 0, 0, getTickCount() / 2000, "SineCurve")
	
	dxDrawText(getIcon("fa-spinner"), sx, sy, 0, 0, tocolor(255, 255, 255), 1, getFont("fontawesome", interpolate), "center", "center")
end)