Advertisement page slide of ViewPager series

Keywords: Mobile Android Java

ViewPager is a control under support-v4. You need to add this package to use it! ViewPager is a control similar to ListView, composed of many items, similar to a Book flipped left and right, while ListView just flipped up and down. The adapter PagerAdapter of ViewPager is similar to the BaseAdapter of ListView, and the usage aspect is similar to ListView. Prepare the data source, adapter, the number of entries in the adapter to calculate the total item, and draw each item view..

First on the renderings:

                  

Full code:

 

import android.app.ActionBar;
import android.app.Activity;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import java.util.ArrayList;
import java.util.List;

public class advertisement extends Activity {
private ViewPager viewPager;
    private LinearLayout  layout;
    private List<ImageView> imageList;
    private List<ImageView>  pointList;
    ImageView point;
    int[] drawable={R.mipmap.a,R.mipmap.b,R.mipmap.c,R.mipmap.d};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_advertisement);
        viewPager=(ViewPager)findViewById(R.id.viewPager);
        layout=(LinearLayout)findViewById(R.id.layout);
        imageList=new ArrayList<ImageView>();
        pointList=new ArrayList<ImageView>();
        addView();
        pointList.get(1).setImageResource(R.mipmap.ic_focus);//Slide small gray dots
        pointList.get(2).setImageResource(R.mipmap.ic_focus);
        pointList.get(3).setImageResource(R.mipmap.ic_focus);
        viewPager.setOnPageChangeListener(new pointListener());
    }

public void addView(){
       for (int i=0;i<4;i++){
           ImageView iv=new ImageView(this);
           iv.setImageResource(drawable[i]);
           iv.setScaleType(ImageView.ScaleType.CENTER_CROP);//Picture zooming
           imageList.add(iv);
           viewPager.setAdapter(new ViewPagerAdapter());
           //Small dot sliding effect on ViewPager
           point=new ImageView(this);
           //Set the width and height position of the layout parameters of the control for the parent container, etc
           //The parent container of the control itself is of the same type. Here point is under LinearLayout
           LinearLayout.LayoutParams params=new LinearLayout.LayoutParams(20,20);
           params.leftMargin=20;
           point.setImageResource(R.mipmap.ic_focus_select);
           point.setMaxHeight(20);
           point.setMaxWidth(20);
           point.setLayoutParams(params);
           pointList.add(point);
           layout.addView(point);
       }
   }

    class ViewPagerAdapter  extends PagerAdapter{
        @Override
        // Get the number of controls to slide, then this should be the number of imageviews of the displayed advertising image
        public int getCount() {
            return imageList.size();
        }
        @Override
        public Object instantiateItem(ViewGroup container, int position) {
            //ViewPager is extended to ViewGroup, and the container parameter is the current ViewPager object,
            // All item s will be added to the ViewPager,
           // position is the subscript corresponding to each item
            container.addView(imageList.get(position));
            return imageList.get(position);
        }
        @Override
        //The object returned from the instantiateItem is a view with an id. compare it with the id of the view
        public boolean isViewFromObject(View view, Object object) {
            return view==object;
        }
        @Override
        // PagerAdapter only caches three pictures to be displayed. If the sliding picture exceeds the cache range, this method will be called to destroy the picture
        public void destroyItem(ViewGroup container, int position, Object object) {
            container.removeView(imageList.get(position));
        }
    }
    class pointListener implements ViewPager.OnPageChangeListener{
        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
//This method is called continuously during screen scrolling.
// There are three parameters, the first position. Pay special attention to this parameter.
// When sliding with fingers, if the fingers are pressed on the page, the position is consistent with the index of the current page;
// If you drag your finger to the left (the corresponding page turns to the right), the position is consistent with the current page most of the time,
// The last call will become the target page only if the page flipping is successful; if the finger is dragged to the right (the corresponding page is flipped to the left),
// At this time, the position is consistent with the target page most of the time, and the last call will become the original page only if the page turning is unsuccessful.
//When setting the setCurrentItem page directly, if it is adjacent (for example, it is the second page now,
// Jump to the first or third page). If the page is flipped to the right, it will be consistent with the current page most of the time,
// Only the last page becomes the target page; if you flip left, the position is the same as the target page.
// This is basically the same as dragging the page with your fingers.
// If it's not adjacent, for example, if I jump from the first page to the third page, the position is 0 first, and then gradually becomes 1,
// Then it gradually becomes 2; I jump from the third page to the first page, position first is 1, and then it gradually becomes 0, which does not appear to be 2.
// positionOffset is the sliding ratio of the current page. If the page flips to the right, the value will continue to increase,
// Finally, the mutation is 0 after approaching 1. If the page flips to the left, the value becomes smaller and smaller, and finally becomes 0.
// positionOffsetPixels is the sliding pixel of the current page. The change is the same as that of positionOffset.
        }
        @Override
        public void onPageScrollStateChanged(int state) {
//This method changes when the fingers operate the screen. There are three values: 0 (END), 1 (press), 2 (up).
//When you use your fingers to slide and turn the page, this method will be triggered when you press your fingers down. The state value is 1. When you lift your fingers,
// If there is a slip, even if it is small, the value changes to 2 and then to 0. This method is executed three times in all.
// A special case is that after the finger is pressed down, no sliding happens at all. At this time, this method will only be called twice, and the state values are 1 and 0 respectively.
//When the setCurrentItem page is flipped, this method will be executed twice. The state values are 2 and 0 respectively.
        }
        @Override
        public void onPageSelected(int position) {
      //onPageSelected(int position): this method has a parameter position,
       // Represents which page is selected. When you swipe the page with your fingers,
      // If the flip is successful (long enough to slide), the method will be executed immediately when the fingers are raised,
      // position is the currently sliding page. If you turn directly to setCurrentItem,
      // The position is the same as the setCurrentItem parameter, which is executed immediately before the onPageScrolled method executes.
          for (int i=0;i<pointList.size();i++){
             if(position==i)
                pointList.get(i).setImageResource(R.mipmap.ic_focus_select);//Sliding white dots
              else
                 pointList.get(i).setImageResource(R.mipmap.ic_focus);//Slide small gray dots
          }
        }
    }
}
<RelativeLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".advertisement">
<!-- RelativeLayout It's a little surprising to realize the effect of one component floating on another -->
   <android.support.v4.view.ViewPager
       android:id="@+id/viewPager"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent">

   </android.support.v4.view.ViewPager>

    <LinearLayout
        android:id="@+id/layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="40dp"
        android:layout_centerHorizontal="true"
       >

    </LinearLayout>
</RelativeLayout>

Posted by Sturm on Sun, 15 Dec 2019 07:00:37 -0800