Zoomlayout: Los cambios en el ancho / alto de ZoomLayout no actualizan la transformación secundaria para mantener el cultivo central funcionando

Creado en 16 oct. 2020  ·  5Comentarios  ·  Fuente: natario1/ZoomLayout

Describe el error

  • Versión de la biblioteca: 1.8.0
  • Reproducible en la aplicación de demostración oficial: Sí
  • Versión del dispositivo / Android: Pixel 3, API 29

Estoy usando ZoomLayout para mostrar imágenes de retrato / paisaje. He desactivado Zoom y OverScroll. Estoy usando Pan horizontal y vertical solo con CenterCrop. Al mismo tiempo, solo se puede realizar una panorámica en una dirección, como se esperaba (porque el zoom está desactivado). Esto me permite mostrar una parte de la imagen, mientras que la otra parte se puede ver usando Pan.

Según tengo entendido, el cultivo central funciona alineando containerHeight con childHeight o containerWidth con childWidth . ¿Derecha? Imagínese cargar imágenes de paisaje / retrato en un ImageView cuadrado. Para las imágenes de paisaje, childHeight se alineará con containerHeight para realizar el recorte central, y ahora, la panorámica se puede realizar horizontalmente. De manera similar, para las imágenes de retrato, la panorámica se puede realizar verticalmente.

Esto funciona bien.

Pero, si cambio el ancho / alto de ZoomLayout de esta manera, la transformación no se aplica en la vista secundaria.

val layoutParams = zoomLayout.layoutParams
layoutParams.width = layoutParams.width + changedWidth
layoutParams.height = layoutParams.height + changedHeight
zoomLayout.layoutParams = layoutParams

Reproducir

Pasos para reproducir el comportamiento, posiblemente en la aplicación de demostración:

  1. Desactive Zoom y OverScroll.
  2. Habilite Pan para Horizontal y Vertical.
  3. Coloque una vista secundaria en ZoomLayout en XML. Mantenga el ancho / alto para envolver el contenido.
  4. Agrega un dibujo de paisaje largo. Probado con 780 x 180.
  5. Establezca este elemento de diseño como fondo para la vista secundaria en ZoomLayout en XML.
  6. Ejecutar, realizar Pan horizontalmente.
  7. Utilice un botón para aumentar la altura de ZoomLayout. La transformación del niño no se realiza.

Comportamiento esperado

Cuando cambia la altura del contenedor, se aplica la transformación secundaria para mantener CenterCrop.

Diseño XML (ZoomLayout extendido)

init {
    setHorizontalPanEnabled(true)
    setVerticalPanEnabled(true)

    setOverScrollHorizontal(false)
    setOverScrollVertical(false)

    setAlignment(Alignment.TOP or Alignment.LEFT)
    setHasClickableChildren(true)
    setTransformation(
        ZoomApi.TRANSFORMATION_CENTER_CROP,
        ZoomApi.TRANSFORMATION_GRAVITY_AUTO
    )

    setZoomEnabled(false)
}

Capturas de pantalla

Screenshot
Screenshot

Registros

Lanzado

I/ZoomLayout: setHasClickableChildren: old: false new: false
I/ZoomLayout: setHasClickableChildren: old: false new: true

Cargar fondo horizontal dibujable en el niño.

W/ZoomEngine: onMatrixSizeChanged: firstTime: true oldZoom: NaN transformation: 1 transformationZoom: 0.0
I/ZoomEngine: computeTransformationZoom centerCrop scaleX: 1.0042135 scaleY: 5.860656
I/ZoomEngine: onMatrixSizeChanged: newTransformationZoom: 5.860656 newRealZoom: 5.8606563 newZoom: 1.0000001

Aumente la altura de ZoomLayout usando el código anterior.

W/ZoomEngine: onMatrixSizeChanged: firstTime: false oldZoom: 5.8606563 transformation: 1 transformationZoom: 5.860656
I/ZoomEngine: computeTransformationZoom centerCrop scaleX: 1.0042135 scaleY: 6.2704916
I/ZoomEngine: onMatrixSizeChanged: newTransformationZoom: 6.2704916 newRealZoom: 5.8606563 newZoom: 0.93464065

El niño no se transforma para mantener la funcionalidad del cultivo central.

APK

Proporcionará pasos de reproducción si es necesario, pero muy fáciles de usar.

enhancement discussion

Comentario más útil

Me gusta cómo funciona en este momento, el tamaño del contenedor puede cambiar por muchas razones y si el contenido ya estaba ampliado / panorámico, no creo que debamos volver a aplicar la transformación. Debería poder lograr lo que desea de esta manera:

