Cuando tenemos componentes anidados dentro de otros componentes a veces queremos que el componente ocupe el 100% del padre, por tanto definimos su ancho y alto al 100% (hasta ahí todo normal), para que al realizar el calculo de las dimensiones (método measure) se ajuste. Aún así, cuando usamos contenedores anidado podemos ver que siempre deja un pequeño espacio entre el borde del padre y el del contenedor hijo, por lo que creo es debido al padding, pero incluso modificado los valores del padding en el estilo (tag style o en el css) no conseguía que el contenedor hijo ocupara realmente el 100. Quedaba algo así:
La solución que encontré a este problema es utilizar la propiedad clipContent. Establecido el valor de clipContent a true en el contenedor interior (contenedor 2) indicamos que el contenido del hijo se puede extender fuera de sus limites, y clipContent a false en el contenedor padre (Contenedor 1), de forma que los componentes que se encuentren dentro del contenedor 2 podrán extenderse fuera de este pero no fuera del padre. Por tanto no tendremos la sensación de que los contenedores están identados unos dentro de otros. Quedando así:
Nota: El pequeño borde rojo alrededor de la segunda imagen lo he dejado para mostrar que el contenedor 1 sigue estando en el displayList.
No hay comentarios:
Publicar un comentario