Issue #1803💬 RespondidoAbierto el 18 de febrero de 2019por ageirReacciones 0

Lienzo de tamaño fijo

Respuesta rápidapor artf

¿Has probado la API del Administrador de dispositivos?Esto (a veces) añadirá desplazamiento en el lienzo de la plantilla de la página web, claro, pero no lo veo como un problema porque es más importante saber que el diseño en el que trabajas se verá igual en la tele. Probablemente a partir de la próxima versión se exp...

Lee la respuesta completa abajo ↓

Pregunta

Estamos usando GrapesJS en el trabajo para construir un sistema de quioscos en nuestro CMS. Actualmente uso la plantilla de la página web. Mostramos el contenido en pantallas/televisores que tienen una resolución fija, por ejemplo 1920x1080 tumbado, o 1080x1920 de pie de un lado. Y he intentado encontrar una forma de limitar la resolución en el lienzo sin éxito. Nos gustaría limitar el tamaño del lienzo a la resolución tanto en x como en y a la resolución (y rotación) en la pantalla para la que editamos, para que puedas ver el contenido real que se mostrará en la tele. Esto (a veces) añadirá desplazamiento en el lienzo en la plantilla de la página web, claro, pero no lo veo como un problema porque es más importante saber que el diseño en el que trabajas se verá igual en la tele.

¿Alguna idea de cómo solucionar esto?

Aún no conozco el código, así que no tengo ni idea de cómo solucionarlo mejor. Cualquier ayuda será bienvenida.

Respuestas (3)

artf21 de febrero de 2019

¿Has probado la API del Administrador de dispositivos?

Esto (a veces) añadirá desplazamiento en el lienzo de la plantilla de la página web, claro, pero no lo veo como un problema porque es más importante saber que el diseño en el que trabajas se verá igual en la tele.

Probablemente a partir de la próxima versión se expondrá una API para el zoom (del módulo Canvas)

ageir21 de febrero de 2019

Sí, lo hice, funciona genial si editas en una pantalla más grande que el contenido previsto. Pero si, por ejemplo, editas para una pantalla 4K en una pantalla Full HD, es un poco problemático. ¡Zoomar parece genial! Sería genial si pudieras hacer zoom tanto a nivel de píxel como a porcentaje.

La API del Administrador de Dispositivos no soporta la altura máxima, lo que hace imposible saber dónde cortará el contenido verticalmente. Esto es bastante importante para editar pantallas de altura fija. Sería genial tener esa opción. ¿Alguna idea de cómo solucionar esto? ¿Hay alguna solución sencilla? ¿O es un gran cambio? Lo mejor sería limitar la altura vertical para que no puedas añadir contenido nuevo debajo. O lo siguiente mejor sería tener un divisor/línea/indicador para que puedas ver dónde se corta para una altura fija.

artf21 de febrero de 2019

sí, lo hice, funciona genial si editas en una pantalla más grande que el contenido previsto. Pero si, por ejemplo, estás editando para una pantalla 4K en una pantalla Full HD, es un poco problemático. ¡Zoomar parece genial! Sería genial si pudieras hacer zoom tanto a nivel de píxel como a porcentaje.

El zoom será un valor de 0 a 100

La API del Administrador de Dispositivos no soporta la altura máxima, lo que hace imposible saber dónde cortará el contenido verticalmente. Esto es bastante importante para editar pantallas de altura fija. Sería genial tener esa opción. ¿Alguna idea de cómo solucionar esto? ¿Hay alguna solución sencilla? ¿O es un gran cambio? Lo mejor sería limitar la altura vertical para que no puedas añadir contenido nuevo debajo. O lo siguiente mejor sería tener un divisor/línea/indicador para que puedas ver dónde se corta para una altura fija.

Bueno, puedes pasar la 'altura' al dispositivo, no me queda claro exactamente qué haría la altura MÁXIMA aquí. Si superas el límite, por ejemplo, Al añadir un componente al envoltorio o cambiar el estilo de altura de una sección, obviamente verás el lienzo con la barra de desplazamiento

Preguntas y respuestas relacionadas

Continúa investigando con debates sobre temas similares.

Plugins de pago que cumplen con este problema

Seleccionado por temas clave y relevancia de etiquetas para ayudarte a enviar más rápido.

Ver todos los plugins

Cargando recomendaciones de plugins de pago...

Opción gratuita

Consulta los plugins de código abierto de GrapesJS en GitHub O haz una búsqueda rápida en nuestro catálogo gratuito.

Explora plugins gratuitos →
Opción premium

Los plugins premium incluyen soporte, actualizaciones regulares y funciones listas para producción — ahorrando días de trabajo de integración.

Explora plugins premium →

Tutoriales relacionados

Guías detalladas sobre el mismo tema.

Todos los tutoriales →

Explorar categorías de plugins

Ve directamente a las páginas de categorías de plugins en el marketplace.