zoomLayout.layoutParams = layoutParams
zoomLayout.engine.setContainerSize(layoutParams.width, layoutParams.height, true)

O tal vez así

zoomLayout.layoutParams = layoutParams
zoomLayout.post {
    zoomLayout.engine.setContainerSize(layoutParams.width, layoutParams.height, true)
}

Podríamos hacer esto más fácil con una función syncTransformation () o algo así

Todos 5 comentarios

Usé el siguiente código para solucionar esto.

val layoutParams = zoomLayout.layoutParams
layoutParams.width = layoutParams.width + changedWidth
layoutParams.height = layoutParams.height + changedHeight
zoomLayout.layoutParams = layoutParams

zoomLayout.engine.setContainerSize(
    layoutParams.width.toFloat(),
    layoutParams.height.toFloat(),
    applyTransformation = false // not applying transformation
)

Y otro cambio en onGlobalLayout() ZoomLayout

engine.setContentSize(
    child.width.toFloat(), 
    child.height.toFloat(),
    applyTransformation = true // <-- this change
)

Hacer esto me ayuda. El niño está alineado correctamente con el padre para mantener la funcionalidad del cultivo central. Pero, este código da origen al número 185. Claramente, ahora sé la razón por la que Pan se reinicia (sugerencia # global-layout).

Entonces, todavía estoy buscando una manera de decirle a ZoomLayout que aplique la transformación en el niño cuando se cambia el ancho / alto del contenedor. Si sigo intentando usar hacks, solo tendré más errores. Has trabajado en esto, lo sabes mejor que yo. Por favor guíame.

Gracias por el informe detallado.
Creo que este es un problema general de ZoomLayout que aún no tiene un comportamiento definido al cambiar las dimensiones del contenedor, ya que esperamos que el contenedor mantenga sus dimensiones, corríjame si me equivoco @ natario1. Entonces, según tengo entendido, esto es más una solicitud de función que un error.

Si queremos apoyar esto, creo que necesitamos tener una discusión sobre cómo debería verse el comportamiento esperado y cómo los desarrolladores deberían poder desviarse de él.

Me gusta cómo funciona en este momento, el tamaño del contenedor puede cambiar por muchas razones y si el contenido ya estaba ampliado / panorámico, no creo que debamos volver a aplicar la transformación. Debería poder lograr lo que desea de esta manera:

zoomLayout.layoutParams = layoutParams
zoomLayout.engine.setContainerSize(layoutParams.width, layoutParams.height, true)

O tal vez así

zoomLayout.layoutParams = layoutParams
zoomLayout.post {
    zoomLayout.engine.setContainerSize(layoutParams.width, layoutParams.height, true)
}

Podríamos hacer esto más fácil con una función syncTransformation () o algo así

@markusressel Está bien, lo entiendo. Además, siento que lo que quiero hacer es usar solo el 25% del potencial de esta biblioteca. Deshabilitar para qué se debe usar la biblioteca es en realidad ir en contra y esperar que funcione. Todo lo que necesito es cultivo central con sartén y lanzamiento. Si tiene algo que sugerir, hágalo. Gracias.

El tamaño del contenedor puede cambiar por muchas razones y si el contenido ya estaba ampliado / panorámico, no creo que debamos volver a aplicar la transformación.

@ natario1 Si esto es esperado / necesario, debería haber una

Además, estoy comprometido con el código de la biblioteca del martes. No sé ~ mucho ~ nada sobre cómo funcionan las matrices, los vectores o los sombreadores. Intento leer y modificar para aprender. Pero ya probé tu sugerencia antes de informar el problema. Como resultado de esto, Pan está habilitado tanto para direcciones horizontales como verticales. Y el recorte central ya no está disponible ya que el contenido / niño parece estar ampliado.

Gracias por tu ayuda. Lamento haber tardado mucho más en responder.

@rupinderjeet Traté de reproducir su ejemplo, pero al aplicar el LayoutParams modificado a la instancia ZoomLayout , aparece nuestro propio mensaje de error:

java.lang.RuntimeException: ZoomLayout must be used with fixed dimensions (e.g. match_parent)

¿Me estoy perdiendo de algo?

¿Fue útil esta página
0 / 5 - 0 calificaciones

Temas relacionados

Yahor10 picture Yahor10  ·  5Comentarios

lucasrsv picture lucasrsv  ·  3Comentarios

aouledissa picture aouledissa  ·  10Comentarios

wakaztahir picture wakaztahir  ·  5Comentarios

YiHaoHuang picture YiHaoHuang  ·  10Comentarios