{"id":25082,"date":"2019-03-07T11:56:02","date_gmt":"2019-03-07T11:56:02","guid":{"rendered":"https:\/\/www.knowband.com\/blog\/?p=25082\/"},"modified":"2022-07-19T10:24:40","modified_gmt":"2022-07-19T10:24:40","slug":"remove-extra-space-navigation-bar-scroll-view","status":"publish","type":"post","link":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/","title":{"rendered":"How to remove extra space between the Navigation Bar and the Scroll View?"},"content":{"rendered":"<h2><strong>Objectives of the blog<\/strong><\/h2>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-817104\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-2.png\" alt=\"How to remove extra space between the Navigation Bar and the Scroll View?\" width=\"760\" height=\"300\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-2.png 760w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-2-300x118.png 300w\" sizes=\"auto, (max-width: 760px) 100vw, 760px\" \/><\/a><\/p>\n<p>After reading this blog we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.<\/p>\n<h3><strong>Problem Statement<\/strong><\/h3>\n<p>When we add a scroll view or table view (any scrollable view) in a view controller that contains a Navigation Bar at top, we face a common issue that were is some extra space between the top Navigation Bar and the Scroll View.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5.png\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-25083 size-full\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5.png\" alt=\"scrollable view\" width=\"1656\" height=\"1740\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5.png 1656w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5-286x300.png 286w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5-768x807.png 768w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture1-5-975x1024.png 975w\" sizes=\"auto, (max-width: 1656px) 100vw, 1656px\" \/><\/a><\/p>\n<h3><\/h3>\n<h3><strong>Why the current issue is there<\/strong><\/h3>\n<p>From iOS 7 to iOS 10, when we add a Navigation Bar on top of any ViewController, then Xcode provides us an option to make the Navigation bar translucent. So that we can see through the Navigation Bar and the scrolling of the page can be seen through the navigation bar.<\/p>\n<p>Now the reason for the issue is that when a Scroll View is added in the ViewController and Navigation Bar is set and translucent, the ScrollView leaves a margin from the main view for navigation bar. But the navigation bar added on the run time and it moves the main view downed so that Navigation Bar can fit on the top. So in that case, the view is shifted downward by Navigation bar and scroll view leaves margin for Navigation bar. Here we observe that the extra spacing added two times.<\/p>\n<p>This was the only reason that we see extra space between the Navigation Bar and the Scroll view.<\/p>\n<p><a href=\"https:\/\/www.knowband.com\/mobile-app\/?utm_source=banner-ads&amp;utm_medium=website-blog&amp;utm_campaign=remove-extra-space-navigation-bar-scroll-view\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-134007\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Convert-Your-eCommercet-1.jpg\" alt=\"convert-your-ecommercet\" width=\"900\" height=\"146\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Convert-Your-eCommercet-1.jpg 900w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Convert-Your-eCommercet-1-300x49.jpg 300w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Convert-Your-eCommercet-1-768x125.jpg 768w\" sizes=\"auto, (max-width: 900px) 100vw, 900px\" \/><\/a><\/p>\n<h3><strong>Procedure to Solve the issue-<\/strong><\/h3>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-3.png\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-817105\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-3.png\" alt=\"How to remove extra space between the Navigation Bar and the Scroll View?\" width=\"760\" height=\"300\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-3.png 760w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-3-300x118.png 300w\" sizes=\"auto, (max-width: 760px) 100vw, 760px\" \/><\/a><\/p>\n<p>There are two ways to resolve the issue. In both the cases we restrict the scroll view to leave extra margin for the Navigation Bar.<\/p>\n<p><strong>1.<\/strong> We can set the Translucent option for Navigation Bar to \u201cFalse\u201d in Xcode<\/p>\n<p>\u2014 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<p>In the below Gif you can see that the view\u2019s layout constraint changes when we enable\/disable the \u201cTranslucent\u201d property of the navigation Bar.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Translucent-1.gif\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-25084 size-full\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Translucent-1.gif\" alt=\"translucent\" width=\"1100\" height=\"708\" \/><\/a><\/p>\n<p>&nbsp;<\/p>\n<p><strong>2.<\/strong> We can disable \u201cAdjust Scroll View Insets\u201d property of the ViewController.<\/p>\n<p>\u2014 This will restrict the Scroll View to leave extra space for the Navigation bar on top.<\/p>\n<p>&nbsp;<\/p>\n<p><a href=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2.png\" target=\"_blank\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter wp-image-25085 size-full\" src=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2.png\" alt=\"ViewController\" width=\"2292\" height=\"1336\" srcset=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2.png 2292w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2-300x175.png 300w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2-768x448.png 768w, https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Picture2-2-1024x597.png 1024w\" sizes=\"auto, (max-width: 2292px) 100vw, 2292px\" \/><\/a><\/p>\n<h3><\/h3>\n<h3><strong>Summary<\/strong><\/h3>\n<p>After following the above procedure, you will be able to remove the extra space between the Navigation Bar and Scroll View.<\/p>\n<p>If you face any issues, please feel free to reach us at support@knowband.com. We also provide <a href=\"https:\/\/www.knowband.com\/mobile-app\/\">No Code Mobile App Builder<\/a> for Prestashop, Opencart, Magento 2 and Woocommerce. Know more here:<\/p>\n<p><iframe loading=\"lazy\" title=\"YouTube video player\" src=\"https:\/\/www.youtube.com\/embed\/W5A2qMachUw\" width=\"660\" height=\"315\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe><\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Objectives of the blog After reading this blog we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10. Problem Statement When we add a scroll view or table view (any scrollable view) in a view controller [&hellip;]<\/p>\n","protected":false},"author":11,"featured_media":817102,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_kbui_enabled":"","footnotes":""},"categories":[859],"tags":[7370,1035,9093],"class_list":["post-25082","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-mobile-app","tag-ios","tag-ios-app","tag-scroll-view"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>How to remove extra space between the Navigation Bar and the Scroll View?<\/title>\n<meta name=\"description\" content=\"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to remove extra space between the Navigation Bar and the Scroll View?\" \/>\n<meta property=\"og:description\" content=\"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/\" \/>\n<meta property=\"og:site_name\" content=\"Knowband Blog | Ecommerce Modules\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/Knowband\" \/>\n<meta property=\"article:published_time\" content=\"2019-03-07T11:56:02+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-07-19T10:24:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"760\" \/>\n\t<meta property=\"og:image:height\" content=\"300\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Akash Sharma\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@KnowbandPlugin\" \/>\n<meta name=\"twitter:site\" content=\"@KnowbandPlugin\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Akash Sharma\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/\"},\"author\":{\"name\":\"Akash Sharma\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/person\\\/ef7cba7baa8b174cc01029e0b203bddc\"},\"headline\":\"How to remove extra space between the Navigation Bar and the Scroll View?\",\"datePublished\":\"2019-03-07T11:56:02+00:00\",\"dateModified\":\"2022-07-19T10:24:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/\"},\"wordCount\":443,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/Main-Banner-Remove-Space-Bar-1.png\",\"keywords\":[\"iOS\",\"iOS App\",\"scroll view\"],\"articleSection\":[\"Mobile App\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/\",\"name\":\"How to remove extra space between the Navigation Bar and the Scroll View?\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/Main-Banner-Remove-Space-Bar-1.png\",\"datePublished\":\"2019-03-07T11:56:02+00:00\",\"dateModified\":\"2022-07-19T10:24:40+00:00\",\"description\":\"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/Main-Banner-Remove-Space-Bar-1.png\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/03\\\/Main-Banner-Remove-Space-Bar-1.png\",\"width\":760,\"height\":300,\"caption\":\"How to remove extra space between the Navigation Bar and the Scroll View?\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/mobile-app\\\/remove-extra-space-navigation-bar-scroll-view\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to remove extra space between the Navigation Bar and the Scroll View?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#website\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\",\"name\":\"Knowband Blog | Ecommerce Modules\",\"description\":\"Magento, Prestashop, Opencart, Shopify\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#organization\",\"name\":\"Knowband Blog | Ecommerce Modules\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2016\\\/09\\\/cropped-knowband_logo-v2.png\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2016\\\/09\\\/cropped-knowband_logo-v2.png\",\"width\":153,\"height\":61,\"caption\":\"Knowband Blog | Ecommerce Modules\"},\"image\":{\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/Knowband\",\"https:\\\/\\\/x.com\\\/KnowbandPlugin\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/fr\\\/#\\\/schema\\\/person\\\/ef7cba7baa8b174cc01029e0b203bddc\",\"name\":\"Akash Sharma\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/10\\\/1392073474142574760-150x150.jpg\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/10\\\/1392073474142574760-150x150.jpg\",\"contentUrl\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/10\\\/1392073474142574760-150x150.jpg\",\"caption\":\"Akash Sharma\"},\"description\":\"I'm Akash Sharma, an engineering graduate and software developer by profession. Challenges fascinate me and I like solving them.\",\"url\":\"https:\\\/\\\/www.knowband.com\\\/blog\\\/author\\\/asharma\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to remove extra space between the Navigation Bar and the Scroll View?","description":"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/","og_locale":"en_US","og_type":"article","og_title":"How to remove extra space between the Navigation Bar and the Scroll View?","og_description":"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.","og_url":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/","og_site_name":"Knowband Blog | Ecommerce Modules","article_publisher":"https:\/\/www.facebook.com\/Knowband","article_published_time":"2019-03-07T11:56:02+00:00","article_modified_time":"2022-07-19T10:24:40+00:00","og_image":[{"width":760,"height":300,"url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png","type":"image\/png"}],"author":"Akash Sharma","twitter_card":"summary_large_image","twitter_creator":"@KnowbandPlugin","twitter_site":"@KnowbandPlugin","twitter_misc":{"Written by":"Akash Sharma","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#article","isPartOf":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/"},"author":{"name":"Akash Sharma","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/person\/ef7cba7baa8b174cc01029e0b203bddc"},"headline":"How to remove extra space between the Navigation Bar and the Scroll View?","datePublished":"2019-03-07T11:56:02+00:00","dateModified":"2022-07-19T10:24:40+00:00","mainEntityOfPage":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/"},"wordCount":443,"commentCount":1,"publisher":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#primaryimage"},"thumbnailUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png","keywords":["iOS","iOS App","scroll view"],"articleSection":["Mobile App"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/","url":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/","name":"How to remove extra space between the Navigation Bar and the Scroll View?","isPartOf":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#primaryimage"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#primaryimage"},"thumbnailUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png","datePublished":"2019-03-07T11:56:02+00:00","dateModified":"2022-07-19T10:24:40+00:00","description":"we will be able to understand the reason for the extra space between top Navigation Bar and Scroll View in iOS app in versions iOS 7 to iOS 10.","breadcrumb":{"@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#primaryimage","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2019\/03\/Main-Banner-Remove-Space-Bar-1.png","width":760,"height":300,"caption":"How to remove extra space between the Navigation Bar and the Scroll View?"},{"@type":"BreadcrumbList","@id":"https:\/\/www.knowband.com\/blog\/mobile-app\/remove-extra-space-navigation-bar-scroll-view\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.knowband.com\/blog\/fr\/"},{"@type":"ListItem","position":2,"name":"How to remove extra space between the Navigation Bar and the Scroll View?"}]},{"@type":"WebSite","@id":"https:\/\/www.knowband.com\/blog\/fr\/#website","url":"https:\/\/www.knowband.com\/blog\/fr\/","name":"Knowband Blog | Ecommerce Modules","description":"Magento, Prestashop, Opencart, Shopify","publisher":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.knowband.com\/blog\/fr\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.knowband.com\/blog\/fr\/#organization","name":"Knowband Blog | Ecommerce Modules","url":"https:\/\/www.knowband.com\/blog\/fr\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/logo\/image\/","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2016\/09\/cropped-knowband_logo-v2.png","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2016\/09\/cropped-knowband_logo-v2.png","width":153,"height":61,"caption":"Knowband Blog | Ecommerce Modules"},"image":{"@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/Knowband","https:\/\/x.com\/KnowbandPlugin"]},{"@type":"Person","@id":"https:\/\/www.knowband.com\/blog\/fr\/#\/schema\/person\/ef7cba7baa8b174cc01029e0b203bddc","name":"Akash Sharma","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2018\/10\/1392073474142574760-150x150.jpg","url":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2018\/10\/1392073474142574760-150x150.jpg","contentUrl":"https:\/\/www.knowband.com\/blog\/wp-content\/uploads\/2018\/10\/1392073474142574760-150x150.jpg","caption":"Akash Sharma"},"description":"I'm Akash Sharma, an engineering graduate and software developer by profession. Challenges fascinate me and I like solving them.","url":"https:\/\/www.knowband.com\/blog\/author\/asharma\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/posts\/25082","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/comments?post=25082"}],"version-history":[{"count":11,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/posts\/25082\/revisions"}],"predecessor-version":[{"id":817106,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/posts\/25082\/revisions\/817106"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/media\/817102"}],"wp:attachment":[{"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/media?parent=25082"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/categories?post=25082"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.knowband.com\/blog\/wp-json\/wp\/v2\/tags?post=25082"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}