Question

我看到了以下链接的视频：ParallaxHeaderViewPager Github：StowableHeaderViewPager我对视差效果很感兴趣，背景图像可以随动画效果移动。我想将此功能添加到我的项目中。

这是我的代码：的 nav_header_main.xml

<?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:background="@android:color/white">

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="190dp"
    android:background="@drawable/background_material_red"
    android:id="@+id/header_bgdimage"
    android:orientation="vertical">

    <de.hdodenhof.circleimageview.CircleImageView
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/profile_image"
        android:layout_width="70dp"
        android:layout_height="70dp"
        android:src="@mipmap/ic_profile"
        app:border_color="#FF000000"
        android:layout_marginLeft="24dp"
        android:layout_centerVertical="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true"
        android:layout_marginStart="24dp" />

    <!--set default name-->
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Wang Jian"
        android:textSize="14sp"
        android:textColor="#FFF"
        android:textStyle="bold"
        android:gravity="left"
        android:paddingBottom="4dp"
        android:id="@+id/username"
        android:layout_above="@+id/email"
        android:layout_alignLeft="@+id/profile_image"
        android:layout_alignStart="@+id/profile_image" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="user@host.com"
        android:id="@+id/email"
        android:gravity="left"
        android:layout_marginBottom="8dp"
        android:textSize="14sp"
        android:textColor="#fff"
        android:layout_alignParentBottom="true"
        android:layout_alignLeft="@+id/username"
        android:layout_alignStart="@+id/username" />

</RelativeLayout>

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/nav_tabs"
        android:layout_below="@+id/header_bgdimage"
        android:elevation="6dp"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerHorizontal="true"
        android:minHeight="?attr/actionBarSize"
        android:fillViewport="false">
        <Button
            android:id="@+id/me"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="fill_parent"
            android:drawableTop="@drawable/ic_action_user"
            android:text="我的"
            android:fontFamily="@string/font_fontFamily_medium"
            android:textColor="#FFFFFF"
            android:background="#0F1E2D" />
        <Button
            android:id="@+id/redeem"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="fill_parent"
            android:drawableTop="@drawable/ic_action_mustache"
            android:text="特权"
            android:fontFamily="@string/font_fontFamily_medium"
            android:textColor="#FFFFFF"
            android:background="#0F1E2D"/>
        <Button
            android:id="@+id/topic"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="fill_parent"
            android:drawableTop="@drawable/ic_action_dialog"
            android:text="话题"
            android:textColor="#FFFFFF"
            android:fontFamily="@string/font_fontFamily_medium"
            android:background="#0F1E2D" />
        <Button
            android:id="@+id/favorite"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="fill_parent"
            android:drawableTop="@drawable/ic_action_heart"
            android:text="收藏"
            android:fontFamily="@string/font_fontFamily_medium"
            android:textColor="#FFFFFF"
            android:background="#0F1E2D"/>

    </LinearLayout>

</RelativeLayout>

现在我希望我的导航背景图像android:background="@drawable/background_material_red"可以产生视差效果。

这是我的java代码： NavigationActivity

public class NavigationActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {
    NavigationView navigationView = null;
    Toolbar toolbar = null;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //Set the fragment initially
        PersonalFragment fragment = new PersonalFragment();
        android.support.v4.app.FragmentTransaction fragmentTransaction =
                getSupportFragmentManager().beginTransaction();
        fragmentTransaction.replace(R.id.fragment_container, fragment);
        fragmentTransaction.commit();
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();
        navigationView = (NavigationView) findViewById(R.id.nav_view);
        //How to change elements in the header programmatically
        View headerView = navigationView.getHeaderView(0);
        TextView ProfileText = (TextView) headerView.findViewById(R.id.email);
        ProfileText.setText("马来西亚第一");
        navigationView.setNavigationItemSelectedListener(this);
    }
    @Override
    public void onBackPressed() {
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        if (drawer.isDrawerOpen(GravityCompat.START)) {
            drawer.closeDrawer(GravityCompat.START);
        } else {
            super.onBackPressed();
        }
    }
    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.tools_bar, menu);
        return true;
    }
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();
        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }
        if(id == R.id.action_search){
            Toast.makeText(getApplicationContext(), "Search action is selected!", Toast.LENGTH_SHORT).show();
            return true;
        }
        return super.onOptionsItemSelected(item);
    }
    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        // Handle navigation view item clicks here.
        int id = item.getItemId();
        if (id == R.id.nav_profile) {
            PersonalFragment fragment = new PersonalFragment();
            android.support.v4.app.FragmentTransaction fragmentTransaction =
                    getSupportFragmentManager().beginTransaction();
            fragmentTransaction.replace(R.id.fragment_container, fragment);
            fragmentTransaction.commit();
            setTitle(R.string.title_home);
        } else if (id == R.id.nav_award) {
            AwardFragment fragment = new AwardFragment();
            android.support.v4.app.FragmentTransaction fragmentTransaction =
                    getSupportFragmentManager().beginTransaction();
            fragmentTransaction.replace(R.id.fragment_container, fragment);
            fragmentTransaction.commit();
            setTitle(R.string.title_award);
        } else if (id == R.id.nav_others) {
            OthersFragment fragment = new OthersFragment();
            android.support.v4.app.FragmentTransaction fragmentTransaction =
                    getSupportFragmentManager().beginTransaction();
            fragmentTransaction.replace(R.id.fragment_container, fragment);
            fragmentTransaction.commit();
            setTitle(R.string.title_others);
        } else if (id == R.id.nav_manage) {
            setTitle(R.string.title_tools);
        } else if (id == R.id.nav_setting) {
            setTitle(R.string.title_setting);
        } else if (id == R.id.nav_about) {
            setTitle(R.string.title_about);
        }
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }
}`

我是这个东西的新手，所以任何帮助将不胜感激。提前致谢！

Answer 1

这是一个很酷的视差动画库。我在很多项目中使用它。它易于实施。此外，如果您检查代码，您可以了解如何自己做出视差效果。 https://github.com/ksoichiro/Android-ObservableScrollView

Answer 2

有一个“官方”解决方案，您想要在Google设计库中实现的目标，包括App Bar和CollapsingToolbarLayout。 this blog上有一个很棒的指南：

Android - 如何将视差效果添加到导航背景图像

2 个答案: