Guía R-001 – Mostrar Grid de tarjetas («card»)

En las aplicaciones de móvil es muy frecuente que las listas de los grid (rejillas) no se vean bien, por el espacio tan escaso que se dispone en la visualización de los móviles en vertical.

Por esta razón, he estado revisando en el ejemplo de «compra-react» alternativas para la visualización de los «listados» de «compras» y «productos».

Objetivo

Mejorar la visualización de los GRID en las aplicaciones para los móviles.

DEMO: https://fhumanes.com/compra2-react/

Comparte base de datos y usuarios con la aplicación de «compra«.

Si estas interesado en este artículo, sigue leyendo haciendo clic en este enlace.

Guía 90 – Utilización de HotKeys en PHPRunner

Alan, en su desarrollo, requiere establecer acciones cuando se pulsa una combinación de teclas.  Me facilitó como referencia el artículo : https://asprunner.com/forums/topic/28756-Keyboard-Shortcuts-for-your-application que estaba muy bien descrita la solución, no obstante tuve problemas para localizar la biblioteca de JavaScript y no había un ejemplo completo.

Buscando, localicé esta solución https://raw.githack.com/jaywcjlove/hotkeys/b3cb4a3/index.html, que principalmente viene explicado para REACT (lo mismo encontré con otras bibliotecas), pero que también dispone de su versión para WEB https://unpkg.com/browse/[email protected]/dist/.

Objetivo

Incorporal a los desarrollos de PHPRunner la funcionalidad de HotKeys, con la configuración única para todo el proyecto.

DEMO: https://fhumanes.com/hotkeys/

// JavaScript file customization example for programming the "Hotkey" keys from the browser
hotkeys('ctrl+a,ctrl+b,ctrl+alt+t,ctrl+alt+v,ctrl+alt+s', function (event, handler){
  switch (handler.key) {
    case 'ctrl+a': alert('you pressed ctrl+a!');
      break;
    case 'ctrl+b': alert('you pressed ctrl+b!');
      break;
   case 'ctrl+alt+t': location.href = 'tabla_list.php';
      break;
   case 'ctrl+alt+v': location.href = 'view_list.php';
      break;
   case 'ctrl+alt+s': $('a[id^="saveButton"]').click(); // This JQUERY button SAVE
      break;
    default: alert(event);
  }
});

Si está interesado en esta solución, accede al artículo en este enlace.

Inauguración de la categoría «React»

Si sois habituales de este Blog, habréis visto en la Guía 83, en la que informo que estaba estudiando el entorno de desarrollo React, para poder hacer desarrollos «BUENOS» para los móviles.

En el tiempo que ha transcurrido, he avanzado bastante y tengo buenos ejemplos para todos aquellos que busquen cómo desarrollar un interfaz para móvil, de su aplicación PHPRunner. Esta alternativa, creo, le puede interesar mucho a todos los que tengan esa necesidad.

Os facilito los enlaces a las páginas creadas:

React es una solución muy extendida y tiene multitud de componentes gratuitos que son muy interesantes. Seguiré explorando y publicando aquellos aspectos que me resulten interesantes y novedosos.

Guía 89 – Múltiples funcionalidades sobre la página «LIST» – Actualización 18/10/2024

Rubén me ha solicitado la posibilidad de que las filas donde el check de selección está activado pueda disponer de un fondo de otro color. Estudiado cómo PHPRunner pone el color de fondo de las filas, he visto que no es posible cambiar dicho color, por lo que he cambiado la programación a la utilización de:

  • Definir todos los colores a través de CSS personalizados «Custom CSS».
  • Hacer todos los cambios a través de JavaScript en el evento «OnLoad»

El ejemplo publicado corresponde a esta versión.

Haz clic en este enlace para acceder al artículo completo.

Blog personal para facilitar soporte gratuito a usuarios de React y PHPRunner