Archivo de la categoría: Noticias

TinyMCE El más completo editor de textos HTML y ahora en aplicaciones de escritorio Xailer, ¿por que no?

Para los que seguimos creyendo firmemente que a las aplicaciones de escritorio les queda una larga vida, vemos que la Web está bien para depende que, pero no vemos aún a nuestros clientes realizando sus ventas de fruta conectadas a una báscula serie desde la web o realizando su facturación o su contabilidad desde la nube, bien sea por velocidad, inmediatez, sencillez o por costumbre simplemente.

Pero a todos nosotros, desarrolladores de aplicaciones de escritorio, nos llama poderosamente la atención la riqueza gráfica de los componentes que hay para la Web, auténticas maravillas que por ejemplo permiten hacer graficas multi formato, coloridas y con movimiento.

Y fue uno de estos componentes el que me impactó en cuanto lo vi funcionando dentro de la mayor parte de las Web hechas con WordPress y no es otro que un completo procesador de textos online llamado TinyMCE    https://www.tiny.cloud  tan completo que casi todas esas Web sustituyen el nativo de WordPress por éste. TinyMCE es multi idioma y totalmente parametrizable para tener el diseño a tu gusto.

Internet está lleno de demos, ejemplos, videos de Youtube como éste, que muestran todo su increíble potencial, tanto que te hará olvidar a Word. Puedes manejar imágenes, recortarlas y girarlas, manejar tablas de datos con gran complejidad, etc. casi todo lo que se te ocurra y encima es un complemento gratuito, aunque también hay una versión comercial más completa, pero la básica es más que suficiente.

Hace tiempo que empezamos a desarrollar aplicaciones WEB como complemento de nuestras aplicaciones de escritorio, de forma que los clientes puedan tener en su bolsillo ciertas utilidades, consultas o resultados de sus aplicaciones de escritorio y para ello empezamos a trabajar con Nefele 4 Harbour    https://www.nefele.dev   
Esto nos abrió un universo de posibilidades en la Web y pudimos salir del escritorio, sin dejar de trabajar con el entorno Xailer y el lenguaje Harbour que conocemos y en el que nos sentimos tan cómodos, pero ahora para la Web.

La experiencia recogida en estas aplicaciones Web y la aparición del increíble componente Edge WebView en Xailer 7 nos llevó a preguntarnos si era factible llevar la Web al escritorio y nos pusimos manos a la obra, por que no meter TinyMCE en nuestras aplicaciones a través del WebView integrado. Dicho y hecho, en pocas horas estaba andando.

Ahora tenemos un procesador de texto que genera HTML con toda riqueza de detalles y que podemos grabar en un campo de una base de datos y leerlo desde este campo para mostrarlo de nuevo en pantalla, imprimirlo o casi lo que se quiera.

Adiós al triste campo Memo y adiós al RTF que ya ha cumplido años y tocaba jubilar, bienvenido TiNyMCE.

¿Que hace falta para integrarlo en nuestras aplicaciones Xailer?

1.- Creas un Form con un objeto WebView en su interior. Este ejemplo es nuestro redactor de correos electrónicos y el objeto Webview es el cuadro blanco inferior.

2.- Sobre éste objeto contenedor instancio un componente TinyMCE

WITH OBJECT ::oWebView
  With Object ::oTinyEditor := TTinyMCE( ):New( ::oWebView ) 
  End
END

Para ello debemos de contar con la CLASS TTinyMCE que hemos desarrollado y que se incluye en el proyecto Xailer que se adjunta y que puedes descargar desde el área de descargas de Xailer.

Esta clase permite de una forma muy simple parametrizar el aspecto, el menú, los botones y el funcionamiento del editor de textos como puede verse en su definición:

Property cLanguage         Init "esp"  //Opciones   esp, cat , eus, gal, mex
Property lButtonBar        Init .T.
Property lAllButtons       Init .T.    //Muestra una barra de botones con todas las opciones siguientes
Property cFormatButtons    Init "bold italic underline |"
Property cFormatExButtons  Init "formatselect  fontselect fontsizeselect | "
Property lColorButtons     Init .F.   
Property cColorButtons     Init "forecolor backcolor  |"
Property lAdjustButtons    Init .F.   
Property cAdjustButtons    Init "alignleft aligncenter alignright alignjustify |"
Property lNotepadButtons   Init .F.
Property cNotepadButtons   Init "cut copy paste|"
Property lUndoButtons      Init .F.
Property cUndoButtons      Init "undo redo|"
Property lBulletButtons    Init .F.
Property cBulletButtons    Init "bullist numlist outdent indent |"
Property lInsertButtons    Init .F.
Property cInsertButtons    Init "hr link insertfile | quickimage image | emoticons |"
Property lTableButtons     Init .F.
Property cTableButtons     Init "table |"
Property lSearchButtons    Init .F.
Property cSearchButtons    Init "searchreplace |"
Property lPrintButtons     Init .F.
Property cPrintButtons     Init "print export|"  //preview
Property lConvertButtons   Init .F.
Property cConvertButtons   Init "ConvertToWord |"
Property cOwnerButtons     Init ""     //Para construir una barra especial del control, se mostrarán los controles que aquí se citen
Property cDevelButtons     Init "|visualblocks code "  //Controles para el desarrollador permiten ver los bloques de texto del Html y editar el código fuente
Property cFontSizes        Init "6pt 8pt 10pt 12pt 14pt 18pt 24pt 36pt 72pt"
ACCESS   cSelectButtonbar  Inline ::cFormatButtons + ::cFormatExButtons + ::cColorButtons + ::cAdjustButtons
Property lAutoSave         Init .F.    //Mensaje de guardar antes de salir
Property lSpellChecker     Init  NIL   //Usar el corrector ortográfico de Edge
Property lStatusBar        Init .T.    //Mostrar la barra de estadoY listo, ya sale andando y puedes escribir el texto que quieras o incluso editar WebPages que puedes copiar y pegar desde internet.

3.- Pero como cualquier componente de Internet cada vez que lo invocamos irá a la Web a leer desde un CDN todo lo necesario para su funcionamiento, el código JavaScript, los iconos, etc. con lo cual necesitamos una conexión Internet y unos segundos de conexión. Pero esto puede evitarse si descargamos esta información y la metemos en una subcarpeta de nuestra propia aplicación, por ejemplo en el proyecto de ejemplo  .\Xtras\TinyMce  y de esta manera logramos independencia total de la Web y mayor velocidad de carga.

Pegas de TinyMCE.

La versión gratuita utiliza el corrector ortográfico del navegador del equipo y solo subraya los errores en el idioma en uso. Además el botón derecho no ofrece listas de correcciones, eso se reserva para la versión de pago.
Otra pega es que el botón de pegar desde el portapapeles parece no funcionar en ningún sistema, pero te lo dice y te invita a pulsar Ctrl+V que si funciona.

Y esto no es más que el principio de algo muy grande.

Imagina poder tomar controles de esos que se te cae la baba al verlos por Internet y poder integrarlos en tus aplicaciones de escritorio de forma nativa y sin necesidad de conectarte siquiera a la web.

Por ejemplo, este es un control de calendario https://fullcalendar.io.demos funcionando desde Xailer completamente en local contra una base de datos MariaDB.

Pero esto ya será para otro capítulo……

Descarga de ejemplo de uso

Importantes novedades en Xailer Profesional

Después de haber convertido en un producto completamente gratuito nuestra versión base de Xailer y haber sido un completo éxito debido a su estupenda acogida. Ahora llega el turno de promocionar la versión profesional para hacerla muchísimo más interesante.

A partir de la publicación de este artículo Xailer Profesional recibe dos importantes novedades:

  • La inclusión de muchos controles que hasta ahora estaban presentes únicamente en la versión ‘Enterprise’, como son:
    • Acceso nativo a servidores de bases de datos MySQL, MariaDB y SQLite.
    • Acceso a escáner WIA.
    • Acceso al editor de imágenes.
  • Una importantísima reducción en su precio, que pasa de 395 € a 245 €

Y además como oferta de lanzamiento de esta nueva versión. Ofrecemos Xailer Profesional a precio de actualización, es decir, 145 € hasta el 30 de junio de 2021.

Se acabaron las excusas para no empezar a utilizar bases de datos SQL y abandonar definitivamente los ficheros DBF. Además los DataControls de Xailer, incluidos en la versión profesional hacen que el proceso sea muy fácil e intuitivo. Nunca es tarde para hacer el cambio.

