Archivo del Autor: Bingen

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

tCalendar Nuevo control para Xailer

Tras el curso rápido de controles visto en Madrid hace 2 semanas he conseguido rematar este control que llevaba tiempo dando vueltas por mi disco y mi cabeza.

Este nuevo control es una hoja de calendario polivalente ya que puede adoptar diferentes formatos y tamaños.

En su estado natural recién puesta sobre un form se mostraría así:

Se puede incluir un texto en cada celda, que en el caso de no caber se trunca, pero se muestra completo en el Tooltip que aparece al parar el ratón sobre ella.

También puede contener un pequeño icono de 16×16.

Pero si redimensionamos el control haciéndolo más pequeño, ya no cabrán los textos e iconos y entonces se muestra con números más grandes, aunque conservando los tooltip.

Más pequeño todavía:

Es multidioma y se puede navegar por los meses y los años con los botones de su derecha o volver al día actual que se muestra siempre arriba a la izquierda.

Permite establecer multitud de parámetros como por ejemplo:

aDayEvents: Array de días a mostrar con formato {dDia, cTexto, nColor, nIcono }

dDate: Fecha de partida

dMaxDate: Hasta que fecha se deja avanzar

dMinDate: Hasta que fecha se deja retroceder

nClrDay: Color del texto de los días normales fuera de aDayEvents

nClrMonth: Color de la letra de los meses

nClrPane y nClrPaneEnd: Para el degradado

nClrPaneHeader: Color de fondo de la cabecera

nClrPaneSundays: Color de fondo de los domingos

nClrSaturdays: Color de la letra de los sábados

nClrSundays: Color de la letra de los domingos

nClrText: Color general del texto

cClrYear: Color del texto del año

nLanguage: Idioma de los textos que puede ser

L_SPANISH    10

L_CATALA      3

L_ENGLISH     9

L_DEUTSCH     7

L_PORTUGUESE 22

L_EUSKERA    45

L_ITALIANO   16

L_GALEGO     86

L_FRANCAIS   12

oImagelist: Lista de iconos que se referencian después desde aDayEvents

Finalmente admite el evento OnClick para poder disparar un método para lo que se quiera hacer con el.

Espero que os guste y os sea útil.

La DLL y la librería para Xailer 3 con Hb y MinGw estan disponibles en:

http://www.xailer.com/download?es&cat=4

Salu2.

Messages para Xailer

Hace tiempo que no os dejaba una revisión de los mensajes para Xailer que muchos de vosotros usais en vuestros proyectos.

Novedades.

Algunos pequeños Bug de cálculos de tamaños de forms resueltos.

OJO MsgOptions ha cambiado de orden sus parámetros por compatibilidad con el resto de mensajes.

Nuevo MsgListCheck para selección de opciones con checkbox.

marcas-de-vehiculos.png

El enlace http://www.bisoft.es/Demos/Messages/Mensajes.rar

Salu2

Gestión de cámaras IP con Xailer

Me comentaba el otro día el amigo Paco Viruete, un gran tipo dicho sea de paso, la necesidad de acceder a cámaras IP de vigilancia desde una aplicación Xailer y ¿por que no?.

Aquí teneis un ejemplo de como integrar hasta 4 cámaras Ip al mismo tiempo en un form de Xailer y las 4 en movimiento claro.

Control de cámaras con Xailer

