- Katılım
- 3 yıl 7 ay 21 gün
- Mesajlar
- 32
- Discord
- el Fuégo#2644
Merhaba forumda konu açıldı mı bilmiyorum ama m3_inventoryhud'a tab ile açılan hotbar eklemeyi sizlerle paylaşacağım. Biraz uzun oldu ama elimden geldiğince öz anlatmaya çalıştım umarım işinize yarar. Herkese iyi forumlar.
Öncelikle m3_inventoryhud/client.lua içerisinde ki aşağıda yazan kod satırını bulalım
Öncelikle m3_inventoryhud/client.lua içerisinde ki aşağıda yazan kod satırını bulalım
Kod:
RegisterNetEvent('m3:inventoryhud:client:clearFast')
AddEventHandler('m3:inventoryhud:client:clearFast', function()
for i = 1, 5, 1 do
fastItems[i] = nil
end
end)
ve altında bulunan Citizen.CreateThread(function() satırını aşağıda verdiğim kod ile değişitirin:
Kod:
Citizen.CreateThread(function()
while true do
Citizen.Wait(0)
BlockWeaponWheelThisFrame()
HideHudComponentThisFrame(19)
HideHudComponentThisFrame(20)
DisableControlAction(2, 37, true) --Disable Tab
-- for k, v in pairs(keys) do
-- if IsDisabledControlJustReleased(2, v) then
-- UseItem(k)
-- end
-- end
if IsDisabledControlJustPressed(2,37) then
ToggleActionBar(true,fastItems)
end
if IsDisabledControlJustReleased(2, 37) then
ToggleActionBar(false)
end
end
end)
daha sonrasında aşağıda ki kodları bulun:
Kod:
refreshTargetInventory = function(target)
local name = 'Oyuncu-'..target
tradetarget = target
ESX.TriggerServerCallback("m3:inventoryhud:server:getPlayerInventory", function(data)
items = {}
inventory = data.inventory
accounts = data.accounts
if not Config.ItemWeapons.Enabled then
weapons = data.weapons
else
weapons = nil
end
if Config.UseWeight then
weight = data.weight
maxWeight = data.maxWeight
SendNUIMessage({
action = "setWeightSecondary",
text = weight.. " / " ..maxWeight.. " kg"
})
end
ve hemen üstüne aşağıda ki kodları yapıştırın.
Kod:
function ToggleActionBar(what,items)
if what then
SendNUIMessage({
action = 'showActionBar',
open = what,
fastItems = items
})
elseif not what then
SendNUIMessage({
action = 'showActionBar',
open = what,
})
end
end
Daha sonrasında m3_inventoryhud/html/css/ui.css dosyasına girelim ve aşağıda ki satırı bulalım:
Kod:
#playerInventoryFastItems {
width: 38.1%;
height: 102.9%;
z-index: 100;
float:left;
}
Bu kod satırının altına şu kodları ekleyelim:
Kod:
#ActionBar {
width: 38.1%;
height: 102.9%;
z-index: 100;
float:left;
}
sonrasında en aşağıya bu verdiğim kodları ekleyin:
Kod:
#action-bar {
display: none;
position: absolute;
left: 0;
right: 0;
bottom: 0;
margin: auto;
width: fit-content;
height: fit-content;
overflow: hidden;
z-index: 999;
}
#action-bar .slot {
max-width: 120px;
display: inline-block;
height: 145px;
background-color: rgba(0, 0, 0, 0.2);
margin: 3px;
position: relative;
border: 1px solid #666666;
transition: background-color ease-in 0.15s;
}
#action-bar .slot.used {
background-color: rgba(49, 49, 49, 0.38);
}
#action-bar .slot.empty-used {
background-color: rgba(250, 0, 0, 0.38);
}
#action-bar .slot.used {
background-color: rgba(49, 49, 49, 0.38)
}
#action-bar .slot.empty-used {
background-color: rgba(255, 0, 0, 0.38)
}
#action-bar .slot .item {
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
width: 100%;
margin-left:-10px;
min-width: 140px;
/* height: 132px; */
}
#action-bar .slot .item .item-keybind {
position: absolute;
text-align: center;
font-size: 12px;
line-height: 0px;
color: rgba(8, 8, 8, 0.8);
width: -webkit-fit-content;
width: -moz-fit-content;
width: fit-content;
top: 0;
left: 0%;
z-index: 999;
background: #fff;
padding: 10px;
padding-right: 6px;
padding-left: 6px;
font-size:14px;
border-right: 1px solid rgba(80, 80, 80, 0.8);
border-bottom: 1px solid rgba(80, 80, 80, 0.8);
text-shadow: none;
font-weight: bold;
}
/* #action-bar .slot .item .item-name {
position: absolute;
bottom: 0;
text-align: center;
padding-top: 5px;
padding-bottom: 5px;
width: 100%;
min-height: 25px;
z-index: 500;
font-size: 10px;
background-color: rgba(21, 13, 31, 0.349);
border-top: 1px solid rgba(255,255,255,0.2);
color: #fff;
font-weight: 200;
} */
#action-bar .slot .item .item-count {
position: absolute;
top: 0;
font-size: 14px;
text-align: right;
right: 5px;
height: 20px;
z-index: 500;
}
.item-namet {
text-align: center;
text-transform: uppercase;
width: 10.2vh;
font-size: 0.93vh;
position: absolute;
margin-left: 12px;
bottom: 0.56vh;
color: white;
text-shadow: -0.01vh -0.01vh 0 #000, 0.01vh -0.01vh 0 #000, -0.01vh 0.09vh 0 #000, 0.01vh 0.01vh 0 #000;
}
Sonrasında m3_inventoryhud/html/js/inventory.js dosyasına girelim ve aşağıda ki kodu bulalım:
Kod:
} else if (event.data.action == 'itemUsed') {
ItemUsed(event.data.alerts);
ve hemen altına bu kodları yapıştırın:
Kod:
} else if (event.data.action == "showActionBar") {
ActionBar(event.data.open,event.data.fastItems);
sonrasında aşağıda ki kodları bulalım:
Kod:
var alertTimer = null;
function ItemUsed(alerts) {
clearTimeout(alertTimer);
$('#use-alert').hide('fade', 500, function () {
$('#use-alert .slotn').remove();
$.each(alerts, function (index, data) {
$('#use-alert').append(`<div class="slotn alert-${index}"><div class="itemn"><div class="itemn-count">${data.qty}</div><div class="itemn-name">${data.item.label}</div></div><div class="alert-text">${data.message}</div></div>`)
.ready(function () {
$(`.alert-${index}`).find('.itemn').css('background-image', 'url(\'img/items/' + data.item.itemId + '.png\')');
});
});
});
$('#use-alert').show('fade', 500, function () {
alertTimer = setTimeout(function () {
$('#use-alert .slotn').addClass('expired');
$('#use-alert').hide('fade', 500, function () {
$('#use-alert .slotn.expired').remove();
});
}, 2500);
});
}
ve altına şu kodları ekleyelim:
Kod:
function ActionBar(toggle,items) {
if (toggle === true) {
$('#action-bar').html('');
for (let i = 0; i < 5; i++) {
if (items[i] != null) {
$('#action-bar').append(`<div class="slot slot-${i}"><div class="item"><div class="item-count">${items[i].count}</div><div class="item-namet">${items[i].label}</div><div class="item-keybind">${items[i].slot}</div></div></div>`);
$(`.slot-${i}`).find('.item').css('background-image', 'url(\'img/items/' + items[i].name + '.png\')');
} else {
$('#action-bar').append(`<div class="slot slot-${i}" data-empty="true"><div class="item"><div class="item-count"></div><div class="item-namet">Boş</div><div class="item-keybind">${i + 1}</div></div></div>`);
$(`.slot-${i}`).find('.item').css('background-image', 'none');
}
}
$("#action-bar").fadeIn(150);
} else if(toggle === false) {
$("#action-bar").fadeOut(150, function(){
$("#action-bar").html("");
});
}
}
Sonrasında m3_inventoryhud/html/ui.html dosyasını açıp aşağıdaki satırı bulalım:
Kod:
<div id="use-alert"></div>
ve hemen altına bu kodu yapıştırın
Kod:
<div id="action-bar"></div>
Bu kadar... Yapamayan arkadaşlara yardımcı olurum.
İyi Forumlar.