Question

我希望在一周中的所有日期显示ViewPager，并预览当前项目的以下项目。我已经尝试了很多从stackoverflow建议的解决方案，但它们都没有工作。我不会在ViewPager中使用片段，因此我使用了PagerAdapter。

看到这张图片：

Days of the week ViewPager

我的出发点是：

activity_main.xml

<TextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_horizontal"
    android:text="Choose a day of the week:" />
<android.support.v4.view.ViewPager
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/weekOfTheDayPager"/>

MainActivity.java

public class MainActivity extends AppCompatActivity {

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

private void setUpAdapter() {
    ViewPager _mViewPager = (ViewPager) findViewById(R.id.weekOfTheDayPager);

    final String[] daysOfTheWeek = {"Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"};
    final Context myContext = getBaseContext();

    _mViewPager.setAdapter(new PagerAdapter() {
        @Override
        public int getCount() {
            return daysOfTheWeek.length;
        }

        @Override
        public boolean isViewFromObject(View view, Object object) {
            return view == object;
        }

        @Override
        public Object instantiateItem(ViewGroup collection, int position) {
            LayoutInflater inflater = LayoutInflater.from(myContext);
            ViewGroup layout = (ViewGroup) inflater.inflate(R.layout.dayoftheweeklayout, collection, false);
            ((TextView) layout.findViewById(R.id.dayOfTheWeekTextView)).setText(daysOfTheWeek[position]);
            collection.addView(layout);
            return layout;
        }

        @Override
        public void destroyItem(ViewGroup collection, int position, Object view) {
            collection.removeView((View) view);
        }
    });
}}

最后是ViewPager项目的布局：

dayoftheweeklayout.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">
    <TextView
        android:id="@+id/dayOfTheWeekTextView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Sunday"
        android:layout_gravity="center_horizontal"/>
</FrameLayout>

任何建议都将受到赞赏。

Answer 1

所以看起来你想要一个 carousel 视图。

这是食谱：

首先，为了在ViewPager中向侧面显示页面，您需要在侧面提供一些填充，然后将clipToPadding设置为false：

    <android.support.v4.view.ViewPager
        android:id="@+id/weekOfTheDayPager"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:clipToPadding="false"
        android:paddingEnd="@dimen/view_pager_padding"
        android:paddingLeft="@dimen/view_pager_padding"
        android:paddingRight="@dimen/view_pager_padding"
        android:paddingStart="@dimen/view_pager_padding"/>

接下来，您需要覆盖getPageWidth中的PagerAdapter，告诉ViewPager您希望一次显示三个页面：

    @Override
    public float getPageWidth(int position) {
        return 1F / 3F;
    }

然后，您需要告诉ViewPager使用自定义PageTransformer：

    viewPager.setPageTransformer(false, new MyPageTransformer());

...

public static class MyPageTransformer implements ViewPager.PageTransformer {

    private ArgbEvaluator mColorFade = new ArgbEvaluator();

    @Override
    public void transformPage(View page, float position) {

         // position is 0 when page is centered (current)
         // -1 when page is all the way to the left 
         // +1 when page is all the way to right

         // Here's an example of how you might morph the color
         int color = mColorFade(Math.abs(position), Color.RED, Color.GRAY);
         TextView tv = (TextView) page.findViewById(R.id.dayOfTheWeekTextView);
         tv.setTextColor(color);
    }
}

可能有些东西我忘记了，但是搜索“android viewpager carousel”，你会在某处找到答案。

ViewPager包含项目预览

1 个答案: