Page 1 of 1

Cambio de Imagen a una Aplicacion.

Posted: Thu Jun 20, 2024 11:48 pm
by JoseAlvarez
Hola a todos,

Tratando de mejorar la apariencia de una de mis aplicaciones para hacerla más atractiva y fresca a la vista, decidí buscar la ayuda de un diseñador gráfico.

Me gusta uno de los estilos que me presentó, pero hay cosas que no se como hacer. Por eso acudo al foro por ayuda, como siempre.

Este es uno de los modelos que me sugiere para el menu principal, y que quiero aplicar.

Image

Las preguntas son:

1.- ¿puedo personalizar el color de la barra de titulo de la ventana y los dialogos? me gusta el color morado que se ve alli.
2.- ¿Cómo le hago para que la button bar se vea totalmente plana, sin el borde inferior y del color que yo desee?
3.- ¿puedo colocar un icono y texto sobre la barra de button? como se ve al final de la misma que muestra el logo e identifica al usuario conectado.
4.- ¿como puedo colocar o simular una segunda barra de botones vertical dentro de la misma ventana para que muestre los iconos de las redes sociales?

Seguro que será fácil hacer todo eso, pero el que no sabe, es como el que no ve.

Agradezco las ideas y sugerencias.

Re: Cambio de Imagen a una Aplicacion.

Posted: Fri Jun 21, 2024 6:34 pm
by JoseAlvarez
Amigos ya logré colocar la segunda barra de botones (vertical).

Pensé que solo se podia colocar una sola en cada ventana, pero acepta mas de una.

Aun me queda por resolver los primeros tres puntos.

Re: Cambio de Imagen a una Aplicacion.

Posted: Fri Jun 21, 2024 8:37 pm
by cmsoft
Jose, se que no es exactamente lo que estas buscando, pero es una opcion para mostrar colores, botones e iconos en un menu, que te da mucha libertad de mostrar los datos. La clase Ribbon
Te dejo un ejemplo con tu color morado, hay que trabajarlo mas, pero jugando con los coleres de la clase tal vez obtengas algo parecido a lo que buscas.

Code: Select all | Expand

#include "FiveWin.ch"
#include "ribbon.ch"
#define CLR_BCN      rgb( 105,0,129)
#define CLR_BCN2     RGB( 105,0,145 )
#define CLR_BCN3     rgb( 105,12,120)
#define CLR_MSLIGHTGRAY  rgb(125,125,125)
#define CLR_MSGRAY       rgb(255,255,54)

FUNCTION Main()
Local oWnd, oBar, oGr := Array(3), oBot
DEFINE WINDOW oWnd ;
       TITLE "Sistema de Cuentas por cobrar"; 
       ICON "..\icons\testtrev.ico" MDI COLOR CLR_WHITE,CLR_WHITE;
       MENU HazMenu()  

    // Defino la barra de botones Ribbon
    DEFINE RIBBONBAR oBar WINDOW oWnd PROMPT "Super Usuario","Archivos","Acerca" HEIGHT 110 TOPMARGIN 25
      // Primera opcion de menu
      ADD GROUP oGr[1] RIBBON oBar TO OPTION 1 PROMPT "Inicio" width 1240 
      @ 2,05 ADD BUTTON oBot GROUP oGr[1] BITMAP "jose1.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Clientes " ACTION MsgInfo("Clientes")
      @ 2,65 ADD BUTTON oBot GROUP oGr[1]  BITMAP "jose2.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Editar datos" ACTION MsgInfo("Editar")    
      @ 2,125 ADD BUTTON oBot  GROUP oGr[1]  BITMAP "jose3.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Cuadrado" ACTION MsgInfo("Cuadrado")
      @ 2,185 ADD BUTTON oBot GROUP oGr[1]  BITMAP "jose4.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Ventas de productos" ACTION MsgInfo("Ventas")
      @ 2,265 ADD BUTTON oBot   GROUP oGr[1]  BITMAP "jose5.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Salir del sistema" ACTION oWnd:End()      
      @ 2,745 ADD BUTTON oBot GROUP oGr[1]  BITMAP "jose6.png" ;   
          ROUND SIZE 195,50  TOOLTIP "Datos de la empresa" ACTION MsgInfo("Empresa")

      ADD GROUP oGr[2] RIBBON oBar TO OPTION 2 PROMPT "Opciones" width 1240 
      @ 2,05 ADD BUTTON oBot GROUP oGr[2] BITMAP "jose4.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Clientes " ACTION MsgInfo("Clientes")
      @ 2,65 ADD BUTTON oBot GROUP oGr[2]  BITMAP "jose3.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Editar datos" ACTION MsgInfo("Editar")    
      @ 2,125 ADD BUTTON oBot  GROUP oGr[2]  BITMAP "jose2.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Cuadrado" ACTION MsgInfo("Cuadrado")
      @ 2,185 ADD BUTTON oBot GROUP oGr[2]  BITMAP "jose5.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Ventas de productos" ACTION MsgInfo("Ventas")
      @ 2,265 ADD BUTTON oBot   GROUP oGr[2]  BITMAP "jose5.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Salir del sistema" ACTION oWnd:End()      

      ADD GROUP oGr[3] RIBBON oBar TO OPTION 3 PROMPT "Tercen Menu" width 1240 
      @ 2,05 ADD BUTTON oBot GROUP oGr[3] BITMAP "jose2.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Clientes " ACTION MsgInfo("Clientes")
      @ 2,65 ADD BUTTON oBot GROUP oGr[3]  BITMAP "jose3.png" ;   
          ROUND SIZE 50,50  TOOLTIP "Editar datos" ACTION MsgInfo("Editar")          
      
      RibbonTheme(oBar)    

