FOXRIBBON

Autor: Guillermo Carrero

Documentación: Walter R. Ojeda Valiente

Abril de 2012

INDICE
¿Qué es FoxRibbon? ................................................ ¿Qué es un menú de tipo ribbon? ................................... ¿Quién desarrolló FoxRibbon? ...................................... ¿Quién escribió esta documentación? ............................... ¿Cuánto cuesta FoxRibbon? ......................................... ¿Qué necesito descargar para poder utilizar FoxRibbon? ............ ¿Cómo hago para ver un demo de FoxRibbon? ......................... ¿Qué necesito conocer para poder usar FoxRibbon? .................. ¿Cuáles son las librerías de clases que usa FoxRibbon? ............ ¿Qué debo escribir en mi programa principal, MAIN.PRG o similar? .. ¿Cuáles son las clases visuales que puedo utilizar? ............... ¿Cómo agrego FoxRibbon a mi formulario? ........................... ¿Cómo se ve lo que hemos hecho hasta aquí? ........................ ¿Cómo le agrego una barra de títulos al menú ribbon? .............. ¿Por qué usar una barra de títulos propia y no usar simplemente la que tienen los formularios? .................................... 1 1 1 1 1 1 1 1 2 2 3 4 6 7

9

¿Cómo hago para cambiar el color del texto y el tipo de letra? .... 10 ¿Cómo le agrego una barra de estado a mi formulario? .............. 11 ¿Cómo le agrego un botón de inicio a mi formulario? ............... 13 ¿Cómo le agrego pestañas al menú Ribbon? .......................... 15 ¿Cómo le muestro las opciones al usuario cuando hace click sobre una pestaña? ...................................................... 18 ¿Cómo creo mis propias clases visuales para mostrar las opciones? . 19 ¿Cuáles serían los pasos a seguir? ................................ 19 ¿Para qué sirve cada una de las clases de FoxRibbon? .............. 20 ¿Un consejo final? ................................................ 23 ¿Y si tengo dudas o consultas? .................................... 23

Ojeda Valiente ¿Qué es FoxRibbon? Es una librería de clases .exe ¿Qué necesito conocer para poder usar FoxRibbon? 1. el cual debes descomprimir en cualquier carpeta que desees. ¿Qué necesito descargar para poder utilizar FoxRibbon? El archivo FoxRibbon.rar. España. Creación de clases visuales Si no tienes un conocimiento al menos regular de Visual FoxPro no es mucho lo que podrás obtener de FoxRibbon ya que te trancarás a cada rato. como se ve a continuación: ¿Quién desarrolló FoxRibbon? Guillermo Carrero.com/site/foxribbonclass/ Importante: FoxRibbon utiliza a System.rar desde: http://sites. Visual FoxPro en general 2. -1- . de Barcelona. personalizadas a tu propio gusto. Ojeda Valiente. ¿Quién escribió esta documentación? Walter R. Paraguay ¿Cuánto cuesta FoxRibbon? Es gratis. Si no sabes crear clases visuales en Visual FoxPro. En otras palabras.google. FoxRibbon no es para ti. entonces solamente podrás utilizar las clases que ya están diseñadas (que son muy pocas) y no podrás diseñar tus propias clases. ¿Qué es un menú de tipo ribbon? Los menús de tipo ribbon (o de cinta.app ¿Cómo hago para ver un demo de FoxRibbon? Ejecuta el programa FoxRibbon. de Asunción. si no conoces bastante bien los dos puntos anteriores. en castellano) son los utilizados en las últimas versiones de los programas de Microsoft Office.VCX que puede ser utilizada por los programadores de Visual FoxPro y que fue realizada 100% en este lenguaje.Autor: Guillermo Carrero Documentación: Walter R. por ejemplo en: C:\FoxRibbon\ Podrás descargar a FoxRibbon. Sirve para mostrar en las aplicaciones menús de tipo ribbon y además provee una serie de herramientas para mejorar el aspecto visual de las aplicaciones.

