自定义设计视图寻呼机,以显示多个图像

时间:2014-11-22 14:00:03

标签: android android-viewpager

我有什么:

我有一个工作代码,我可以看到一个带有tabIndicator的图像


我想做什么:

  • 如下图所示,我想要一个圆形指示器 在图像下方,连接圆形指示器和多个的线 要在屏幕上显示的图片
  • 当我们使用指标时,所有指标都聚集在一起,那是什么 我想要实现的是每个图像下方的指标

enter image description here


我如何相应地自定义?


我的当前代码

MainActivity.java

public class MainActivity extends Activity {

    // Declare Variables
    ViewPager viewPager;
    PagerAdapter adapter;
    String[] country;
    int[] flag;
    UnderlinePageIndicator mIndicator;


    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        // Get the view from viewpager_main.xml
        setContentView(R.layout.viewpager_main);

        // Generate sample data

        country = new String[] { "China", "India", "United States",
                "Indonesia", "Brazil", "Pakistan", "Nigeria", "Bangladesh",
                "Russia", "Japan" };

        flag = new int[] { R.drawable.china, R.drawable.india,
                R.drawable.unitedstates, R.drawable.indonesia,
                R.drawable.brazil, R.drawable.pakistan, R.drawable.nigeria,
                R.drawable.bangladesh, R.drawable.russia, R.drawable.japan };

        // Locate the ViewPager in viewpager_main.xml
        viewPager = (ViewPager) findViewById(R.id.pager);
        // Pass results to ViewPagerAdapter Class
        adapter = new ViewPagerAdapter(MainActivity.this, country, flag);
        // Binds the Adapter to the ViewPager
        viewPager.setAdapter(adapter);

        // ViewPager Indicator
        mIndicator = (UnderlinePageIndicator) findViewById(R.id.indicator);
        mIndicator.setFades(false);
        mIndicator.setViewPager(viewPager);

    }
}

PagerActivity.java

public class PagerActivity extends FragmentActivity {

    private MultiViewPager mPager;
    private FragmentStatePagerAdapter mAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_pager);

        mPager = (MultiViewPager) findViewById(R.id.pager);

        mAdapter = new FragmentStatePagerAdapter(getSupportFragmentManager()) {

            @Override
            public int getCount() {
                return 4;
            }

            @Override
            public Fragment getItem(int position) {
                return new PageFragment();
            }
        };
        mPager.setAdapter(mAdapter);
    }

}

viewpager_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <com.viewpagerindicator.UnderlinePageIndicator
        android:id="@+id/indicator"
        android:layout_width="match_parent"
        android:layout_height="5dp" />

</LinearLayout>

1 个答案:

答案 0 :(得分:0)

您可以使用这些库来查看寻呼机: https://github.com/daimajia/AndroidImageSlider 对我很有用。