Android向导页面的实现

向导页面比较适合用在复杂的需要由多个步骤组成的情况，比如收集一些数据的时候。用户可以在已经填写的步骤中切换，方便更改前面填写过的数据。Android中，我们可以时候viewpager来实现所需要的向导的功能，在viewpager的滑动事件中，处理向导的导航。先上效果图

代码实现主要就是使用viewpager类，以及一个自定义的view StepPagerStrip类，用于实现viewpager顶部的状态显示。

layout代码

<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">    <viewpagerdemo.android.baidao.com.androidwizard.StepPagerStrip        android:id="@+id/strip"        android:layout_width="match_parent"        android:layout_height="4dp"        android:layout_marginLeft="0dp"        android:layout_marginRight="0dp"        android:gravity="fill_horizontal"        android:paddingBottom="1dp"        android:paddingTop="1dp" />    <android.support.v4.view.ViewPager        android:id="@+id/pager"        android:layout_width="match_parent"        android:layout_height="0dp"        android:layout_weight="1" />    <View        android:id="@+id/divider"        android:layout_width="match_parent"        android:layout_height="1px"        android:background="@color/wizard_button_container_divider_color" />    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <Button            android:id="@+id/prev_button"            style="@style/WizardButtonBarButton"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@drawable/wizard_button_selector"            android:text="@string/wizard_prev" />        <View            android:layout_width="1px"            android:layout_height="match_parent"            android:background="@color/wizard_button_container_divider_color" />        <Button            android:id="@+id/next_button"            style="@style/WizardButtonBarButton"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@drawable/wizard_button_selector"            android:text="@string/wizard_next" />    </LinearLayout></LinearLayout>

在viewpager的scoll事件中，更新StepPageStrip的状态即可

viewPager = (ViewPager) findViewById(R.id.pager);adapter = new WizardAdapter(getSupportFragmentManager());viewPager.setAdapter(adapter);stepPagerStrip = (StepPagerStrip) findViewById(R.id.strip);stepPagerStrip.setPageCount(adapter.getCount());viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {    @Override    public void onPageScrolled(int i, float v, int i2) {    }    @Override    public void onPageSelected(int i) {        stepPagerStrip.setCurrentPage(i);    }    @Override    public void onPageScrollStateChanged(int i) {    }});

详细的代码可以去我的github下载
https://github.com/lzyzsd/AndroidWizard

更多相关文章

随机推荐