Puede realizar su pedido directamente desde este enlace:

https://www.xailer.com/wp/pedido-de-xailer/

Comparativa de las distintas versiones de Xailer

Xailer Personal Profesional Enterprise
Librería de clases y funciones para Windows
Entorno integrado de desarrollo
Documentación eletrónica completa y en español
Soporte técnico no preferencial
Soporte técnico preferencial mediante foro privado
Un año de soporte técnico y actualizaciones
Código fuente de las clases que integran la librería gráfica, excepto algunos componentes internos
Acceso a escaner WIA
Acceso a editor de imágenes
Componentes DataSets para acceso a distintos formatos de datos, DBF, ADS y SQL
Soporte de componentes ActiveX
Soporte nativo para MySQL y MariaDB
Soporte nativo para MySQlite
Soporte de bases de datos cifradas para MySQlite
Soporte para descargas desde internet mediante multihilos
Soporte de multihilos
Control Web browser nativo basado Webkit
Control Web browser nativo basado Microsoft Edge
Acceso a bases de datos externas via WEB
Controles avanzados y con estilo Windows 10
Animaciones avanzadas en controles

Un sencillo y útil Plug-In

Estimados usuarios de Xailer,

Desgraciadamente sois pocos los que habéis sacado partido del sistema de Plug-In que incorpora Xailer y realmente se ha realizado un gran esfuerzo. Os animamos a probarlo. Este artículo pretende iniciaros en el uso y creación de los mismos.

Un Plug-In es sencillamente una DLL que se carga con el propio IDE de Xailer y que puede realizar diversas tareas, como por ejemplo:

  • Añadir nuevas opciones en el IDE bien a través de menus o atajos de teclado que permiten realizar cualquier tipo de tarea o para establecer configuraciones especificas: Este es el caso del Plug-In ‘MoreOptions.dll‘ que permite establecer configuraciones adicionales del editor.
  • Realizar operaciones adicionales cuando se producen determinados eventos dentro del IDE.

Es necesario indicar en el IDE que se pretende utilizar un determinado Plug-In y para ello se utiliza la opción de menú Componentes->Gestor de Plugins. Los Plugins deben de encontrarse en el directorio \xailer\plugins. Desde esta opción podrá habilitar o deshabilitar cualquiera de ellos.

Cualquier Plug-In tiene un acceso muy relevante de todo el IDE y es posible desde el mismo acceder al editor de código, al editor de formularios, al proyecto activo, etcétera. En el siguiente enlace tenéis información de como utilizarlos. Está en inglés, pero espero que eso no sea un problema.

En la última versión de Xailer introdujimos un nuevo Plug-In de nombre ICIP_Plugin que entendemos puede ser muy útil y que además sirve para que os adentréis en el uso de los mismos. Este Plug-In en cuestión tiene un cometido muy básico, que consiste en establecer propiedades iniciales a los controles cuando se depositan en el formulario. Por ejemplo: si cada vez que instanciamos un control del tipo TMaskEdit ponemos su propiedad lZeroFill a .T., sería muy útil que esa operación se realizase automáticamente. Esta es la labor que realiza el Plug-In.

Podríamos haber creado un Plug-In con una configuración extensa desde el propio IDE , por la cual se pudiese establecer el valor inicial de cada propiedad para cada tipo de control, pero sería muy poco usable. Hemos preferido que todo el trabajo se haga por código desde el propio Plug-In. De esta forma conseguimos mucha más potencia y flexibilidad.

La tarea de nuestro Plug-In consiste en estar atento a cualquier operación de deposito de un control en un formulario y en dicho momento comprobar si tiene que actualizar alguna de las propiedades del mismo. Para ello, deberá capturar el evento apropiado, que en nuestro caso es «FE_AddControl» que recibe como primer parámetro el objeto depositado en el formulario. En ese momento comprobamos según el tipo de objeto que es si hay que actualizar alguna propiedad. Y eso es todo.

El proyecto completo de este Plug-In se encuentra en el directorio \samples\Plugins\ControlsInitProps. Es necesario que modifiquéis el proyecto según vuestras propias necesidades, pero sólo es necesario que adaptéis el método Run() que es muy sencillo. Este sería el código para TEditMask:lZeroFill:

METHOD Run( oControl, aSelection )
 IF oControl:IsKindOf( "TMaskEdit" )
  oControl:lZeroFill := .T.
 ENDIF
