下面来看一个效果:
完整代码如下:
public class MainActivity extends AppCompatActivity {
private ParallaxViewPager vp;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
android.support.v4.app.FragmentManager fragmentManager =
getSupportFragmentManager();
vp = findViewById(R.id.parallax_vp);
vp.setLayout(fragmentManager,new int[] {
R.layout.fragment_page_first,
R.layout.fragment_page_second,
R.layout.fragment_page_third});
}
}
public class ParallaxViewPager extends ViewPager {
private List<ParallaxFragment> fragments = new ArrayList<>();
public ParallaxViewPager(@NonNull Context context) {
this(context,null);
}
public ParallaxViewPager(@NonNull Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
}
public void setLayout(FragmentManager fm,int [] layoutIds){
fragments.clear();
for (int layoutId : layoutIds) {
ParallaxFragment fragment = new ParallaxFragment();
Bundle bundle = new Bundle();
bundle.putInt(ParallaxFragment.ID,layoutId);
fragment.setArguments(bundle);
fragments.add(fragment);
}
setAdapter(new ParallaxAdapter(fm));
// 2.2.3 监听滑动改变位移
addOnPageChangeListener(new OnPageChangeListener() {
// 从第一张图 滑动到 第二张图 滑动的过程
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
// positionOffset值是 0-1 positionOffsetPixels值是 0-屏幕的宽度px
// 获取左边出去的fragment右边进来的fragment
ParallaxFragment outFragment = fragments.get(position) ;
List<View> parallaxViews = outFragment.getViews();
for (View parallaxView : parallaxViews) {
ParallaxTag tag = (ParallaxTag) parallaxView.getTag(R.id.parallax_tag);
// 为什么这样写 ?
parallaxView.setTranslationX((-positionOffsetPixels)*tag.translationXOut);
parallaxView.setTranslationY((-positionOffsetPixels)*tag.translationYOut);
}
try {
ParallaxFragment inFragment = fragments.get(position+1) ;
parallaxViews = inFragment.getViews();
for (View parallaxView : parallaxViews) {
ParallaxTag tag = (ParallaxTag) parallaxView.getTag(R.id.parallax_tag);
parallaxView.setTranslationX((getMeasuredWidth()-positionOffsetPixels)*tag.translationXIn);
parallaxView.setTranslationY((getMeasuredWidth()-positionOffsetPixels)*tag.translationYIn);
}
} catch (Exception e) {
e.printStackTrace();
}
}
// 已经切换完毕
// 已经滑动到具体某一页,比如滑动到第一页、滑动到第二页、滑动到第三页
@Override
public void onPageSelected(int position) {
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
public class ParallaxAdapter extends FragmentPagerAdapter{
public ParallaxAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
return fragments.get(position);
}
@Override
public int getCount() {
return fragments.size();
}
}
}
public class ParallaxFragment extends Fragment
implements LayoutInflater.Factory2 {
private CompatViewInflater mCompatViewInflater ;
public static final String ID = "ids";
//存放所有的需要位移的View
private List<View> mParallaxViews = new ArrayList<>() ;
//存放视差动画的属性
private int[] mParallaxAttrs = new int[]{
R.attr.translationXIn,
R.attr.translationXOut ,
R.attr.translationYIn,
R.attr.translationYOut};
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater,
@Nullable ViewGroup container,
@Nullable Bundle savedInstanceState) {
int layoutId = getArguments().getInt(ID);
inflater = inflater.cloneInContext(getActivity()) ;
LayoutInflaterCompat.setFactory2(inflater,this);
return inflater.inflate(layoutId,container,false);
}
@Override
public View onCreateView(View parent, String name, Context context, AttributeSet attrs) {
// 所有的View都会在这里创建
// 拦截到View的创建 获取View之后要去解析
// 1.创建View
// If the Factory didn't handle it, let our createView() method try
View view = createView(parent , name ,context , attrs) ;
// 2.1 一个 activity的布局肯定对应多个这样的 SkinView
if (view != null){
// 解析所有的 我们关注的属性
analysisAttrs(view , context , attrs) ;
}
return view;
}
/**
* 解析所有的 我们关注的属性
* @param view
* @param context
* @param attrs
*/
private void analysisAttrs(View view, Context context, AttributeSet attrs) {
TypedArray array = context.obtainStyledAttributes(attrs, mParallaxAttrs);
if (array != null && array.getIndexCount() != 0){
int n = array.getIndexCount();
ParallaxTag tag = new ParallaxTag();
for (int i = 0; i < n; i++) {
int attr = array.getIndex(i);
switch (attr){
case 0:
tag.translationXIn = array.getFloat(attr , 0f) ;
break;
case 1:
tag.translationXOut = array.getFloat(attr , 0f) ;
break;
case 2:
tag.translationYIn = array.getFloat(attr , 0f) ;
break;
case 3:
tag.translationYOut = array.getFloat(attr , 0f) ;
break;
}
}
// 自定义属性怎么存? 需要一一绑定,在View上边设置tag
view.setTag(R.id.parallax_tag , tag);
mParallaxViews.add(view) ;
}
array.recycle();
}
private View createView(View parent, String name, Context context, AttributeSet attrs) {
final boolean isPre21 = Build.VERSION.SDK_INT < 21;
if (mCompatViewInflater == null){
mCompatViewInflater = new CompatViewInflater() ;
}
// We only want the View to inherit it's context if we're running pre-v21
final boolean inheritContext = isPre21 && true
&& shouldInheritContext((ViewParent) parent);
return mCompatViewInflater.createView(parent, name, context, attrs, inheritContext,
isPre21, /* Only read android:theme pre-L (L+ handles this anyway) */
true /* Read read app:theme as a fallback at all times for legacy reasons */
);
} ;
private boolean shouldInheritContext(ViewParent parent) {
if (parent == null) {
// The initial parent is null so just return false
return false;
}
while (true) {
if (parent == null) {
// Bingo. We've hit a view which has a null parent before being terminated from
// the loop. This is (most probably) because it's the root view in an inflation
// call, therefore we should inherit. This works as the inflated layout is only
// added to the hierarchy at the end of the inflate() call.
return true;
} else if (!(parent instanceof View)
|| ViewCompat.isAttachedToWindow((View) parent)) {
// We have either hit the window's decor view, a parent which isn't a View
// (i.e. ViewRootImpl), or an attached view, so we know that the original parent
// is currently added to the view hierarchy. This means that it has not be
// inflated in the current inflate() call and we should not inherit the context.
return false;
}
parent = parent.getParent();
}
}
@Override
public View onCreateView(String name, Context context, AttributeSet attrs) {
return null;
}
public List<View> getViews(){
return mParallaxViews;
}
}
CompatViewInflater代码(参考源码):
public class CompatViewInflater {
private static final Class<?>[] sConstructorSignature = new Class[]{
Context.class, AttributeSet.class};
private static final int[] sOnClickAttrs = new int[]{android.R.attr.onClick};
private static final String LOG_TAG = "AppCompatViewInflater";
private static final Map<String, Constructor<? extends View>> sConstructorMap
= new ArrayMap<>();
private final Object[] mConstructorArgs = new Object[2];
public final View createView(View parent, final String name, @NonNull Context context,
@NonNull AttributeSet attrs, boolean inheritContext,
boolean readAndroidTheme, boolean readAppTheme) {
final Context originalContext = context;
// We can emulate Lollipop's android:theme attribute propagating down the view hierarchy
// by using the parent's context
if (inheritContext && parent != null) {
context = parent.getContext();
}
if (readAndroidTheme || readAppTheme) {
// We then apply the theme on the context, if specified
context = themifyContext(context, attrs, readAndroidTheme, readAppTheme);
}
View view = null;
// We need to 'inject' our tint aware Views in place of the standard framework versions
switch (name) {
case "TextView":
view = new AppCompatTextView(context, attrs);
break;
case "ImageView":
view = new AppCompatImageView(context, attrs);
break;
case "Button":
view = new AppCompatButton(context, attrs);
break;
case "EditText":
view = new AppCompatEditText(context, attrs);
break;
case "Spinner":
view = new AppCompatSpinner(context, attrs);
break;
case "ImageButton":
view = new AppCompatImageButton(context, attrs);
break;
case "CheckBox":
view = new AppCompatCheckBox(context, attrs);
break;
case "RadioButton":
view = new AppCompatRadioButton(context, attrs);
break;
case "CheckedTextView":
view = new AppCompatCheckedTextView(context, attrs);
break;
case "AutoCompleteTextView":
view = new AppCompatAutoCompleteTextView(context, attrs);
break;
case "MultiAutoCompleteTextView":
view = new AppCompatMultiAutoCompleteTextView(context, attrs);
break;
case "RatingBar":
view = new AppCompatRatingBar(context, attrs);
break;
case "SeekBar":
view = new AppCompatSeekBar(context, attrs);
break;
}
if (view == null) {
// If the original context does not equal our themed context, then we need to manually
// inflate it using the name so that android:theme takes effect.
view = createViewFromTag(context, name, attrs);
}
if (view != null) {
// If we have created a view, check it's android:onClick
checkOnClickListener(view, attrs);
}
return view;
}
private View createViewFromTag(Context context, String name, AttributeSet attrs) {
if (name.equals("view")) {
name = attrs.getAttributeValue(null, "class");
}
try {
mConstructorArgs[0] = context;
mConstructorArgs[1] = attrs;
if (-1 == name.indexOf('.')) {
// try the android.widget prefix first...
return createView(context, name, "android.widget.");
} else {
return createView(context, name, null);
}
} catch (Exception e) {
// We do not want to catch these, lets return null and let the actual LayoutInflater
// try
return null;
} finally {
// Don't retain references on context.
mConstructorArgs[0] = null;
mConstructorArgs[1] = null;
}
}
/**
* android:onClick doesn't handle views with a ContextWrapper context. This method
* backports new framework functionality to traverse the Context wrappers to find a
* suitable target.
*/
private void checkOnClickListener(View view, AttributeSet attrs) {
final Context context = view.getContext();
if (!ViewCompat.hasOnClickListeners(view) || !(context instanceof ContextWrapper)) {
// Skip our compat functionality if: the view doesn't have an onClickListener,
// or the Context isn't a ContextWrapper
return;
}
final TypedArray a = context.obtainStyledAttributes(attrs, sOnClickAttrs);
final String handlerName = a.getString(0);
if (handlerName != null) {
view.setOnClickListener(new DeclaredOnClickListener(view, handlerName));
}
a.recycle();
}
private View createView(Context context, String name, String prefix)
throws ClassNotFoundException, InflateException {
Constructor<? extends View> constructor = sConstructorMap.get(name);
try {
if (constructor == null) {
// Class not found in the cache, see if it's real, and try to add it
Class<? extends View> clazz = context.getClassLoader().loadClass(
prefix != null ? (prefix + name) : name).asSubclass(View.class);
constructor = clazz.getConstructor(sConstructorSignature);
sConstructorMap.put(name, constructor);
}
constructor.setAccessible(true);
return constructor.newInstance(mConstructorArgs);
} catch (Exception e) {
// We do not want to catch these, lets return null and let the actual LayoutInflater
// try
return null;
}
}
/**
* Allows us to emulate the {@code android:theme} attribute for devices before L.
*/
private static Context themifyContext(Context context, AttributeSet attrs,
boolean useAndroidTheme, boolean useAppTheme) {
final TypedArray a = context.obtainStyledAttributes(attrs, android.support.v7.appcompat.R.styleable.View, 0, 0);
int themeId = 0;
if (useAndroidTheme) {
// First try reading android:theme if enabled
themeId = a.getResourceId(android.support.v7.appcompat.R.styleable.View_android_theme, 0);
}
if (useAppTheme && themeId == 0) {
// ...if that didn't work, try reading app:theme (for legacy reasons) if enabled
themeId = a.getResourceId(android.support.v7.appcompat.R.styleable.View_theme, 0);
if (themeId != 0) {
Log.i(LOG_TAG, "app:theme is now deprecated. "
+ "Please move to using android:theme instead.");
}
}
a.recycle();
if (themeId != 0 && (!(context instanceof ContextThemeWrapper)
|| ((ContextThemeWrapper) context).getThemeResId() != themeId)) {
// If the context isn't a ContextThemeWrapper, or it is but does not have
// the same theme as we need, wrap it in a new wrapper
context = new ContextThemeWrapper(context, themeId);
}
return context;
}
/**
* An implementation of OnClickListener that attempts to lazily load a
* named click handling method from a parent or ancestor context.
*/
private static class DeclaredOnClickListener implements View.OnClickListener {
private final View mHostView;
private final String mMethodName;
private Method mResolvedMethod;
private Context mResolvedContext;
public DeclaredOnClickListener(@NonNull View hostView, @NonNull String methodName) {
mHostView = hostView;
mMethodName = methodName;
}
@Override
public void onClick(@NonNull View v) {
if (mResolvedMethod == null) {
resolveMethod(mHostView.getContext(), mMethodName);
}
try {
mResolvedMethod.invoke(mResolvedContext, v);
} catch (IllegalAccessException e) {
throw new IllegalStateException(
"Could not execute non-public method for android:onClick", e);
} catch (InvocationTargetException e) {
throw new IllegalStateException(
"Could not execute method for android:onClick", e);
}
}
@NonNull
private void resolveMethod(@Nullable Context context, @NonNull String name) {
while (context != null) {
try {
if (!context.isRestricted()) {
final Method method = context.getClass().getMethod(mMethodName, View.class);
if (method != null) {
mResolvedMethod = method;
mResolvedContext = context;
return;
}
}
} catch (NoSuchMethodException e) {
// Failed to find method, keep searching up the hierarchy.
}
if (context instanceof ContextWrapper) {
context = ((ContextWrapper) context).getBaseContext();
} else {
// Can't search up the hierarchy, null out and fail.
context = null;
}
}
final int id = mHostView.getId();
final String idText = id == View.NO_ID ? "" : " with id '"
+ mHostView.getContext().getResources().getResourceEntryName(id) + "'";
throw new IllegalStateException("Could not find method " + mMethodName
+ "(View) in a parent or ancestor Context for android:onClick "
+ "attribute defined on view " + mHostView.getClass() + idText);
}
}
}
ParallaxTag代码:
public class ParallaxTag {
public float translationXIn ;
public float translationXOut ;
public float translationYIn ;
public float translationYOut ;
@Override
public String toString() {
return "ParallaxTag{" +
"translationXIn=" + translationXIn +
", translationXOut=" + translationXOut +
", translationYIn=" + translationYIn +
", translationYOut=" + translationYOut +
'}';
}
}
fragment_page_first.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout
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/rootFirstPage"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:background="@android:color/holo_orange_dark"
tools:ignore="ContentDescription">
<ImageView
android:id="@+id/ivFirstImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@mipmap/s_0_1"
app:layout_heightPercent="35%"
app:layout_widthPercent="50%"
app:translationXIn="0.4"
app:translationYIn="0.4"
app:translationYOut="0.4"
app:translationXOut="0.4" />
<ImageView
android:id="@+id/ivSecondImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:src="@mipmap/s_0_2"
app:layout_heightPercent="10%"
app:layout_marginRightPercent="12%"
app:layout_marginTopPercent="27%"
app:layout_widthPercent="12%"
app:translationXIn="0.12"
app:translationYIn="0.82"
app:translationYOut="0.82"
app:translationXOut="0.12" />
<ImageView
android:id="@+id/ivThirdImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_0_3"
app:layout_heightPercent="25%"
app:layout_marginLeftPercent="14%"
app:layout_marginTopPercent="49%"
app:layout_widthPercent="30%"
app:translationXIn="0.16"
app:translationXOut="0.16" />
<ImageView
android:id="@+id/ivFourthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_0_4"
app:layout_heightPercent="15%"
app:layout_marginLeftPercent="14%"
app:layout_marginTopPercent="39%"
app:layout_widthPercent="20%"
app:translationXIn="0.02"
app:translationXOut="0.02" />
<ImageView
android:id="@+id/ivFifthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="@mipmap/s_0_5"
app:layout_heightPercent="15%"
app:layout_marginTopPercent="22%"
app:layout_widthPercent="45%"
app:translationXIn="0.06"
app:translationXOut="0.06" />
<ImageView
android:id="@+id/ivSixthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_0_6"
app:layout_heightPercent="6%"
app:layout_marginLeftPercent="4%"
app:layout_marginTopPercent="26%"
app:layout_widthPercent="6%"
app:translationXIn="0.18"
app:translationXOut="0.18" />
<ImageView
android:id="@+id/ivSeventhImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_0_7"
app:layout_heightPercent="8%"
app:layout_marginLeftPercent="14%"
app:layout_marginTopPercent="25%"
app:layout_widthPercent="9%"
app:translationXIn="0.28"
app:translationXOut="0.28" />
<ImageView
android:id="@+id/ivEighthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_0_8"
app:layout_heightPercent="6%"
app:layout_marginLeftPercent="77%"
app:layout_marginTopPercent="38%"
app:layout_widthPercent="8%"
app:translationXIn="0.34"
app:translationXOut="0.34" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="@string/text_web_ceo"
android:textColor="@android:color/white"
android:textSize="@dimen/text_size_large"
app:layout_heightPercent="15%"
app:layout_marginBottomPercent="11%"
app:layout_widthPercent="45%" />
</android.support.percent.PercentRelativeLayout>
fragment_page_second.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout
android:id="@+id/rootSecondPage"
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:ignore="ContentDescription"
tools:background="@android:color/holo_green_dark">
<ImageView
android:id="@+id/ivFirstImage"
app:translationXIn="0.4"
app:translationXOut="0.4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@mipmap/s_1_1"
app:layout_heightPercent="25%"
app:layout_widthPercent="45%"/>
<ImageView
android:id="@+id/ivSecondImage"
app:translationXIn="1.2"
app:translationXOut="1.2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:alpha=".5"
android:src="@mipmap/s_1_2"
app:layout_heightPercent="6%"
app:layout_marginRightPercent="14%"
app:layout_marginTopPercent="30%"
app:layout_widthPercent="19%"/>
<ImageView
android:id="@+id/ivThirdImage"
app:translationXIn="0.16"
app:translationXOut="0.16"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_1_3"
app:layout_heightPercent="8%"
app:layout_marginLeftPercent="46%"
app:layout_marginTopPercent="43%"
app:layout_widthPercent="15%"/>
<ImageView
android:id="@+id/ivFourthImage"
app:translationXIn="0.2"
app:translationXOut="0.2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_1_4"
app:layout_heightPercent="10%"
app:layout_marginLeftPercent="44%"
app:layout_marginTopPercent="52%"
app:layout_widthPercent="13%"/>
<ImageView
app:translationXIn="0.06"
app:translationXOut="0.06"
android:id="@+id/ivSixthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_1_6"
app:layout_heightPercent="7%"
app:layout_marginLeftPercent="20%"
app:layout_marginTopPercent="47%"
app:layout_widthPercent="20%"/>
<ImageView
app:translationXIn="0.18"
app:translationXOut="0.18"
android:id="@+id/ivSeventhImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_1_7"
app:layout_heightPercent="8%"
app:layout_marginLeftPercent="22%"
app:layout_marginTopPercent="35%"
app:layout_widthPercent="17%"/>
<ImageView
app:translationXIn="0.28"
app:translationXOut="0.28"
android:id="@+id/ivFifthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="@mipmap/s_1_5"
app:layout_heightPercent="10%"
app:layout_marginTopPercent="33%"
app:layout_widthPercent="15%"/>
<ImageView
app:translationXIn="0.14"
app:translationXOut="0.14"
android:id="@+id/ivEighthImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:src="@mipmap/s_1_8"
app:layout_heightPercent="10%"
app:layout_marginTopPercent="22%"
app:layout_widthPercent="25%"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="@string/text_web_dev"
android:textColor="@android:color/white"
android:textSize="@dimen/text_size_large"
app:layout_heightPercent="15%"
app:layout_marginBottomPercent="11%"
app:layout_widthPercent="45%"/>
</android.support.percent.PercentRelativeLayout>
fragment_page_third.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.percent.PercentRelativeLayout
android:id="@+id/rootThirdPage"
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:ignore="ContentDescription"
tools:background="@android:color/holo_blue_dark">
<ImageView
android:id="@+id/ivThirdImage"
app:translationXIn="0.4"
app:translationXOut="0.4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_2_3"
app:layout_heightPercent="40%"
app:layout_marginTopPercent="27%"
app:layout_widthPercent="100%"/>
<ImageView
android:id="@+id/ivSecondImage"
app:translationXIn="0.12"
app:translationXOut="0.12"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:alpha=".5"
android:src="@mipmap/s_2_2"
app:layout_heightPercent="27%"
app:layout_marginLeftPercent="20%"
app:layout_marginRightPercent="12%"
app:layout_marginTopPercent="20%"
app:layout_widthPercent="75%"/>
<ImageView
android:id="@+id/ivFirstImage"
app:translationXIn="0.16"
app:translationXOut="0.16"
app:translationYIn="0.4"
app:translationYOut="0.3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@mipmap/s_2_1"
app:layout_heightPercent="18%"
app:layout_widthPercent="55%"/>
<ImageView
android:id="@+id/ivFourthImage"
app:translationXIn="0.2"
app:translationXOut="0.2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_2_4"
app:layout_heightPercent="7%"
app:layout_marginLeftPercent="33%"
app:layout_marginTopPercent="34%"
app:layout_widthPercent="16%"/>
<ImageView
android:id="@+id/ivSixthImage"
app:translationXIn="0.06"
app:translationXOut="0.06"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_2_6"
app:layout_heightPercent="7%"
app:layout_marginLeftPercent="57%"
app:layout_marginTopPercent="29%"
app:layout_widthPercent="14%"/>
<ImageView
android:id="@+id/ivSeventhImage"
app:translationXIn="0.18"
app:translationXOut="0.18"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_2_7"
app:layout_heightPercent="15%"
app:layout_marginLeftPercent="65%"
app:layout_marginTopPercent="47%"
app:layout_widthPercent="25%"/>
<ImageView
android:id="@+id/ivFifthImage"
app:translationXIn="0.28"
app:translationXOut="0.28"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/s_2_5"
app:layout_heightPercent="10%"
app:layout_marginLeftPercent="77%"
app:layout_marginTopPercent="30%"
app:layout_widthPercent="15%"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="@string/text_e_commerce"
android:textColor="@android:color/white"
android:textSize="@dimen/text_size_large"
app:layout_heightPercent="15%"
app:layout_marginBottomPercent="11%"
app:layout_widthPercent="45%"/>
</android.support.percent.PercentRelativeLayout>
attrs文件:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- X方向上的位移 -->
<attr name="translationXIn" format="float" />
<attr name="translationXOut" format="float" />
<!-- Y方向上的位移 -->
<attr name="translationYIn" format="float" />
<attr name="translationYOut" format="float" />
</resources>
ids文件:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<item name="parallax_tag" type="id"/>
</resources>