Plantilla responsive template
Quote from rrey on May 4, 2020, 12:56 pmHola,
Estoy usando la plantilla responsive de ejemplo que trae VisualNeo. Pero tengo una duda. El código javascript siguiente que está en eventos ¿es necesario? o con algunas de las funciones de la nueva versión del programa ya no es necesario.
El código es este:
BeginJS
if (matchMedia) {
const largedisp = window.matchMedia("(min-width: 1025px)");
const mediumdisp = window.matchMedia("(min-width: 768px) and (max-width: 1024px)");
const smalldisp = window.matchMedia("(min-width: 481px) and (max-width: 767px)");
const verysmalldisp = window.matchMedia("(min-width: 320px) and (max-width: 480px)");largedisp.addListener(WidthChangeLarge);
WidthChangeLarge(largedisp);mediumdisp.addListener(WidthChangeMedium);
WidthChangeMedium(mediumdisp);smalldisp.addListener(WidthChangeSmall);
WidthChangeSmall(smalldisp);verysmalldisp.addListener(WidthChangeVerySmall);
WidthChangeVerySmall(verysmalldisp);function WidthChangeLarge(largedisp) {
if (largedisp.matches) {
$scope.GotoPage("pagina4");
}
};
function WidthChangeMedium(mediumdisp) {
if (mediumdisp.matches) {
$scope.GotoPage("pagina3");
}
};
function WidthChangeSmall(smalldisp) {
if (smalldisp.matches) {
$scope.GotoPage("pagina2");
}
};
function WidthChangeVerySmall(verysmalldisp) {
if (verysmalldisp.matches) {
$scope.GotoPage("pagina1");
}
};
}/*
(min-width: 1281px)
(min-width: 1025px) and (max-width: 1280px)
(min-width: 768px) and (max-width: 1024px)
(min-width: 481px) and (max-width: 767px)
(min-width: 320px) and (max-width: 480px)
(orientation: landscape)
*/
EndJSQuiero que en el móvil se ajuste la pantalla verticalmente con FitAppToScreen true "top" "center" Pero no es posible.
Como hay páginas diferentes por cada tamaño de dispositivo entonces el código que está en eventos ¿se aplica a todas las páginas? Bueno la verdad es que tengo un poco de lío con este tema. Además cuando hay un campo de tipu input en el móvil si se escala la pantalla se ve pe muy pequeña cuando usas el teclado.
Saludos,
Roger Rey
Hola,
Estoy usando la plantilla responsive de ejemplo que trae VisualNeo. Pero tengo una duda. El código javascript siguiente que está en eventos ¿es necesario? o con algunas de las funciones de la nueva versión del programa ya no es necesario.
El código es este:
BeginJS
if (matchMedia) {
const largedisp = window.matchMedia("(min-width: 1025px)");
const mediumdisp = window.matchMedia("(min-width: 768px) and (max-width: 1024px)");
const smalldisp = window.matchMedia("(min-width: 481px) and (max-width: 767px)");
const verysmalldisp = window.matchMedia("(min-width: 320px) and (max-width: 480px)");
largedisp.addListener(WidthChangeLarge);
WidthChangeLarge(largedisp);
mediumdisp.addListener(WidthChangeMedium);
WidthChangeMedium(mediumdisp);
smalldisp.addListener(WidthChangeSmall);
WidthChangeSmall(smalldisp);
verysmalldisp.addListener(WidthChangeVerySmall);
WidthChangeVerySmall(verysmalldisp);
function WidthChangeLarge(largedisp) {
if (largedisp.matches) {
$scope.GotoPage("pagina4");
}
};
function WidthChangeMedium(mediumdisp) {
if (mediumdisp.matches) {
$scope.GotoPage("pagina3");
}
};
function WidthChangeSmall(smalldisp) {
if (smalldisp.matches) {
$scope.GotoPage("pagina2");
}
};
function WidthChangeVerySmall(verysmalldisp) {
if (verysmalldisp.matches) {
$scope.GotoPage("pagina1");
}
};
}
/*
(min-width: 1281px)
(min-width: 1025px) and (max-width: 1280px)
(min-width: 768px) and (max-width: 1024px)
(min-width: 481px) and (max-width: 767px)
(min-width: 320px) and (max-width: 480px)
(orientation: landscape)
*/
EndJS
Quiero que en el móvil se ajuste la pantalla verticalmente con FitAppToScreen true "top" "center" Pero no es posible.
Como hay páginas diferentes por cada tamaño de dispositivo entonces el código que está en eventos ¿se aplica a todas las páginas? Bueno la verdad es que tengo un poco de lío con este tema. Además cuando hay un campo de tipu input en el móvil si se escala la pantalla se ve pe muy pequeña cuando usas el teclado.
Saludos,
Roger Rey
Quote from luishp on May 4, 2020, 4:48 pmHola @rrey, efectivamente ese ejemplo es para una versión anterior de VisualNEO Web. Ahora puedes utilizar SetResponsivePages en su lugar. Puedes crear hasta 4 diseños distintos para rangos de resoluciones. Con este comando indicas la página de entrada para cada resolución. Lo normal es utilizarlo una sola vez al comenzar la aplicación en Project > Events > Start-up. De todos modos hay muchas estrategias para afrontar las diferentes resoluciones. Dependiendo del proyecto puede ser más interesante una u otra.
Saludos!
Hola @rrey, efectivamente ese ejemplo es para una versión anterior de VisualNEO Web. Ahora puedes utilizar SetResponsivePages en su lugar. Puedes crear hasta 4 diseños distintos para rangos de resoluciones. Con este comando indicas la página de entrada para cada resolución. Lo normal es utilizarlo una sola vez al comenzar la aplicación en Project > Events > Start-up. De todos modos hay muchas estrategias para afrontar las diferentes resoluciones. Dependiendo del proyecto puede ser más interesante una u otra.
Saludos!
Quote from rrey on May 27, 2020, 10:36 amHola @luishp,
Tengo una duda respecto a la plantilla responsive. Es posible desde VisualNeo crea una plantilla con medidas diferentes en cada página. Es decir existe la posibilidad de crear nuevas plantillas, crear páginas de diferente tamaño.
Saludos,
Roger
Hola @luishp,
Tengo una duda respecto a la plantilla responsive. Es posible desde VisualNeo crea una plantilla con medidas diferentes en cada página. Es decir existe la posibilidad de crear nuevas plantillas, crear páginas de diferente tamaño.
Saludos,
Roger
Quote from luishp on May 27, 2020, 5:15 pmHola @rrey
Tengo una duda respecto a la plantilla responsive. Es posible desde VisualNeo crea una plantilla con medidas diferentes en cada página. Es decir existe la posibilidad de crear nuevas plantillas, crear páginas de diferente tamaño.
Si, puedes tener páginas de diferente tamaño. Ahí radica la utilidad de SetResponsivePages.
La forma de hacerlo es a través de CSS desde Project > Properties > Styles:#NewPage{ width:500px; height:1000px; }Donde NewPage es el nombre de la página.
Hay más formas de hacer aplicaciones responsive pero esta seguramente es la más sencilla.Saludos!
Hola @rrey
Tengo una duda respecto a la plantilla responsive. Es posible desde VisualNeo crea una plantilla con medidas diferentes en cada página. Es decir existe la posibilidad de crear nuevas plantillas, crear páginas de diferente tamaño.
Si, puedes tener páginas de diferente tamaño. Ahí radica la utilidad de SetResponsivePages.
La forma de hacerlo es a través de CSS desde Project > Properties > Styles:
#NewPage{
width:500px;
height:1000px;
}
Donde NewPage es el nombre de la página.
Hay más formas de hacer aplicaciones responsive pero esta seguramente es la más sencilla.
Saludos!
Quote from rrey on May 27, 2020, 5:21 pm@luishp Sí eso ya lo hice. Me refiero a la plantilla de ejemplo que viene con VisualNeo. En esta las medidas están ya establecidas al abrir el archivo. No en tiempo de ejecución.
@luishp Sí eso ya lo hice. Me refiero a la plantilla de ejemplo que viene con VisualNeo. En esta las medidas están ya establecidas al abrir el archivo. No en tiempo de ejecución.
Quote from luishp on May 27, 2020, 5:26 pm@rrey el código CSS no es para el tiempo de ejecución sino para el de diseño y se establecen las medidas también al abrir el archivo. O no te entiendo bien...
@rrey el código CSS no es para el tiempo de ejecución sino para el de diseño y se establecen las medidas también al abrir el archivo. O no te entiendo bien...