Jump to content

Mejor forma de hacer un dxDrawRectangle button?


Anzo

Recommended Posts

Buenas, Actualmente estoy usando isMouseInPosition para dar click en los botones, pero no es muy buena idea por que siempre que le de a la posición que puse pasará algo, entonces quisiera saber si hay otra forma de hacer un dxButton más eficiente.

Un ejemplo de como lo estoy haciendo es este:

function clickItems(button,state) 
    if (button == "left" and state == "down") then 
        if isMouseInPosition(screenW * 0.0203, screenH * 0.3496, screenW * 0.2320, screenH * 0.0615) then 
        removeEventHandler("onClientRender", root,itemsPart) 
        removeEventHandler("onClientRender", root,armasPart) 
        removeEventHandler("onClientRender", root,comidaPart) 
        removeEventHandler("onClientRender", root,accPart) 
        removeEventHandler("onClientRender", root,objPart) 
        removeEventHandler("onClientRender", root,espPart) 
        addEventHandler("onClientRender", root, contenidoitems) 
        addEventHandler("onClientRender", root, meinDx) 
        end 
    end 
end 
  
addEventHandler("onClientClick", root, clickItems) 

Link to comment
Puedes crear gui-objects invisibles, pero creo que es mejor la forma que actualmente usas.

El problema de usar isMouseInPosition es que tengo varias categorias, por que es un tienda de armas/skin/autos, entonces si le doy click al rectangle de autos, aparecerán las imágenes de los autos y tal, pero aún se le podrá dar click al rectangle de skins, lo que causa un bug xD.

Link to comment
Puedes crear gui-objects invisibles, pero creo que es mejor la forma que actualmente usas.

El problema de usar isMouseInPosition es que tengo varias categorias, por que es un tienda de armas/skin/autos, entonces si le doy click al rectangle de autos, aparecerán las imágenes de los autos y tal, pero aún se le podrá dar click al rectangle de skins, lo que causa un bug xD.

Agregale a la función un check para saber si estás usando la tienda o no

Link to comment
Puedes crear gui-objects invisibles, pero creo que es mejor la forma que actualmente usas.

El problema de usar isMouseInPosition es que tengo varias categorias, por que es un tienda de armas/skin/autos, entonces si le doy click al rectangle de autos, aparecerán las imágenes de los autos y tal, pero aún se le podrá dar click al rectangle de skins, lo que causa un bug xD.

Agregale a la función un check para saber si estás usando la tienda o no

Te refieres a una variable?

La mejor manera es hacerte una libreria dxGUI y usar onClientClick

Y cómo hag una libreria dxGUI? :?:

Link to comment
Que pena interrumpir o no aportar nada, pero me gustaría saber para que se utiliza esta función:
isMouseInPosition 

Mire en la wiki pero no entendí muy su funcionamiento.

Es un check que comprueba si el ratón está en la posición.

isMouseInPosition( x, y, w, h ) 

Por ejemplo, si dibujas un dxRectangle que quieres usar como botón, compruebas que cuando haces click está en la posición. Tipo:

dxDrawRectangle( x+1, y+20, x+2, y+1 ) 
if isMouseInPosition( x+1, y+20, x+2, y+1 ) then 
    outputChatBox( "Tu ratón está encima del rectángulo" ) 
end 

Edito: Aquí te dejo un ejemplo de un rectángulo negro que cuando pasas el ratón por encima se le cambia el color a blanco.

local x, y = guiGetScreenSize( ) 
  
function isMouseInPosition ( x, y, width, height ) 
    if ( not isCursorShowing ( ) ) then 
        return false 
    end 
  
    local sx, sy = guiGetScreenSize ( ) 
    local cx, cy = getCursorPosition ( ) 
    local cx, cy = ( cx * sx ), ( cy * sy ) 
    if ( cx >= x and cx <= x + width ) and ( cy >= y and cy <= y + height ) then 
        return true 
    else 
        return false 
    end 
end 
  
addEventHandler( "onClientRender", root, 
    function(  ) 
        if isMouseInPosition( x/3.8, y/3.8, x/2.02, y/2 ) then 
            dxDrawRectangle ( x/3.8, y/3.8, x/2.02, y/2, tocolor ( 255, 255, 255, 255 ) ) 
        else 
            dxDrawRectangle ( x/3.8, y/3.8, x/2.02, y/2, tocolor ( 0, 0, 0, 255 ) ) 
        end 
    end 
) 