RETURN nil

En el propio proyecto podéis ver como se controlan más de un tipo de control y lo fácil que es adaptarlo a vuestras necesidades.

Independientemente de que el Plug-In esté cargado en el IDE es posible desactivarlo o activarlo desde de la opción de menú que él mismo integra bajo la opción de menú de Herramientas del IDE.

Espero que os parezca de utilidad, empecéis a usarlo y sobre todo os animéis a desarrollar vuestros propios Plugins.

Un saludo

Mejoras en nuestro editor gratuito xEdit

Con la presentación de Xailer 7 hemos decidido incluir en el paquete de instalación nuestro editor gratuito xEdit que incorpora toda la funcionalidad a nivel de editor de código del IDE de Xailer, como puede ser el propio Intellisense.

xEdit es un editor de programación especialmente adaptado para ser utilizado con Harbour. Se puede usar con absolutamente cualquier entorno de desarrollo que utilice Harbour o xHarbour como compilador de lenguaje xBase. Incorpora un sistema de configuración de entornos que permite trabajar con distintos tipos de proyectos de forma muy sencilla.

Con esta nueva versión de xEdit incluimos algo muy demandado entre los usuarios que lo utilizan y que es una de las grandes estrellas de nuestro entorno de programación Xailer: Nos referimos al depurador de Xailer.

La nueva versión de xEdit incorpora la capacidad de depurar absolutamente cualquier tipo de proyecto. Junto con los binarios del programa, ahora se entregan dos librerías: libXailerDebug.a y XailerDebug.lib. La primera debe de usarse si se utiliza el compilador C de MinGW y la segunda si se utiliza Borland C++. Adicionalmente se entrega un documento PDF de nombre XailerDebug.pdf con información de como usarlo.

Podéis descargar la última versión de xEdit desde la siguiente dirección:

Área de descargas de Xailer

Espero que os guste.

Un cordial saludo

Nuevo Browser en Xailer 7

Xailer 7 incorpora un nuevo control tipo Browser, diseñado desde cero, en el que se han incorporado casi todas las funcionalidades del antiguo Browser, se han añadido nuevas y se ha incorporado el diseño moderno de Windows 10.

Estas son algunas de las importantes características que incorpora en el nuevo Browser:

  • Editores de celdas especializados para cada tipo de datos
  • Ordenación automática sobre cualquier columna
  • Filtrado automático por una o varias columnas
  • Cabeceras de columnas: Es posible introducir una cabecera que abarque a varias columnas
  • Agrupaciones por todas las columnas que se requiera, pudiendo mostrar en la cabecera o pie de cada agrupación cualquier datos de acumulación, máximos, mínimos, medias o contadores de cualquiera de las columnas de una forma tremendamente sencilla
  • Potente gestión de eventos que permite adaptar la visualización de las columnas completamente a sus necesidades
  • Fondo transparente. Lo cual le permite poner una imagen como fondo del control
  • Modificación del alto de la fila por el propio usuario
  • Barras de desplazamiento (Scroll) escamoteables al estilo de Windows 10

El nuevo Browser utiliza de forma más ortodoxa las barras de desplazamiento, tanto la vertical como la horizontal, a diferencia del clásico Browse.

A diferencia del Browser clásico, este nuevo control no tiene una versión específica para ser usada con tablas DBF. En dichos casos, deberá traspasar los datos de la tabla, bien a una matriz o un dataset en memoria (TMemDataset) y lógicamente, en ambos casos, será responsabilidad del programador la actualización de los datos del Browser con la tabla DBF subyacente.

Se ha realizado un gran esfuerzo con este nuevo Browse y esperamos que sea de vuestro agrado. Os animamos a que empecéis a usarlo en vuestros nuevos proyectos.

Un saludo

Nuevos controles visuales en Xailer: TreeView

Xailer 7 incorpora un nuevo control estilo TreeView pero con estilo Windows 10 y completamente configurable. El control TreeView existente en versiones anteriores de Xailer, que también se mantiene, está basado en un control estándar de Windows y desgraciadamente es poco configurable y no ha habido más remedio que crear un nuevo control desde cero. Ello nos ha permitido hacerlo altamente configurable y potente. Os dejo un pequeño de vídeo del mismo. Espero que os guste.

