I have an Activity with following XML
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:descendantFocusability="beforeDescendants">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<fragment android:name=".GalleryFragment"
android:id="#+id/gallery_fragment"
android:layout_width="match_parent"
android:layout_height="250dp"
android:transitionName="#string/transition">
...
</LinearLayout>
GalleryFragment with following XML
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:transitionName="#string/transition">
<android.support.v4.view.ViewPager
android:id="#+id/gallery_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
and ViewPager is hosting a couple (max 20) ImageFragments with following XML
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:scaleType="centerCrop"/>
</LinearLayout>
Now I would like to add collapsable toolbar with parallax effect in such a way that ImageView from ImageFragment is the one which fades out as it collapses.
I have done this couple of times on much more simpler screens, I had only activity with toolbar and ImageView in it so the process was straightforward. But in this case I have no idea if this is even possible to implement because ImageView is inside Fragment which is inside ViewPager.
Does anyone know if this is even possible to implement and if so can you give me some tips.
Thanks is advance.
Related
I have an activity that have viewpager inside scrollview like the follwoing
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!--someViews-->
</LinearLayout>
<!--then viewPager-->
<androidx.viewpager.widget.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</ScrollView>
Then the view pager holds some fragments which have a tall view too.
The problem is the scroll view not scrolling because of the view is not need to scroll but the view inside the viewpager fragment's not scrolling
so, Is it possible to make the whole view including the inside view pager scroll as one view?
What I am saying that I don't need to scroll the viewpager fragment as separated part I need to scroll it as part of activity view.
Thanks
I believe the setup you are looking for would work inside a CoordinatorLayout using the NestedScrollView widget like so:
<?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">
<androidx.core.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Display1" />
<TextView
android:id="#+id/subTitle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/subtitle"
android:textAppearance="#style/Base.TextAppearance.AppCompat.Body1" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="300dp" />
</LinearLayout>
</androidx.core.widget.NestedScrollView>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
I have just tested this with a sample project with a single text view in a Fragment and I was able to both scroll the view and swipe through the pages.
Please note though: I did have to provide a specific height for the ViewPager in order for it to display.
I have a Fragment that contains a ViewPager which allows the user to swipe through three fragments.
Here's the problem: I want the ViewPager to have a background that remains fixed when the user swipes through the fragments. I tried setting an image in my drawable as the background of the ViewPager but that didn't work.. Here's my code:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue"
tools:context=".fragments.cash.WalletFragment">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:background="#drawable/revenue"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
Although there are many ways to achieve this feat, this approach works for me:
Simply create a FrameLayout with two children: Your ViewPager and the view(s) you want to use as the background of your viewpager. Here's an example:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/blue"
tools:context=".fragments.cash.WalletFragment">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/my_smiling_face"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</FrameLayout>
</RelativeLayout>
Note that you can replace the Imageview with a layout (e.g RelativeLayout) containing all the composite views you want your background to contain.
I hope this helps.. Merry coding!
I have an activity layout that includes my fragment container this way,
<include
layout="#layout/content_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/background_container" />
and my fragment container is compose of linearlayout and a framelayout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:padding="10dp">
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent" />
</LinearLayout>
The problem is that I have to add my scrollable fragment in this container but the scroll doesnt seem to work. My layout goes like this
<ScrollView 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:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
...
</LinearLayout>
</ScrollView>
I have tried several answer like
Using NestedScrollView
Adding minimum height to framelayout
Using fillViewport="true"
etc.
But nothing seems to work. Any idea what I've been doing wrong? Any help would be appreciated. Thanks in advance! Cheers!
Edit:
My activity layout contains navigation drawer, i dont know if it matter. And i add the view using
ft.replace(R.id.fragment_container, myFragment).commit();
i also dont know if fragment replace messes with my view. Please help. Thanks
it seems my fragment container's LinearLayout is missing orientation and also frameLayout
android:layout_height should be match_parent
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:orientation="vertical" // orientation
android:padding="10dp">
<FrameLayout
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent" // match_parent
android:background="#android:color/transparent" />
</LinearLayout>
I have more than one Fragment in Viewpager ,on long press I want to scale down the Viewpager in the middle of screen as shown in below image. I want to show All fragments in Viewpager like android OS on Home screen. I am doing this by using library,
compile 'com.pixplicity.multiviewpager:library:1.0'
Here is xml file,
<com.pixplicity.multiviewpager.MultiViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bott_sidemenu"
app:matchChildWidth="#+id/vg" />
Here is child layout,
<RelativeLayout 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="${relativePackage}.${activityClass}" >
<FrameLayout
android:id="#+id/vg"
android:layout_width="200dp"
android:layout_height="match_parent"
android:layout_centerInParent="true" >
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
android:background="#drawable/bg_page"
android:scaleType="centerInside"
android:src="#drawable/im_pixplicity"
tools:ignore="ContentDescription" />
</FrameLayout>
</RelativeLayout>
But all item size does not scale down inside the Viewpager Fragment. Is there a way to so way? Suggestion will be appreciated.
The main page has two view pagers.
Top view pager used for circular page indicator (jakewharton viewpagerindicator) which displays different images.
Below that I have a view pager for implementing sliding tabs with GridView on each tap.
Please find the xml code below
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".Shopping">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"></include>
<TextView
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="#faca07">
</TextView>
<android.support.v4.view.ViewPager
android:id="#+id/pager1"
android:layout_width="match_parent"
android:layout_height="135dp"
android:layout_above="#+id/titles"
android:overScrollMode="never"></android.support.v4.view.ViewPager>
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/titles"
style="#style/CustomCirclePageIndicator"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:padding="5dp" />
<tabs.SlidingTabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:elevation="2dp"
android:overScrollMode="always" />
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="wrap_content"
android:layout_height="match_parent"
></android.support.v4.view.ViewPager>
</LinearLayout>
</ScrollView>
I need to implement scroll view for the whole page, tried using common ScrollView which doesn't work.
GridView has separate scroll, which is working properly, but I want a common scroll for both view pagers.
Any help would be really greatful.
Thanks.