Comment supprimer un espace supplémentaire entre la barre de navigation et la vue de défilement?

Objectifs du blog

Après avoir lu ce blog, nous pourrons comprendre la raison de l’espace supplémentaire entre la barre de navigation supérieure et la vue de défilement dans l’application iOS dans les versions iOS 7 à iOS 10.

Énoncé du problème

Lorsque nous ajoutons une vue de défilement ou une vue tabulaire (toute vue défilable) dans un contrôleur de vue contenant une barre de navigation en haut, nous sommes confrontés à un problème courant: un espace supplémentaire entre la barre de navigation supérieure et la vue de défilement.

scrollable: app iOS

Pourquoi la question actuelle est là

D'iOS 7 à iOS 10, lorsque nous ajoutons une barre de navigation au-dessus de tout ViewController, Xcode nous fournit une option permettant de rendre la barre de navigation translucide. Pour que nous puissions voir à travers la barre de navigation et que le défilement de la page soit visible dans la barre de navigation.

La raison du problème tient maintenant au fait que lorsqu'une vue de défilement est ajoutée dans ViewController et que la barre de navigation est définie et transparente, la vue de défilement laisse une marge dans la vue principale de la barre de navigation. Mais la barre de navigation a été ajoutée au moment de l'exécution et la vue principale est déplacée vers le bas afin que la barre de navigation puisse tenir sur le dessus. Donc, dans ce cas, la vue est décalée vers le bas par la barre de navigation et la vue en défilement laisse la marge pour la barre de navigation. Nous observons ici que l’espacement supplémentaire a été ajouté deux fois.

C'est la seule raison pour laquelle nous voyons un espace supplémentaire entre la barre de navigation et la vue de défilement.

Procédure pour résoudre le problème

Il existe deux manières de résoudre le problème. Dans les deux cas, nous limitons la vue de défilement afin de laisser une marge supplémentaire pour la barre de navigation.

1.Nous pouvons définir l'option Translucide de la barre de navigation sur "False" dans Xcode.

? 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.

Dans le Gif ci-dessous, vous pouvez voir que la contrainte de présentation de la vue change lorsque nous activons / désactivons la propriété "Translucide" de la barre de navigation.

translucide

2.Nous pouvons désactiver "Ajuster les inserts de défilement"propriété du ViewController.

Ajuster les incrustations d'affichage de défilement: application iOS

? This will restrict the Scroll View to leave extra space for the Navigation bar on top.

Résumé

Après avoir suivi la procédure ci-dessus, vous pourrez supprimer l’espace supplémentaire entre la barre de navigation et la vue de défilement.


Akash Sharma

Akash Sharma

I'm Akash Sharma, an engineering graduate and software developer by profession. Challenges fascinate me and I like solving them.

Leave a Reply

Your email address will not be published. Required fields are marked *