{"id":21743958,"url":"https://github.com/telefonica/android-nested-scroll-webview","last_synced_at":"2025-04-13T05:07:29.886Z","repository":{"id":55126413,"uuid":"520097845","full_name":"Telefonica/android-nested-scroll-webview","owner":"Telefonica","description":"Android WebView implementation for nested scrolling layouts","archived":false,"fork":false,"pushed_at":"2024-12-20T13:00:24.000Z","size":151,"stargazers_count":29,"open_issues_count":5,"forks_count":7,"subscribers_count":22,"default_branch":"main","last_synced_at":"2025-04-13T05:07:24.822Z","etag":null,"topics":["cdco","managed","org-cdo","srv-novum"],"latest_commit_sha":null,"homepage":"","language":"Java","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Telefonica.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2022-08-01T12:18:38.000Z","updated_at":"2025-02-20T02:40:10.000Z","dependencies_parsed_at":"2024-12-20T14:18:14.403Z","dependency_job_id":"e29a8b7c-2814-4646-a010-799d70c22b15","html_url":"https://github.com/Telefonica/android-nested-scroll-webview","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telefonica%2Fandroid-nested-scroll-webview","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telefonica%2Fandroid-nested-scroll-webview/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telefonica%2Fandroid-nested-scroll-webview/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Telefonica%2Fandroid-nested-scroll-webview/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Telefonica","download_url":"https://codeload.github.com/Telefonica/android-nested-scroll-webview/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248665747,"owners_count":21142123,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["cdco","managed","org-cdo","srv-novum"],"created_at":"2024-11-26T07:09:34.154Z","updated_at":"2025-04-13T05:07:29.863Z","avatar_url":"https://github.com/Telefonica.png","language":"Java","readme":"\u003cp\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Platform-Android-brightgreen\" /\u003e\n    \u003cimg src=\"https://maven-badges.herokuapp.com/maven-central/com.telefonica/nestedscrollwebview/badge.png\" /\u003e\n    \u003cimg src=\"https://img.shields.io/badge/Support-%3E%3D%20Android%205.0-brightgreen\" /\u003e\n\u003c/p\u003e\n\n# Android Nested Scroll WebView\n\nAndroid WebView implementation for nested scrolling layouts.\n\n## Introduction\n\nIn case you have a native application that uses a collapsing toolbar layout, you may need to wrap your webview into a [NestedScrollingView](https://developer.android.com/reference/androidx/core/widget/NestedScrollView) to handle correctly nested scrolling to expand/collapse the toolbar.\n\nThis is usually done like this:\n```xml\n\u003candroidx.core.widget.NestedScrollView\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\n    app:layout_behavior=\"@string/appbar_scrolling_view_behavior\"\u003e\n\n    \u003cWebView\n        android:id=\"@+id/webView\"\n        android:layout_width=\"match_parent\"\n        android:layout_height=\"match_parent\"/\u003e\n\n\u003c/androidx.core.widget.NestedScrollView\u003e\n```\n\nYou may quickly realize that **webview viewport height takes all content size height**. So, for all effects, you are using a browser window with an infinite viewport height, which has important implications:\n* If page content is long, this may suppose performance penalties as whole page must be rendered.\n* In case of scrolling pages where new content is continuously loaded as user scrolls down the page, it will trigger all these loads automatically, this could end on serious performance problems. Think about a \"infinite\" news feed for example.\n* Page content based on viewport height may be displayed wrongly. Think about on fixed footer elements for example, these will be always displayed at the end of the scrollable content.\n\nIf you are thinking on using the `android:fillViewport=\"false\"` property for your NestedScrollView, you won't be able to perform any scroll on your webview content...\n\nNestedScrollWebview implementation avoids this \"height issue\", making webview to have correct viewport size, while working with a collapsable toolbar layout.\n\n## How to use it?\n\nJust include directly the `NestedScrollWebView` in your layout:\n\n```xml\n\u003c?xml version=\"1.0\" encoding=\"utf-8\"?\u003e\n\u003candroidx.coordinatorlayout.widget.CoordinatorLayout\n    xmlns:android=\"http://schemas.android.com/apk/res/android\"\n    xmlns:app=\"http://schemas.android.com/apk/res-auto\"\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\u003e\n\n    \u003ccom.google.android.material.appbar.AppBarLayout\n        android:id=\"@+id/app_bar\"\n        android:layout_width=\"match_parent\"\n        android:layout_height=\"@dimen/app_bar_height\"\n        android:theme=\"@style/Theme.NestedScrollWebViewDemo.AppBarOverlay\"\u003e\n\n        \u003ccom.google.android.material.appbar.CollapsingToolbarLayout\n            android:id=\"@+id/toolbar_layout\"\n            style=\"@style/Widget.MaterialComponents.Toolbar.Primary\"\n            android:layout_width=\"match_parent\"\n            android:layout_height=\"match_parent\"\n            app:contentScrim=\"?attr/colorPrimary\"\n            app:layout_scrollFlags=\"scroll|exitUntilCollapsed\"\n            app:toolbarId=\"@+id/toolbar\"\u003e\n\n            \u003candroidx.appcompat.widget.Toolbar\n                android:id=\"@+id/toolbar\"\n                android:layout_width=\"match_parent\"\n                android:layout_height=\"?attr/actionBarSize\"\n                app:layout_collapseMode=\"pin\"\n                app:popupTheme=\"@style/Theme.NestedScrollWebViewDemo.PopupOverlay\" /\u003e\n\n        \u003c/com.google.android.material.appbar.CollapsingToolbarLayout\u003e\n    \u003c/com.google.android.material.appbar.AppBarLayout\u003e\n\n    \u003ccom.telefonica.nestedscrollwebview.NestedScrollWebView\n        android:id=\"@+id/webView\"\n        android:layout_width=\"match_parent\"\n        android:layout_height=\"match_parent\"\n        app:layout_behavior=\"@string/appbar_scrolling_view_behavior\" /\u003e\n\n\u003c/androidx.coordinatorlayout.widget.CoordinatorLayout\u003e\n```\n\n## Configuration\n\nUtility methods for specific WebView content requirements.\n\n### Adjust WebView bottom margin to match CoordinatorLayout visible space\n\nWhen expanding toolbar inside a CoordinatorLayout, instead of resizing the space left by the toolbar, it pushes down the content below.\n\nThis may be an issue for example for pages where a fixed footer element is displayed. So, in order to correctly resize the webview viewport on these expands you can add this attribute to the NestedScrollWebView.\n\n`app:coordinatorBottomMatchingEnabled={\"true\"|\"false\"}`\n\nThis is **disabled by default**, as webview resizing is expensive.\n\n```xml\n\u003ccom.telefonica.nestedscrollwebview.NestedScrollWebView\n    android:id=\"@+id/webView\"\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\n    app:coordinatorBottomMatchingEnabled=\"true\"\n    app:layout_behavior=\"@string/appbar_scrolling_view_behavior\" /\u003e\n```\n\n### Block vertical nested scrolling on WebView internal elements scrolls\n\nIf your WebView content includes scrollable elements such as horizontal carousels or map views, nested scrolling should not be performed when scrolling these.\n\n`app:blockNestedScrollingOnInternalContentScrolls={\"true\"|\"false\"}`\n\nThis is **enabled by default**, but can be disabled with this flag in case it does not work properly in any specific situation.\n\n```xml\n\u003ccom.telefonica.nestedscrollwebview.NestedScrollWebView\n    android:id=\"@+id/webView\"\n    android:layout_width=\"match_parent\"\n    android:layout_height=\"match_parent\"\n    app:blockNestedScrollingOnInternalContentScrolls=\"false\"\n    app:layout_behavior=\"@string/appbar_scrolling_view_behavior\" /\u003e\n```\n\n## How we do it?\n\nImplementation extends [WebView](https://developer.android.com/reference/android/webkit/WebView) applying nested scrolling code logic from androidx.core [NestedScrollView](https://developer.android.com/reference/androidx/core/widget/NestedScrollView).\n\n## Videos\n\u003ctable\u003e\n\u003ctr\u003e\n\u003ctd\u003e\n\u003cvideo src=\"https://user-images.githubusercontent.com/5360064/198062480-4f3d6908-fdcf-446f-bc8c-625635b308f9.mp4\" /\u003e\n\u003c/td\u003e\n\u003ctd\u003e\n\u003cvideo src=\"https://user-images.githubusercontent.com/5360064/198062613-f77eaf9b-bf6b-48aa-b514-b86ccc910102.mp4\" /\u003e\n\u003c/td\u003e\n\u003c/tr\u003e\n\u003c/table\u003e\n\n# Usage\n\nTo include the library add to your app's `build.gradle`:\n\n```gradle\nimplementation 'com.telefonica:nestedscrollwebview:{version}'\n```\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftelefonica%2Fandroid-nested-scroll-webview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftelefonica%2Fandroid-nested-scroll-webview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftelefonica%2Fandroid-nested-scroll-webview/lists"}