{"id":25053,"date":"2019-03-06T05:00:04","date_gmt":"2019-03-06T05:00:04","guid":{"rendered":"https:\/\/www.knowband.com\/blog\/?p=25026\/"},"modified":"2019-03-07T15:31:50","modified_gmt":"2019-03-07T05:01:50","slug":"%c2%bfc%c3%b3mo-eliminar-espacio-extra-entre-la-barra-de-navegaci%c3%b3n-y-la-vista-de-desplazamiento","status":"publish","type":"post","link":"https:\/\/www.knowband.com\/blog\/es\/mobile-app-es\/%c2%bfc%c3%b3mo-eliminar-espacio-extra-entre-la-barra-de-navegaci%c3%b3n-y-la-vista-de-desplazamiento\/","title":{"rendered":"\u00bfC\u00f3mo eliminar espacio extra entre la barra de navegaci\u00f3n y la vista de desplazamiento?"},"content":{"rendered":"

Objetivos del blog.<\/strong><\/h2>\n

Despu\u00e9s de leer este blog, podremos comprender el motivo del espacio adicional entre la barra de navegaci\u00f3n superior y la Vista de desplazamiento en la aplicaci\u00f3n iOS en las versiones iOS 7 a iOS 10.<\/p>\n

Planteamiento del problema<\/strong><\/h3>\n

Cuando agregamos una vista de desplazamiento o una vista de tabla (cualquier vista desplazable) en un controlador de vista que contiene una Barra de navegaci\u00f3n en la parte superior, nos enfrentamos a un problema com\u00fan que es un espacio adicional entre la Barra de navegaci\u00f3n superior y la Vista de desplazamiento.<\/p>\n

\"desplazable:<\/a><\/p>\n

<\/h3>\n

\u00bfPor qu\u00e9 el problema actual est\u00e1 ah\u00ed?<\/strong><\/h3>\n

Desde iOS 7 a iOS 10, cuando agregamos una barra de navegaci\u00f3n encima de cualquier ViewController, Xcode nos brinda una opci\u00f3n para hacer que la barra de navegaci\u00f3n sea transl\u00facida. Para que podamos ver a trav\u00e9s de la barra de navegaci\u00f3n y el desplazamiento de la p\u00e1gina se puede ver a trav\u00e9s de la barra de navegaci\u00f3n.<\/p>\n

Ahora el motivo del problema es que cuando se agrega una Vista de desplazamiento en el Controlador de vistas y la Barra de navegaci\u00f3n est\u00e1 configurada y es transl\u00facida, la Vista de desplazamiento deja un margen de la vista principal para la barra de navegaci\u00f3n. Pero la barra de navegaci\u00f3n se agrega al tiempo de ejecuci\u00f3n y mueve la vista principal hacia abajo para que la barra de navegaci\u00f3n pueda caber en la parte superior. En ese caso, la vista se desplaza hacia abajo mediante la barra de navegaci\u00f3n y la vista de desplazamiento deja margen para la barra de navegaci\u00f3n. Aqu\u00ed observamos que el espaciado extra a\u00f1adido dos veces.<\/p>\n

Esta fue la \u00fanica raz\u00f3n por la que vemos espacio adicional entre la barra de navegaci\u00f3n y la vista de desplazamiento.<\/p>\n

Procedimiento para resolver el problema.<\/strong><\/h3>\n

Hay dos formas de resolver el problema. En ambos casos, restringimos la vista de desplazamiento para dejar un margen adicional para la barra de navegaci\u00f3n.<\/p>\n

1.<\/strong>Podemos configurar la opci\u00f3n Transl\u00facida para la barra de navegaci\u00f3n en "Falso" en Xcode<\/p>\n

? This will make the navigation bar Opaque and then the scroll view is not required to scroll under the Navigation Bar. So that Scroll View will leave no space for Navigation Bar.<\/p>\n

En el siguiente Gif puede ver que la restricci\u00f3n de dise\u00f1o de la vista cambia cuando habilitamos \/ inhabilitamos la propiedad "Transl\u00facida" de la barra de navegaci\u00f3n.<\/p>\n

\"transl\u00facido\"<\/a><\/p>\n

2.<\/strong>Podemos deshabilitar "Ajustar inserciones de vista de desplazamiento<\/strong>"propiedad del ViewController.<\/p>\n

\"Ajustar<\/a><\/p>\n

? This will restrict the Scroll View to leave extra space for the Navigation bar on top.<\/p>\n

Resumen<\/strong><\/h2>\n

Despu\u00e9s de seguir el procedimiento anterior, podr\u00e1 eliminar el espacio adicional entre la barra de navegaci\u00f3n y la vista de desplazamiento.<\/p>\n