Link to comment

No creo que yo pueda hacer una libreria dxGUI por el momento... La unica forma de qué funcione como un gui button es haciendo una librería?

La parte del check no la entendí muy bien, tengo que poner una variable como : activado = true?

Link to comment
No creo que yo pueda hacer una libreria dxGUI por el momento... La unica forma de qué funcione como un gui button es haciendo una librería?

La parte del check no la entendí muy bien, tengo que poner una variable como : activado = true?

Si, debes hacer una comprobación de si una gui está abierta o no, para ello utiliza variables, ya que es client-side, solo afectará al jugador que lo está viendo. Y no, la librería es para tenerlo todo más organizado, de ahí su nombre.

Link to comment
No creo que yo pueda hacer una libreria dxGUI por el momento... La unica forma de qué funcione como un gui button es haciendo una librería?

La parte del check no la entendí muy bien, tengo que poner una variable como : activado = true?

Si no te diste cuenta, te deje una libreria que hice yo mismo mas arriba, solo editala a tu gusto. Hay una manera de hacer lo que necesitas ahi mismo.

Link to comment

Si no te diste cuenta, te deje una libreria que hice yo mismo mas arriba, solo editala a tu gusto. Hay una manera de hacer lo que necesitas ahi mismo.

Pensé que no estaba terminado xD. Una pregunta solo para estar seguro por que en este momento no puedo testear, tengo que usarlo con un exports.dzButton? (es un ejemplo)

Link to comment

Si no te diste cuenta, te deje una libreria que hice yo mismo mas arriba, solo editala a tu gusto. Hay una manera de hacer lo que necesitas ahi mismo.

Pensé que no estaba terminado xD. Una pregunta solo para estar seguro por que en este momento no puedo testear, tengo que usarlo con un exports.dzButton? (es un ejemplo)

Si metes la librería como otro script, sí. Espero que esta pequeña explicación te ayude

QSoCzfn.png

Link to comment

Si no te diste cuenta, te deje una libreria que hice yo mismo mas arriba, solo editala a tu gusto. Hay una manera de hacer lo que necesitas ahi mismo.

Pensé que no estaba terminado xD. Una pregunta solo para estar seguro por que en este momento no puedo testear, tengo que usarlo con un exports.dzButton? (es un ejemplo)

Si metes la librería como otro script, sí. Espero que esta pequeña explicación te ayude

QSoCzfn.png

A la imágen de arriba le corregiría que si la función no tiene el "local" adelante se puede usar en cualquier archivo del mismo recurso mientras compartan el side.

Link to comment

Hasta hoy apenas pude probarlo, si se crea el botón y todo, pero cómo hago para poder darle click? use isClicked pero me dice que es nil, así es como lo estoy haciendo;

function crte() 
    if isClicked(300,300,300,300) then 
        dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
        outputChatBox("sirve") 
    end 
end 
addEventHandler("onClientRender", root, crte) 

Tengo que usar isMouseInPosition?

(no sé si lo estaré haciendo bien)

Link to comment

Es orientado a objetos, en el mismo repositorio hay ejemplos de como usarlo. La funcion crea un elemento, el cual contiene varias funciones lidagas a el. Mirando el código puedes aprender a crear tus propias librerias.

Ejemplo de lo que quieres hacer:

boton = dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
    if boton.isClicked() then 
        outputChatBox("sirve") 
    end 

PD: dxDrawButton retorna false si hay errores en la sintaxis de los argumentos requeridos de la funcion.

Link to comment
Es orientado a objetos, en el mismo repositorio hay ejemplos de como usarlo. La funcion crea un elemento, el cual contiene varias funciones lidagas a el. Mirando el código puedes aprender a crear tus propias librerias.

Ejemplo de lo que quieres hacer:

boton = dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
    if boton.isClicked() then 
        outputChatBox("sirve") 
    end 

PD: dxDrawButton retorna false si hay errores en la sintaxis de los argumentos requeridos de la funcion.

Mmm aun no sale el output cuando le doy click, con isCursorInside si me salen los output pero me salen muchas veces xD.