ACTIVATE WINDOW oWnd MAXIMIZED
RETURN nil

//Esto es para que no muestre el menu basico de windows
STATIC FUNCTION HazMenu()
LOCAL oMenu
MENU oMenu 
ENDMENU
RETURN oMenu


// Setea RibbonBar
STATIC FUNCTION RibbonTheme(oRb)
LOCAL oDlg, oGroup, oBtn
oRb:nClrPaneRB    = CLR_BCN
oRb:nClrBoxOut    = CLR_MSLIGHTGRAY
oRb:nClrBoxIn     = CLR_BCN
oRb:nClrBoxSelOut = CLR_MSLIGHTGRAY
oRb:nClrBoxSelIn  = CLR_BCN
oRb:aGrad         = { { 1, CLR_WHITE, CLR_WHITE } }
oRb:aGradFld      = { | nOpt | If( nOpt == oRb:nStart, { { 1, CLR_MSLIGHTGRAY, CLR_MSLIGHTGRAY } },;
                                                      { { 1, CLR_MSLIGHTGRAY, CLR_MSLIGHTGRAY } } ) }

oRb:aGradHigh     = { { 1, CLR_MSGRAY, CLR_MSLIGHTGRAY } }
oRb:aGradOver     = { { 1, CLR_BCN, CLR_MSGRAY } }

AFill( oRb:aClrTabTxt, { | oSelf, nPrompt | If( nPrompt == oSelf:nOption, CLR_WHITE, CLR_WHITE ) } )

DeleteObject( oRb:hBmpBrushEx )
DeleteObject( oRb:hBrushEx )
oRb:hBmpBrushEx = GradientBmp( oRb, oRb:nRight - oRb:nRightMargin - 3, oRb:nBottom - oRb:nTopMargin + 1, oRb:aGrad )
oRb:hBrushEx    = CreatePatternBrush( oRb:hBmpBrushEx )

for each oDlg in oRb:aDialogs

  oDlg:hBack = oRb:hBrushEx
  oDlg:Refresh()

  for each oGroup in oDlg:aControls
     if oGroup:IsKindOf( "TRBGROUP" )
        //oGroup:nHeight      = 110
        oGroup:nClrBoxIn    = CLR_BCN2
        oGroup:aGradCaption = { { 1, CLR_BCN3, CLR_BCN3 } }
        oGroup:bClrText     = { | lEnable | If( lEnable, CLR_MSGRAY, CLR_MSLIGHTGRAY ) }
        oGroup:nClrBoxIn    = CLR_BCN3
        oGroup:nClrBoxOut   = CLR_BCN3

        DeleteObject( oGroup:hBrushSel )
        DeleteObject( oGroup:hBrushUnSel )
        DeleteObject( oGroup:hBack )
        oGroup:hBrushUnSel  = oDlg:hBack
        oGroup:hBack        = oDlg:hBack

        for each oBtn in oGroup:aControls
           if oBtn:IsKindOf( "TRBTN" )
              oBtn:oFont:End()
              oBtn:SetFont( oRb:oFont )

              //oBtn:nHeight        = 80
              oBtn:bClrText       = { || CLR_WHITE }
              oBtn:bClrGradNormal = { | lPressed | If( lPressed, { { 1, CLR_BCN, CLR_BCN } },;
                                                                 { { 1, CLR_BCN2, CLR_BCN2 } } ) }
              oBtn:aClrGradUnder = { || { { 1, CLR_BCN3, CLR_BCN3 } } }
              oBtn:aClrGradBack  = { { 1, CLR_BCN, CLR_BCN } }
              oBtn:nClrBoxIn     = CLR_MSGRAY
              oBtn:nClrBoxOut    = CLR_MSGRAY
              oBtn:Refresh()
           endif
        next
        oGroup:Refresh()

     endif
  next
next

RETURN nil
 
Image

Re: Cambio de Imagen a una Aplicacion.

Posted: Sun Jun 23, 2024 1:51 pm
by JoseAlvarez
Saludos estimado César,

Ok, muchas gracias por tu ayuda, voy a implementarlo,

Agradecido,!!