I have made 3 fragments with views that I scroll through horizontally. In each fragment view I am going to have an image that is larger then the screen and when the screen is scrolled the image will move slightly in that same direction with a parallax effect inside its parent view.
I have done lots of research and the only working version of a parallax effect I have found was for a vertical list view. I have tried to apply the same principals but its not working. It appears there is something wrong with this v.getLocalVisibleRect(r) as its returning 0,0,0,0 for the image. I need to know how to get this image moving.
Main
public class MainActivity extends FragmentActivity {
ViewPager viewpager;
ImageView image;
private int lastTop = 0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewpager = (ViewPager) findViewById(R.id.pager);
PagerAdapter padapter = new PagerAdapter(getSupportFragmentManager());
viewpager.setAdapter(padapter);
//Parallax attempt
View view = LayoutInflater.from(getApplication()).inflate(R.layout.fragment_one_layout, null);
image = (ImageView) view.findViewById(R.id.image1);
viewpager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
parallax(image);
}
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
}); // End of attempt
}
//Parallax method
public void parallax(final View v) {
final Rect r = new Rect();
v.getLocalVisibleRect(r);
if (lastTop != r.top) {
lastTop = r.top;
v.post(new Runnable() {
@Override
public void run() {
v.setX((float) (r.top / 2.0));
}
});
}
}
}
PageAdapter
public class PagerAdapter extends FragmentPagerAdapter {
public PagerAdapter(FragmentManager fm) {
super(fm);
// TODO Auto-generated constructor stub
}
@Override
public Fragment getItem(int arg0) {
// TODO Auto-generated method stub
switch (arg0) {
case 0:
return new FragmentOne();
case 1:
return new FragmentTwo();
case 2:
return new FragmentThree();
default:
break;
}
return null;
}
@Override
public int getCount() {
// TODO Auto-generated method stub
return 3;
}
}
Activity_main layout
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</FrameLayout>
FragmentOne Layout - Other fragments are the same with different ImageViews.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".Activity.MainActivity"
android:id="@+id/fone">
<ImageView
android:layout_width="427dp"
android:layout_height="568dp"
android:id="@+id/image1"
android:src="@drawable/city"
android:adjustViewBounds="true"
android:scaleType="centerCrop"/>
</FrameLayout>