Estas son las funciones que estoy usando:

function dxDrawEmptyRectangle(startX, startY, endX, endY, color, width, postGUI) 
    dxDrawLine ( startX, startY, startX+endX, startY, color, width, postGUI ) 
    dxDrawLine ( startX, startY, startX, startY+endY, color, width, postGUI ) 
    dxDrawLine ( startX, startY+endY, startX+endX, startY+endY,  color, width, postGUI ) 
    dxDrawLine ( startX+endX, startY, startX+endX, startY+endY, color, width, postGUI ) 
end 
 ------------------------------ 
function isCI(pX,pY,sX,sY) 
    if isCursorShowing() then 
        local cX,cY,_,_,_ = getCursorPosition() 
        if cX and cY then 
            if cX >= pX/ssX and cX <= (pX+sX)/ssX and cY >= pY/ssY and cY <= (pY+sY)/ssY then 
                return true 
            end 
        end 
    end 
    return false 
end 
 ------------------------------- 
function dxDrawButton(text,posX,posY,sizeX,sizeY,color,font,textScale,image) 
    if not (text and posX and posY and sizeX and sizeY and color and font and textScale) then 
        return false 
    end 
  
    local self = {text=text or "", 
                  posX=posX or 0, 
                  posY=posY or 0, 
                  sizeX=sizeX or 100, 
                  sizeY=sizeY or 50, 
                  color=color or tocolor(255,255,255,255), 
                  font=font or "default", 
                  textScale=textScale or 1, 
                  image=image or false, 
                  visible=true} 
  
    if not image then 
        dxDrawRectangle ( self.posX,self.posY,self.sizeX,self.sizeY,self.color) 
        dxDrawEmptyRectangle(self.posX,self.posY,self.sizeX,self.sizeY,tocolor(0,0,0,30),2,false) 
        if not isCI(self.posX,self.posY,self.sizeX,self.sizeY) then 
            dxDrawRectangle ( self.posX,self.posY,self.sizeX,self.sizeY,tocolor(0,0,0,50)) 
        end 
    else 
        dxDrawImage (self.posX,self.posY,self.sizeX,self.sizeY, self.image, 0, 0, 0, self.color ) 
    end 
    local fontWidth = dxGetTextWidth ( self.text, self.textScale, self.font ) 
    local fontHeight = dxGetFontHeight ( self.textScale, self.font ) 
    local x = (self.posX+(self.sizeX/2)) - ((fontWidth)/2) 
    local y = (self.posY+(self.sizeY/2)) - ((fontHeight)/2) 
  
    dxDrawText ( self.text, x+1, y+1,self.sizeX,self.sizeY, tocolor(0,0,0,100), self.textScale, self.font) 
    dxDrawText ( self.text, x, y,self.sizeX,self.sizeY, tocolor(255,255,255,255), self.textScale, self.font) 
  
    local isCursorInside =  function() 
                                if isCI(self.posX,self.posY,self.sizeX,self.sizeY) then 
                                    return true 
                                end 
                                return false 
                            end 
    local isClicked =   function () 
                            if isCI(self.posX,self.posY,self.sizeX,self.sizeY) and temp and self.visible then 
                                temp = false 
                                return true 
                            end 
                            return false                                     
                        end 
    local isVisible = function () return self.visible end 
    local setVisible = function (v) self.visible = v end 
  
    return { 
        isCursorInside = isCursorInside, 
        isClicked = isClicked, 
        isVisible = isVisible, 
        setVisible = setVisible 
    } 
end 

Y así como lo estoy haciendo:

function h() 
boton = dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
    if boton.isClicked() then 
        outputChatBox("sirve",255,255,255) 
    end 
end 
addEventHandler("onClientRender", root, h) 

Link to comment
Es orientado a objetos, en el mismo repositorio hay ejemplos de como usarlo. La funcion crea un elemento, el cual contiene varias funciones lidagas a el. Mirando el código puedes aprender a crear tus propias librerias.

Ejemplo de lo que quieres hacer:

boton = dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
    if boton.isClicked() then 
        outputChatBox("sirve") 
    end 

PD: dxDrawButton retorna false si hay errores en la sintaxis de los argumentos requeridos de la funcion.