. o sea que puedes renombrarla o crear tu propia librería de clases.c_FirstDayWeek = 2 *--Días feriados de la semana .APP if VarType(_Screen.F. endwith FoxRibbon es la librería de clases que necesitarás sí o sí para que puedas tener en tu formulario un menú de tipo ribbon.oRibbon .NewObject("oRibbon". .c_6FriHoli = . -2- . sí o sí. MyDesigns es la que contiene tus propios diseños e inclusive es conveniente que la renombres o que crees tu propia librería.F.c_7SatHoli = . cuando quieras crear un menú de tipo ribbon. Ojeda Valiente ¿Cuáles son las librerías de clases que usa FoxRibbon? Si entras en la carpeta \VCX verás que hay dos librerías de clases: FoxRibbon MyDesigns La primera (FoxRibbon) es la que debes usar siempre.c_1SunHoli = . La segunda (MyDesigns) contiene las diversas opciones que le mostrarás a los usuarios. para no interferir con versiones futuras que vayan surgiendo de FoxRibbon.Autor: Guillermo Carrero Documentación: Walter R.RemoveObject("oRibbon") endif _Screen. por ejemplo llamándola: MisClases ¿Qué debo escribir en mi programa principal.PRG o similar? SET CLASS TO FOXRIBBON ADDITIVE SET CLASS TO MYDESIGNS ADDITIVE DO SYSTEM.oRibbon) == "O" _Screen.T. . .T.c_3TueHoli = .Language = "Español" *--Calendario .F. Su nombre no es obligatorio. . "RibbonSettings") with _Screen.F.c_2MonHoli = . .c_5ThuHoli = .F. MAIN.c_4WedHoli = .

algunas de ellas puedes verlas a continuación: -3- . Ojeda Valiente ¿Cuáles son las clases visuales que puedo utilizar? El nombre de cada una de ellas y su utilidad lo encontrarás al final de este documento.Autor: Guillermo Carrero Documentación: Walter R.

Crea un formulario en blanco 2. En Form Controls elige Add… 3. A tu formulario agrégale la clase Ribbon -4- . Agrégale la librería de clases FoxRibbon. Ojeda Valiente ¿Cómo agrego FoxRibbon a mi formulario? 1.Autor: Guillermo Carrero Documentación: Walter R.vcx 4.

