I have an activity.xml.
As you can see, it's a relative layout. I am hoping that the Frame layout which will contain the fragment, will be below the toolbar.
The fragment is added, for sure. But it's added at the top, covering the toolbar. Just wondering what I am doing wrong.
The website wouldn't let me add code for some reason. It was telling me it's not properly formatted. here is the activity.xml layout.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:fitsSystemWindows="true"
>
<!--scroll|snap-->
<android.support.v7.widget.Toolbar
android:id="#+id/appToolBar"
android:layout_width="match_parent"
android:layout_height="#dimen/toolBarHeight"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:id="#android:id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/appToolBar"/>
</RelativeLayout>
And this is simply what I am doing in the Activity.java file.
getFragmentManager().beginTransaction().add(android.R.id.content, SetupFrag.createInstance(false), SETUP_FRAGMENT).commit();
You're using an existing id, #android:id/content
You should use + to add your own ID, #+id/content, otherwise the fragment is being added to the content view (the level above your activity layout).
You should use a different root Layout.
RelativeLayout will layout its children relatively to each other.
What you want instead is a LinearLayout with a vertical orientation.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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:fitsSystemWindows="true"
android:orientation="vertical"
>
<android.support.v7.widget.Toolbar
android:id="#+id/appToolBar"
android:layout_width="match_parent"
android:layout_height="#dimen/toolBarHeight"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
Related
I currently have a Toolbar and a FrameLayout in the activity. The problem is that during runtime, the FrameLayout expands and covers the toolbar, which I do not want. How should I modify the toolbar so that it stays on top of all views under it?
The layout file :
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
mapbox:layout_constraintBottom_toTopOf="#id/frameLayout"
mapbox:layout_constraintLeft_toLeftOf="parent"
mapbox:layout_constraintRight_toRightOf="parent"
mapbox:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="600dp"
mapbox:layout_constraintBottom_toBottomOf="parent"
mapbox:layout_constraintEnd_toEndOf="parent"
mapbox:layout_constraintStart_toStartOf="parent"
mapbox:layout_constraintTop_toBottomOf="#id/toolbar"
android:paddingTop="2dp">
// Map here.
</FrameLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
I have a viewpager consisting of 3 fragments. The first two fragments are simply recyclerViews and they scroll upwards perfectly. However in my third fragment, it's a linear layout and it doesn't scroll upwards:
The first two fragment layouts are just recyclers:
<?xml version="1.0" encoding="utf-8"?>
<androidx.recyclerview.widget.RecyclerView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
</androidx.recyclerview.widget.RecyclerView>
The third fragment that is not scrolling:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:background="#color/backgroundColor"
android:orientation="vertical">
</LinearLayout>
My viewpager layout:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/fragprofile_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorWhite"
android:orientation="vertical">
//Collapsing toolbar, etc
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/fragprofile_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorWhite"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Why is this happening?
You should replace the root LinearLayout with ScrollView or NestedScrollView.
Note 1: Android layouts are not scrollable by default.
Note 2: ScrollView and NestedScrollView must have only one direct child (should be a layout of some sort such as a LinearLayout or ConstraintLayout)
Hope this helps.
I'm trying to pin my toolbar at the top just like a normal 'Action Bar' just like when u click on a twitter post the toolbar up top stays there no matter how much u scroll down.
I found a lot of guides on "how to make the Toolbar collapse and other cool effects" but what i want from it, is to act as an Action bar and stay at the top, is there a simple way of accomplishing that ? without the use of (CoordinatorLayout, CollapsingToolbarLayout, ...) ?
Yes you can pin your toolbar at the top of the activity for that you have to create a layout file named toolbar_layoutlike this
<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="?android:actionBarSize"
android:background="#color/colorPrimary"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
android:theme="#style/ToolbarStyle"
app:titleTextColor="#color/colorWhite"
app:subtitleTextColor="#color/colorWhite"
app:titleTextAppearance="#style/ToolbarStyle"/>
And in the activity layout i.e activity_main file include it as like this:-
<LinearLayout
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:orientation="vertical">
<include layout="#layout/toolbar_layout"/>
</LinearLayout>
And after that design accordingly the layout
Cheers Happy Coding.
You can make your layout xml like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- Your content here -->
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
or put RecyclerView instead of ScrollView + LinearLayout if you have a list
I have fragment, which doesn´t cointains toolbar. Toolbar must stay in activity. This fragment must show main view and bellow viewpager with two fragments. Each fragment is specific. First use custom layout, second use adapter. Each has different height. I tried a lot of libs and ideas, but none of them works as it should (it made scroll longer/shorter than it should or it made crazy UI overlays).
I am trying to do UI where it looks that this all is one layout, meaning, it is scrollable from up to bottom. But I can´t figure it out. I was thinking to use CoordinatorLayout, but I have no idea how.
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"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#FF0000"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="ABCDEFGH" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="GHIKJ" />
</LinearLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
How to make this as scrollable layout in fragment without using toolbar references?
Update: Yes, here are some pictures, I hope it is more clear now.
Wrap your LinearLayout inside an AppBarLayout. Actually AppBarLayout extends LinearLayout so you could just replace your LinearLayout with it.
Even if your app doesn't have a toolbar or an app bar, the AppBarLayout is the view that CoordinatorLayout coordinates with.
Adding the AppBarLayout should provide the behavior you're looking for.
This root fragment layout seems to working. I am not sure that this is best solution, but it works.
Note: I replaced listview by standard LinearLayout as root container and inflate child layouts (items) there.
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
android:id="#+id/main_content"
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:layout_width="match_parent"
android:layout_height="250dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|enterAlways">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
Child fragment (for viewpager):
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/childFragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"/>
</android.support.v4.widget.NestedScrollView>
Hello so I want to achieve this with the toolbar and I have seen many tutorials which explain how to do it with all the layout in one XML file.
However, I do not know how to solve this problem in the following use case
I have an XML file which defines my toolbar
<?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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:paddingTop="#dimen/app_bar_top_padding"
app:theme="#style/Base.ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
Then I include this toolbar in an activity layout (linear layout root) which contains a frame layout as a container for a fragment
<include
android:id="#+id/app_bar"
layout="#layout/app_bar" />
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
Now this fragment is inflated dynamically and the fragment is a recycler view.
Can someone point me into how I link CoordinatorLayout with this common arrangement?
Thanks !
EDIT Have solved this issue but let me know if there is a mistake
My Activity Layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="#layout/toolbar"/>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.design.widget.CoordinatorLayout>
<include layout="#layout/navigation_drawer"/>
</android.support.v4.widget.DrawerLayout>
My Toolbar layout which has the scroll flags
<?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="wrap_content"
android:background="#color/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
android:theme="#style/ToolbarStyle"
app:theme="#style/ToolbarStyle">
</android.support.v7.widget.Toolbar>
That shouldn't be a problem as long as the Toolbar is added to a CoordinatorLayout, wrapped in an AppBarLayout. If you've tried it and still have problems, show the code you've tried and we can work through that.