Mmm aun no sale el output cuando le doy click, con isCursorInside si me salen los output pero me salen muchas veces xD.

Estas son las funciones que estoy usando:

function dxDrawEmptyRectangle(startX, startY, endX, endY, color, width, postGUI) 
    dxDrawLine ( startX, startY, startX+endX, startY, color, width, postGUI ) 
    dxDrawLine ( startX, startY, startX, startY+endY, color, width, postGUI ) 
    dxDrawLine ( startX, startY+endY, startX+endX, startY+endY,  color, width, postGUI ) 
    dxDrawLine ( startX+endX, startY, startX+endX, startY+endY, color, width, postGUI ) 
end 
 ------------------------------ 
function isCI(pX,pY,sX,sY) 
    if isCursorShowing() then 
        local cX,cY,_,_,_ = getCursorPosition() 
        if cX and cY then 
            if cX >= pX/ssX and cX <= (pX+sX)/ssX and cY >= pY/ssY and cY <= (pY+sY)/ssY then 
                return true 
            end 
        end 
    end 
    return false 
end 
 ------------------------------- 
function dxDrawButton(text,posX,posY,sizeX,sizeY,color,font,textScale,image) 
    if not (text and posX and posY and sizeX and sizeY and color and font and textScale) then 
        return false 
    end 
  
    local self = {text=text or "", 
                  posX=posX or 0, 
                  posY=posY or 0, 
                  sizeX=sizeX or 100, 
                  sizeY=sizeY or 50, 
                  color=color or tocolor(255,255,255,255), 
                  font=font or "default", 
                  textScale=textScale or 1, 
                  image=image or false, 
                  visible=true} 
  
    if not image then 
        dxDrawRectangle ( self.posX,self.posY,self.sizeX,self.sizeY,self.color) 
        dxDrawEmptyRectangle(self.posX,self.posY,self.sizeX,self.sizeY,tocolor(0,0,0,30),2,false) 
        if not isCI(self.posX,self.posY,self.sizeX,self.sizeY) then 
            dxDrawRectangle ( self.posX,self.posY,self.sizeX,self.sizeY,tocolor(0,0,0,50)) 
        end 
    else 
        dxDrawImage (self.posX,self.posY,self.sizeX,self.sizeY, self.image, 0, 0, 0, self.color ) 
    end 
    local fontWidth = dxGetTextWidth ( self.text, self.textScale, self.font ) 
    local fontHeight = dxGetFontHeight ( self.textScale, self.font ) 
    local x = (self.posX+(self.sizeX/2)) - ((fontWidth)/2) 
    local y = (self.posY+(self.sizeY/2)) - ((fontHeight)/2) 
  
    dxDrawText ( self.text, x+1, y+1,self.sizeX,self.sizeY, tocolor(0,0,0,100), self.textScale, self.font) 
    dxDrawText ( self.text, x, y,self.sizeX,self.sizeY, tocolor(255,255,255,255), self.textScale, self.font) 
  
    local isCursorInside =  function() 
                                if isCI(self.posX,self.posY,self.sizeX,self.sizeY) then 
                                    return true 
                                end 
                                return false 
                            end 
    local isClicked =   function () 
                            if isCI(self.posX,self.posY,self.sizeX,self.sizeY) and temp and self.visible then 
                                temp = false 
                                return true 
                            end 
                            return false                                     
                        end 
    local isVisible = function () return self.visible end 
    local setVisible = function (v) self.visible = v end 
  
    return { 
        isCursorInside = isCursorInside, 
        isClicked = isClicked, 
        isVisible = isVisible, 
        setVisible = setVisible 
    } 
end 

Y así como lo estoy haciendo:

function h() 
boton = dxDrawButton("#ffffffhola",300,300,300,300,tocolor(0,0,0,255),"default",2) 
    if boton.isClicked() then 
        outputChatBox("sirve",255,255,255) 
    end 
end 
addEventHandler("onClientRender", root, h) 

No uses onClientRender, usa onClientKey y esa función que mencionaste: isMouseInside

Link to comment

Estas usando mal la libreria, es copiar todo lo que esta dentro en un script a parte.

Por lo que veo tu sacaste las funciones que necesitabas y las pusiste en el script. Hay variables globales necesarias para que el script funcione.

Link to comment
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...