Here is my try for hiding ToolBar after Scrolling down:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<WebView
android:layout_width="match_parent"
android:id="#+id/webview"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_height="match_parent">
</WebView>
</android.support.design.widget.CoordinatorLayout>
I need to when WebView scrolling down, The ToolBar hided.
How we can do that?
As always, my style is:
Theme.AppCompat.Light.NoActionBar
Put WebView in NestedScrollView:
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<WebView
android:id="#+id/web_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</android.support.v4.widget.NestedScrollView>
But, after thet, I have hardly scrolling on the horizontal axis. Please, post the comment if you find proper solution.
Related
I want to hide the toolbar when scrolling down so I use coordinate layout and that layout I need to use webview.
when I use swiperefreshlayout inside nestedscrollview my webview doesn't show up.
How can I solve this problem?
Here is the layout file:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".WebActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</com.google.android.material.appbar.AppBarLayout>
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<WebView
android:id="#+id/wv"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
You obviously need to use SwipeRefreshLayout outside of NestedScrollView:
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.core.widget.NestedScrollView
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
Also, please be aware of using WebView inside the NestedScrollView, they might not work properly without adding:
android:nestedScrollingEnabled="true"
To the WebView. Also, set the android:layout_height of WebView to wrap_content, then it should work as expected.
I have this very simple layout:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ActionBarThemeOverlay">
<!--<include layout="#layout/include_toolbar_actionbar" />-->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways" />
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/background"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
I add a Fragment with a standard RecyclerView into fragment_container. Unfortunately, the Toolbar is always hide, I can't understand why?
Thank you very much for your help guys!
You could try this: solution from similar question.
Basically, you have to use android.support.v4.widget.NestedScrollView instead of ScrollView (in your fragment) and implement app:layout_behavior="#string/appbar_scrolling_view_behavior" inside your NestedScrollView xml.
I have made Toolbar using coordinate toolbar in my app so that i can hide toolbar while scrolling . I also have ViewPager inside it . So when user scroll only Toolbar hides and tabs stick to the top . But in other activity i just want to display toolbar what is the better way to that ?
I am sharing my coordinator layout below
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/AppBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/orange"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/white">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/MyTabLayout"
style="#style/TabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
app:tabTextAppearance="#style/AppTabTextAppearance">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/MyViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/MyTabLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
></android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>
Create a separate layout for toolbar only.
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#color/white"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/white">
</android.support.v7.widget.Toolbar>
Then now its in anywhere in your layout.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/AppBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
layout="#layout/toolbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<android.support.design.widget.TabLayout
android:id="#+id/MyTabLayout"
style="#style/TabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
app:tabTextAppearance="#style/AppTabTextAppearance">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/MyViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/MyTabLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>
If you just want to display Toolbar inside other Activities, you can add the Toolbar to any root layout of the respective Activity like LinearLayout or RelativeLayout (which ever suits your app's needs).
I generated a swipe activity. The activity needs to have it's own layout with a view pager underneath
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.mferreira.crm.recordSwipeActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_item_view" />
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
My only issue is at runtime the fragments are displayed inline with the layout itself at the top of the page rather than underneath it
It seems like your issue is because the top-level CoordinatorLayout behaves like a FrameLayout, not a LinearLayout. If you want your #layout/content_item_view and your ViewPager not to be inline with each other, wrap them in a LinearLayout:
<LinearLayout android:layout_width="match_parent" android:layout_height="match_parent"
android:orientation="vertical" app:layout_behavior="#string/appbar_scrolling_view_behavior">
<include layout="#layout/content_item_view" />
<android.support.v4.view.ViewPager android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
I am new to android , in my application am using navigation drawer activity (Materail Design) and have a webview in a Fragment . The Navigation loads webview without any problem . But i cannot scroll the webview vertically , i can do horizontally .I can see the vertial scroll bar on horzontal scroll , but not functional.
Here is the Fragment XML code
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorDefaultGray"
tools:context="com.cell.cell.fragments.MainWebViewFragmant">
<WebView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/webViewMainWebview"
/>
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/progressBar"
android:layout_gravity="center" />
</FrameLayout>
app_bar_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.cell.cell.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"></FrameLayout>
</android.support.design.widget.AppBarLayout>
<!--<include layout="#layout/content_main" />-->
</android.support.design.widget.CoordinatorLayout>
I tried different solution , such as NestedWebView and tried to put the webview tag inside NestedScrollview ,but no luck.
Please provide a solution for this
Thanks in advance
You are accidentally wrapping your FrameLayout in your AppBarLayout, move your FrameLayout underneath the AppBarLayout.
So what is happening is the AppBarLayout is taking your scroll event instead of the WebView.
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.cell.cell.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<!-- Move your FrameLayout outside the AppBarLayout -->
<FrameLayout
android:id="#+id/fragment_container"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.design.widget.CoordinatorLayout>