NOTA IMPORTANTE: las cámaras son de la marca Axis (http://www.axis.com/) ya que utilizo el controlador para desarrollo que se distribuye con ellas y debemos de conocer sus IPs.

Para quien quiera probarlo aquí le dejo el proyecto completo y unas utilidades extra.

 http://www.bisoft.es/Demos/Camara/Camara.rar

En la carpeta .Redist hay 2 ejecutables

1. AXISMediaControlSDK_redist.exe es el encargado de instalar los controladores de las cámaras para hacerlas accesibles desde programación.

2. IPUtility.Exe sirve para averiguar y/o cambiar las IPs de las cámaras en la red y sus nombres de usuario y contraseña, estos datos hay que suminstrarselos al programa en

CLASS TForm1 FROM TForm

Data cIpCamara1      Init «192.168.1.35»
Data cIpCamara2      Init «192.168.1.36»
Data cIpCamara3      Init «192.168.1.37»
Data cIpCamara4      Init «192.168.1.38»
Data cUserName       Init «root»
Data cUserPassword   Init «root»
Espero que le podaís sacar provecho e incluso implementeis cosas nuevas como grabación a disco, sonido, etc.

Salu2.

Gestión documental con Xailer. La clase tScanner

Ultimamente a todos los que os conozco en persona, me habéis mostrado algún interes en esta clase que preparé hace tiempo para poder escanear documentos directamente con Xailer y poder almacenarlos en archivos de múltiples tipos (Bmp, Jpg, Tiff multipágina, PDF multipágina, etc.) y/o cargarlos a campos Blob o Memo de bases de datos.

Pues bien, como lo prometido es deuda aquí os he preparado un ejemplo completo de como funciona esta clase.

Escanear un documento
Para comenzar se basa en un OCX comercial de costo reducido (unos 110 $Usd http://www.ciansoft.com/twaincontrolx/default.asp)  y distribuible con nuestras aplicaciones libre totalmente de royalties de por vida. Os adjunto una versión de prueba del OCX en mi ejemplo y por lo tanto con limitaciones como la de no poder grabar los escaneos efectuados.

Hemos probado esta clase tanto con escaneres sencillos de sobremesa, como en multifunciones de red de tamaños gigantes con escaneo en A3 color, alimentación automática de un centenar de páginas, escaneo a doble cara, etc. siempre ha funcionado correctamente.
Solo es necesario que el escaner tenga interfaz Twain, lo cual es lógico y común para cualquier escaner.

La clase se encarga de instalar y registrar automáticamente el OCX necesario, de localizar los escaneres disponibles y de comenzar a escanear.

Os adjunto el manual del OCX también para que podais ver el potencial de este.

Para aquellos que os decidais a comprar el producto final dos advertencias.

1.- Debeis de pedir la versión del OCX para xHarbour y Xailer (incluye una pequeña modificación sobre el original por temas de protección)

2.-  Debeis de cambiar en Scanner.Prg y en Twain.Prg cualquier referencia a  TwainControlXTrial.ocx por TwainControlX.ocx, que será el Ocx que habreís comprado y con el os servirán un Password que debeís de incluir en Scanner.Prg sustituyendo a  «demo» en     Data cPassword    Init «demo»

Espero que le saqueis provecho.

http://www.bisoft.es/Demos/Escaner/Escaner.rar

Nueva versión de Messages.Prg para Xailer

Aqui os dejo una nueva versión de Messages.Prg con su manual completo al día y que aparte de mejorar los mensajes anteriores añadiéndoles nuevas opciones, añade unos cuantos mensajes nuevos, con sus correspondientes ejemplos como siempre.

Mejoras:

Ajuste de las anchuras de MsgWaitOn y MsgWaitOnMeter

Añadido MsgSound para hacer que suene un Wav por los altavoces

Añadido a casi todos los mensajes que también puedan sonar un Wav

Nuevo mensaje MsgListCheck para mostrar un tree de checkboxes con texto;

Correcciones y cambios menores.

Espero que os sea tan util como a mi.

http://www.bisoft.es/Demos/Messages/Mensajes.rar

Salu2.

MIDAS Generador de reportes para Xailer y algo más

Por fin puedo presentar la Beta 1 de la primera parte de MIDAS, esto es, el generador de informes y el generador de formularios.

Aún estoy puliendo algunas cosillas pero ya es totalmente operativo.

Por las limitaciones que me impone este Blog me he visto obligado a hacer rápidamente una Web de la que podréis descargar todo lo necesario para probarlo.

www.binarygeneration.com

Espero que os guste el invento.

Salu2.

FormWizard una pequeña utilidad para Xailer.

Una de las mejores cosas que tenemos a nuestra disposición en Xailer, es poder diseñar nuestros Form con acceso a una base de datos usando DataControls de una forma muy sencilla.

Pero comentando el otro día, en la taberna entre dos vinos como hacemos los de Bilbao, el amigo David Marina me comentaba que le parecía curioso que no hubiera, como en otros IDEs de programación, algunos Wizard para hacer cosas elementales como un form con todos los campos de una tabla y tenía razón, así que le animé a que lo hiciera como ejercicio práctico y así comenzó esta pequeña historia que entre ambos hemos montado.

FormWizard es una utilidad que permite tomar un DBF (lo siento de momento no sabemos de SQL) y con todos sus campos o los indicados y en el orden deseado, mas otras florituras, genera un formulario con su PRG y XFM que guardaremos en la carpeta Source del proyecto en el que estamos y listo. Asigna los DataControl al control más lógico, los autoajusta al tamaño necesario, etc.

A continuación simplemente añadimos el recién creado PRG al proyecto (Proyecto – Añadir fichero al proyecto o el Icono correspondiente) y listo. Pulsando F12 podremos ver el formulario y modificarlo al gusto si nos apetece, ya que es lo mismo que si lo hubiéramos hecho a mano desde cero con el IDE.

Si además queremos usarlo con mas facilidad lo mejor es meter el ejecutable en la carpeta que queramos (yo lo he puesto en C:XailerBin) añadirlo al menú herramientas mediante la opción “Configurar herramientas” con los siguientes datos:

Herramienta FormWizard

Aunque no es una ayuda bárbara, esperamos que os guste y le saquéis provecho a nuestro regalo navideño. Proyecto FormWizard

Graficación en un formulario de Xailer con controles de terceros.

Continuando con el uso de controles OCX vamos ahora a ver como utilizar un control de terceros no presente directamente en el sistema operativo (como los vistos hasta ahora), esto quiere decir que habremos de instalarlo en cada PC del cliente donde queramos utilizarlo, aunque esto se puede automatizar como se verá mas adelante.

Este control es un generador de gráficos estadísticos de muy fácil manejo, pero de excelentes prestaciones, que además tiene la gran ventaja de ser gratuito ya que su autor lo ha donado de forma altruista al dominio público, es el control OCX llamado RMChart.

Ejemplo de RMChart

Sigue leyendo

Situémonos, usando GoogleMaps en nuestras aplicaciones.

En la línea de los anteriores ejemplos usando ActiveX, ahora presento un ejemplo más elaborado pero muy sencillo de utilizar al mismo tiempo, como integrar los mapas de localización de GoogleMaps en nuestras aplicaciones.

Para ello he construído la clase TGoogleMaps con la cuál he simplificado la integración del sistema en cualquier aplicación, basta con enlazar GoogleMaps.PRG con su XFM, además de WebBrowser.Prg y su CH (como se ha visto en capítulos anteriores) en la lista de ficheros del proyecto y con solo 5 líneas podemos presentar mapas de lo más vistoso en un formulario de Xailer.

De esta manera dotamos a nuestros programas de la posibilidad de poder localizar la dirección de un cliente, desde un botón en el formulario de clientes o la de crear un mapa con la ruta desde nuestras instalaciones hasta la dirección de entrega de un producto, calcular la distancia, etc.

Sigue leyendo