verás lo siguiente: Si miras las últimas líneas verás las propiedades: FirstTabClick YourStartButton YourStatusBar YourTitleBar De las cuatro. Si ahora haces click sobre esa clase con el botón derecho. por supuesto) -5- . que servirá para indicarle cual será la pestaña que estará habilitada al iniciar el programa. la única obligatoria es FirstTabClick. eliges “Properties…” y luego “Other”.Autor: Guillermo Carrero 5. ya sé que parece chino. 6. Y verás algo como esto: Documentación: Walter R. no te desesperes. YourStartButton sirve para indicar el nombre de la clase que llama el botón de inicio (si hay un botón de inicio. Ojeda Valiente Tranquilo. pero enseguida lo entenderás. claro) YourStatusBar sirve para indicar el nombre de la clase que muestra una barra de estado (si hay una barra de estado.

desde luego) ¿Cómo se ve lo que hemos hecho hasta aquí? Si ejecutas tu formulario verás algo como esto: O sea. Ojeda Valiente YourTitleBar sirve para indicar el nombre de la clase que muestra la barra de título (si hay una barra de título. nada muy útil hasta ahora. pero iremos avanzando hasta tener un menú totalmente funcional.Autor: Guillermo Carrero Documentación: Walter R. -6- .

Haces click sobre el formulario 2. Ojeda Valiente ¿Cómo le agrego una barra de títulos al menú ribbon? Tienes dos formas. Ahora. Haces click sobre el formulario (arriba de él. no ambas: Desde afuera del menú Ribbon 1. para ponerle un título a nuestro menú lo que hacemos es cambiar la propiedad “Caption” de nuestro formulario. debes elegir UNA de ellas. -7- .Autor: Guillermo Carrero Documentación: Walter R. En la ventanita de “Form Controls” haces click sobre la opción “_titlebar” 3. pero NO en la barra de títulos) Y verás algo como: Donde en la parte superior apareció una barra con el texto “Label1” 4.

esos botones son los que tienes definidos en las propiedades de tu formulario. Ojeda Valiente Recuerda: es la propiedad “Caption” del formulario la que cambias. Para cambiar la apariencia de la barra de títulos: 1. Para cambiar alguna de las propiedades de la barra de título (el color de fondo. Recuerda: los botones que serán visibles los determinas en las propiedades de tu formulario. Hacer click con el botón derecho sobre _titlebar1 b. ya está tomando forma. Maximizar y Cerrar? Muy simple. bueno.Autor: Guillermo Carrero Documentación: Walter R. Hacer click con el botón derecho sobre _titlebar1 b. Maximizar y Cerrar el formulario ¿Y si no quiero tener los botones de Minimizar. Queremos ver como nos está quedando. Para cambiar la ubicación de la barra de título (ponerla más arriba.). En la ventana “Properties” cambiarle los valores a las propiedades 2. Colocarlo en la ubicación deseada -8- . así que ejecutamos el formulario y vemos esto: Bueno. más a la izquierda) debes: a. al menos ya tenemos el título y los botones de Minimizar. bueno. si no quieres verlos entonces simplemente les colocas el valor . Elegir la opción “Edit” c. Hacer click sobre Ribbonlabel1 d. el tamaño. más a la derecha. si es transparente o no. Elegir la opción “Edit” c. 5. más abajo. debes: a.F. Hacer click sobre Ribbonlabel1 d. etc.

poniéndole todas las opciones y los iconos que desees.Autor: Guillermo Carrero Desde dentro del menú Ribbon Documentación: Walter R. haces click con el botón derecho sobre el control Ribbon1. Ojeda Valiente En este caso. En un programa que estéticamente deseas que sea bello (por eso justamente usas la clase FoxRibbon) tener en cuenta todos los detalles es importante. ¿Por qué usar una barra de títulos propia y no usar simplemente la que tienen los formularios? Porque a tu propia barra de títulos la puedes PERSONALIZAR a tu propio gusto. Puedes revisar justamente la clase MyTitleBar para tener una idea clara de cómo hacerla. como se ve en la siguiente captura de pantalla: O podrías usar tu propia clase que muestre una barra de títulos. Si usas la librería de clases que se entrega con FoxRibbon entonces podrías usar “MyTitleBar”. luego en su propiedad YourTitleBar colocas el nombre de una clase que muestra la barra de títulos. Y aquí tenemos una barra de título normal -9- . Y una barra de títulos personalizada ayuda mucho.

Autor: Guillermo Carrero Documentación: Walter R. hagas lo que hagas. por ejemplo: FontName = “Times New Roman” .FONTNAME = "Tahoma" ENDWITH Donde reemplazarías RGB(x.x. _SCREEN. RGB(x.oRibbon. por ejemplo: RGB(255.FontColorAlternate. Ojeda Valiente ¿Cómo hago para cambiar el color del texto y el tipo de letra? Si has probado cambiar las propiedades de RibbonLabel1 posiblemente habrás notado que puedes cambiar el valor de todas las propiedades y funcionan … excepto FontName y ForeColor. 0) Y FontName = “Tahoma” por el tipo de letra que te gusta. Así que si quieres cambiarlos tendrás que escribir en el método ReDraw() de RibbonLabel1 lo siguiente: DODEFAULT() WITH THIS . x) por los colores que te plazcan.x)) .lFontAlternate. 255.FORECOLOR = IIF(. Esas no cambian.10 - . x. ¿Por qué no funcionan? Porque sus valores están definidos dentro del método ReDraw() de la clase RibbonLabel.

Haces click con el botón derecho sobre la barra de estado que acabas de agregar (la cual tendrá por nombre: _statusbar1) 5. por ejemplo: .11 - . Y en la ventana de Properties.Autor: Guillermo Carrero Documentación: Walter R. Haces click sobre RibbonLabel1 7. Ojeda Valiente ¿Cómo le agrego una barra de estado a mi formulario? De forma muy similar a como le has agregado una barra de título. en la propiedad “Caption” escribes el texto que deseas que se muestre en la barra de estado. Eliges la opción “Edit” 6. Haces click sobre el formulario (abajo de él. En la ventanita de “Form Controls” haces click sobre la opción “_statusbar” 3. en un lugar libre por supuesto) 4. Haces click sobre el formulario 2. también tienes dos formas: Desde afuera del menú Ribbon 1.

RibbonLabel1. Ejecutas tu formulario y verás algo como: 9.12 - . .RibbonLabel1. Ojeda Valiente 8. En la propiedad “YourStatusBar” escribir el nombre de una clase que muestre una barra de estado. 10. Puedes usar MyStatusBar o alguna otra de tu propia creación. le puedes cambiar el tipo de letra. el tamaño. entonces puedes escribir algo como: ThisForm. Si quieres cambiar el texto desde un método de tu formulario._statusbar1.Autor: Guillermo Carrero Documentación: Walter R. Al igual que como hiciste con la barra de títulos._statusbar1. Click sobre Ribbon1 2. el color de las letras.Caption = "Mensaje en la Barra de Estado" O como: ThisForm. etc.Caption = DtoC(Date()) Desde dentro del menú Ribbon En este caso: 1.

Page4 (o el nombre que les quieras dar) a MisOpciones. Supongamos que en lugar de usar la librería de clases MyDesigns. las personalizas a tu gusto. En la propiedad “YourStartButton” poner el nombre de una clase que muestre el botón de inicio..vcx. para que cada una de las páginas de MyStartButton puedan ser mostradas tendrás que agregarlas a tu clase. a las páginas Page1. para que las tenga fácilmente a mano.vcx utilizas tu propia librería de clases llamada MisOpciones. Page2. Click sobre Ribbon1 2. Page3.vcx Naturalmente. Para agregar un botón de inicio: 1. Lo podemos ver mejor en la siguiente captura: . para que pueda acceder rápidamente a ellas. por ejemplo: MyStartButton Además. si es que ya no están en ella. Una posibilidad sería llevar un contador de las veces que utiliza cada opción y aquellas que más utiliza colocarlas en el botón de inicio.13 - . etc. Page2.Autor: Guillermo Carrero Documentación: Walter R. en ese caso tendrías que agregar las clases Page1. Ojeda Valiente ¿Cómo le agrego un botón de inicio a mi formulario? Los botones de inicio son muy útiles para mostrarle al usuario las opciones más utilizadas.

14 - . aún sin las páginas personalizadas: Esta es la clase Page2 en modo de diseño: Y aquí la vemos en modo de ejecución: . Ojeda Valiente Aquí está el menú de inicio.Autor: Guillermo Carrero Documentación: Walter R.

Click sobre Ribbon1 5. Ojeda Valiente ¿Cómo le agrego pestañas al menú Ribbon? 1.Autor: Guillermo Carrero Documentación: Walter R. Click con el botón derecho sobre RibbonTab1 (el control que acabamos de agregar) 6. En este ejemplo se puso la palabra “Archivos” . Click con el botón derecho sobre el control Ribbon1 2.15 - . Opción “Edit” 3. Opción “Edit” 7. Cambiarle la propiedad “Caption”. Click sobre RibbonLabel1 (la etiqueta que está dentro de ese control) 8. Click sobre RibbonTab 4.

de a poco va siendo más útil. nuestro menú ya está tomando forma. Ahora. para que se parezca más a un menú que pueda ser utilizado por los usuarios de nuestras aplicaciones. Ojeda Valiente Al ejecutar el formulario veremos algo así: Como podemos ver.16 - .Autor: Guillermo Carrero Documentación: Walter R. Al ejecutar el formulario veremos esto: . le agregaremos más opciones.

17 - . Al ejecutar el formulario podremos ver algo así: En este caso se colocó un símbolo de interrogación pero por supuesto puede elegirse cualquier otro gráfico que uno desee. .Autor: Guillermo Carrero Documentación: Walter R. entonces se lo agregamos. como vemos a continuación: En la propiedad “Picture” de Image1 especificamos el archivo gráfico que allí será mostrado. IMPORTANTE: El tamaño del archivo gráfico debe ser de 16 x 16 pixeles. Ojeda Valiente Si queremos que las pestañas tengan un pequeño iconito a su izquierda.

18 - . .Autor: Guillermo Carrero Documentación: Walter R. Diseñar la clase que usarás para mostrar tus opciones 2. Escribir el nombre de esa clase en la propiedad “PageClass” del control RibbonTab.vcx” Al ejecutar nuestro formulario veremos algo como esto: I Al hacer click sobre la pestaña “Archivos” automáticamente aparecieron las opciones que se habían puesto en la clase “DesignerTab”. Ojeda Valiente ¿Cómo le muestro las opciones al usuario cuando hace click sobre una pestaña? Para conseguir eso necesitarás dos cosas: 1. por ejemplo: En este caso estamos usando una clase llamada “DesignerTab” que se encuentra en la librería de clases “MyDesigns.

19 - . Height = 92. Un control RibbonGroup con las propiedades: Left = 5 Top = 0 RibbonLabel1.Autor: Guillermo Carrero Documentación: Walter R. Ojeda Valiente ¿Cómo creo mis propias clases visuales para mostrar las opciones? Para eso. por ejemplo: EVENTO CLICK =MessageBox(“Hiciste click aquí”) 4. ya todo depende de tu creatividad .vcx ya que allí encontrarás todo lo que necesitas. 2. En la propiedad “PageClass” del control “RibbonTab” escribir el nombre de la clase que será mostrada (en este ejemplo la clase se llama: TabArchivos) A partir de este momento.Picture = Carita01. Sin embargo usar la clase RibbonPage tiene una ventaja: ella se encarga de ajustar las propiedades Top de los grupos contenidos y de refrescar (ReDraw()) si se cambia el estilo o el idioma.Caption = Maestros b. no la cambies) = 900 (el ancho por supuesto que puede variar) 3. ¿Cuáles serían los pasos a seguir? 1.Caption = Empresa En lugar de Carita01. Crear una clase contenedora CREATE CLASS TabArchivos OF MisOpciones AS RIBBONPAGE NOTA: Podríamos también haber escrito: CREATE CLASS TabArchivos OF MisOpciones AS CONTAINER Y funcionaría bien después de ajustar las propiedades BackStyle = 0.ico puedes colocar cualquier otro gráfico con dimensiones de 32 x 32 pixeles Y en el evento Click() de RibbonButtonV escribimos el código deseado. Agregarle los controles deseados: a. Dentro de RibbonGroup1 un control RibbonButtonV con las propiedades Left = 3 Top = 3 Image1.ico RibbonLabel1. puedes utilizar todas las clases que te provee la librería FoxRibbon. Establecer las propiedades Height Width = 92 (la altura debe ser 92. BorderWidth = 0.

20 - . Ojeda Valiente ¿Para qué sirve cada una de las clases de FoxRibbon? _bandmenu Es la banda vertical de los menús desplegables. _progressbar Barra de progreso que también muestra un porcentaje _statusbar Barra de estado que se muestra en la parte inferior del formulario . Un ejemplo de su uso puede verse al hacer click en el botón “Propiedades del estilo”.Autor: Guillermo Carrero Documentación: Walter R. Ejemplos de su uso se pueden ver en “Acerca de” y en “Open a form example” _panel Es un contenedor de diversos objetos que tiene una mejor apariencia. Es utilizada en RibbonFormMenu y se puede verla en los formularios Menu1 y Menu2 _borderform Remarca aún más los bordes de un formulario y se ajusta automáticamente a éste _calendar Calendario _container Contenedor de otros objetos _datepicker Muestra y permite cambiar la fecha _datetimepicker Muestra y permite cambiar la fecha y la hora _day Muestra el número del día _menubar Es un contenedor (de botones o de lo que necesites) _menutabs Es un contenedor para colocar en él las opciones que se mostrarán en un menú vertical. como el de MyStartButton _menutabsbutton Utilizado en MyStartButton para mostrar opciones _pageframeh Es un contenedor de RibbonPage que simula un PageFrame.

el botón “Edit” y los tres botones horizontales “Label1” que están a su derecha. se le deben agregar las distintas opciones. ribbonbuttongroup Muestra un formulario asociado a un grupo ribbonbuttonh Similar a un botón de comando que se muestra en forma horizontal y puede tener un icono de 16 x 16 pixeles ribbonbuttonv Similar a un botón de comando que se muestra en forma vertical y puede tener un icono de 32 x 32 pixeles ribboncheck Similar a un checkbox ribboncombo Similar a un ComboBox ribboncommandbutton Similar a un botón de comandos.21 - . Inicialmente está vacío. puede tener un icono de 16 x 16 pixeles a la izquierda ribboneditbox Similar a un EditBox ribbonformbase Es un formulario base. en castellano) que puede ser personalizado. . “Ver código” y es la clase padre de RibbonFormCalendar. RibbonFormDateTime y de todas las demás RibbonFormxxx ribbonformcalendar Formulario que muestra y permite cambiar una fecha ribbonformdatetime Formulario que muestra y permite cambiar la fecha y la hora ribbonformmenu Clase base para crear menús. Ojeda Valiente _titlebar Barra de títulos que puede ser personalizada _titlebarmax Barra de títulos que puede ser personalizada ribbon Menú de tipo ribbon (o cinta.Autor: Guillermo Carrero Documentación: Walter R. utilizado en “Acerca de”. Se puede ver un ejemplo de su uso en la pestaña de “Ejemplos”.

está invisible. se usan propiedades de esta clase ribbonspinner Similar a un Spinner ribbonstartbutton Contenedora de todas las opciones que puede mostrar el botón de inicio ribbontab Pestaña de título. el cual puede tener hasta tres líneas ribbonlabel Similar a las etiquetas (label) ribbonlistbox Similar a un ListBox ribbonmenuseparator Barra horizontal para separar las opciones del menú ribbonoptiongroup Grupo de botones de radio ribbonpage Contenedora de las clases visibles.oRibbon. que automáticamente alinea a los objetos que tiene contenidos ribbonseparator Muestra una barra para separar a un ribbonbuttonv de otro ribbonsettings Configuración de FoxRibbon.Autor: Guillermo Carrero Documentación: Walter R. Ojeda Valiente ribbonformmsgbox Similar a MessageBox() pero no hay interacción con el usuario.SeeOutlineGroup. En lugar de usar variables públicas o propiedades del objeto _Screen. Eso se hace mediante la propiedad _Screen.F. cuando está en . que además puede tener un icono .T. está visible.22 - . Cuando está en . ribbonhelp Ventanita para mostrar mensajes de ayuda que tiene un título y un mensaje. ribbonformwait Similar a Wait Window y con una barra de progresos opcional ribbongroup Contenedora de un grupo de opciones ribbon_groupseparator Separa los grupos cuando se emula a Office 2010.

así podrás conocer como fueron hechas y te resultará muy fácil crear tus propias clases. consulta o sugerencia.com wrov@hotmail.vcx.23 - . Ojeda Valiente ¿Un consejo final? Revisa cada una de las clases que se encuentran en la librería MyDesigns. ¿Y si tengo dudas o consultas? Ante cualquier duda. puedes contactarte con: foxribbonclass@gmail.com .Autor: Guillermo Carrero ribbontextbox Similar a un TextBox Documentación: Walter R.