Un saludo

Nuevos controles visuales en Xailer: barras de progreso y deslizadores

En Xailer 7 hemos renovado también dos controles clásicos de Windows que son la barra de progreso (progress bar) y los deslizadores (sliders) , ofreciéndoles en ambos casos un aspecto más moderno, acorde con Windows 10. Al ser controles nativos de Xailer y no apoyarse en ningún control existente de Windows, conseguimos que sea completamente configurable por el usuario.

Es importante resaltar la existencia de un nuevo control tipo barra de progreso, pero circular, que puede mostrar o no el porcentaje de la misma y permite mostrar un texto en la parte inferior haciendo que el área inferior de la barra se abra para dar espacio a dicho texto.

Espero que os guste.

Un saludo

Nuevos controles visuales en Xailer 7: TCircularImage

Control sencillo, pero ampliamente demandado por su gran uso en plataformas móviles. Este control permite mostrar cualquier imagen dentro de un área circular. Permite establecer un marco y un efecto ‘hot’ cuando se coloca el ratón encima de él haciendo que la imagen se muestre más resaltada, pudiendo elegir el color para hacer dicho resaltado. Adjunto una muestra de lo que es capaz:

Espero que os guste. Un saludo.

Nuevos controles visuales en Xailer 7

En los próximos artículos vamos a repasar todos los nuevos controles que incluye el futuro Xailer 7. Existen nuevos controles que son simplemente versiones más vistosas de controles ya existentes, pero adaptados al estilo de Windows. Motivo por el cual todos estos nuevos controles se califican como ‘modernos’ y tiene una pestaña propia en el propio IDE. Sería el caso de los controles:

  • TButtonMod: Botón
  • TEditMod: Edit (Ya existente en Xailer 6, pero se ha adaptado para su funcionamiento en modo oscuro)
  • TMemoMod: Memo (Ya existente en Xailer 6, pero se ha adaptado para su funcionamiento en modo oscuro)
  • TCheckBoxMod: Checkbox o casilla de verificación
  • TRadioMod: Botón tipo Radio
  • TProgressBarMod: Barra de progreso
  • TTrackBarMod: Barra de seguimiento
  • TSwitch: Interruptor (Ya existente en Xailer 6, pero se ha adaptado para su funcionamiento en modo oscuro)
  • TGroupBoxMod: Cuadro de grupo
  • TDateEditMod: Edit especializado en la edición de fechas, utilizando el nuevo control de TCalendarMod
  • THeaderMod: Control para manejar cabeceras de browses o barras de botones

Además de estos controles se han incorporado algunos nuevos que o son completamente nuevos o por su gran mejora, merece la pena dedicarles un artículo a cada uno de ellos, como son:

  • TWebView: Control tipo browser basado en Microsoft Edge con integración total con sus aplicaciones.
  • TListBoxMod: Control tipo listbox con todo lo que pueda necesitar
  • TComboBoxMod: Control tipo ComboBox
  • TBtnPanelMod: Panel contenedor con efecto botón
  • TProgressCircle: Barra de progreso circular
  • TCalendarMod: Control tipo calendario
  • TTreeViewMod: Control tipo Treeview muy potente y completamente configurable
  • TCircularImage: Control tipo imagen con enmarcado circular
  • TBrowseMod: Control tipo browse que mejora sustancialmente el actual browse.

Todos estos nuevos controles que son susceptibles de tener su equivalente como DataControl, también han sido creados para el nuevo Xailer 7. Por lo tanto y como pueden imaginar, Xailer 7 es sin duda el mayor esfuerzo que se ha realizado en una actualización de Xailer desde Xailer 2.

Otra característica fundamental de los nuevos controles es que admiten el uso de etiquetas básicas tipo HTML en las propiedades de tipo cadena, como por ejemplo la propiedad cText del TButtonMod.

Comenzamos con el control TBtnPanelMod. Este nuevo control de Xailer 7 ofrece una gran funcionalidad que consiste en poder establecer que un contenedor de controles se comporte como un botón en su conjunto.

Esto nos permite crear botones con una mayor funcionalidad que la que teníamos hasta ahora. Seguro que ya habrá descubierto que son ampliamente utilizados en Windows 10.

Espero que les guste. Pronto más controles. Estén atentos. Gracias.