Easily complete picture rotation with adapterviewflipper

Time:2021-10-14
catalogue
  • 1、 Meet adapterviewfilper
  • 2、 Adapterviewfilper example

1、 Meet adapterviewfilper

Adapterviewfilpper inherits from adapterviewanimator. It also displays multiple view components provided by the adapter, but it can only display one view component at a time. The program can control the component to display the previous and next components through showprevious() and shownext() methods.

Adapterviewfilpper can use fade and fade animation effects during multiple view switching. In addition, you can call the component’s startflipping () to control it to “automatically play” the next view component.

The XML attributes supported by adapterviewanimator are as follows:

  • Android: animatefirstview: sets whether to use animation when displaying the first view of the component.
  • Android: inanimation: sets the animation used when displaying components.
  • Android: loopviews: sets whether to automatically jump to the first component when looping to the last component.
  • Android: outanimation: sets the animation used when the component is hidden.

The XML attributes and related methods additionally supported by adapterviewfilper are shown in the following table.

XML attributes

correlation method

explain

android:autoStart

startFlpping()

Set whether to display the component automatically

android:flipInterval

setFlipInterval(int)

Set the time interval for automatic playback

2、 Adapterviewfilper example

Next, learn how to use adapterviewfilpper through a simple example program.

Continue to use the listviewsample module of the widgetsample project and create an AdapterView in the app / main / RES / layout / directory_ filpper_ Layout.xml file, filled with the following code fragments:

<?xml version="1.0" encoding="utf-8" ?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent">
    <AdapterViewFlipper
        android:id="@+id/flipper"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:flipInterval="5000"
        android:layout_alignParentTop="true"/>

    <Button
        android:id="@+id/prev_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        Android: text = "previous" / >
    <Button
        android:id="@+id/next_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        Android: text = "next" / >
    <Button
        android:id="@+id/auto_btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        Android: text = "autoplay" / >
</RelativeLayout>

Create a myfilppadapter class, inherit the baseadapter class, and override its four main methods. The specific code is as follows:

package com.jinyu.cqkxzsxy.android.listviewsample.adapter;


import android.content.Context;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;


/**
 *@ creator Xin Yu
 * describe Android zero base entry to proficient series tutorial, welcome to WeChat official account ShareExpert
 */
public class MyFilpperAdapter extends BaseAdapter {
    private Context mContext = null;
    private int[] mImageIds = null;


    public MyFilpperAdapter(Context context, int[] imageIds) {
        this.mContext = context;
        this.mImageIds = imageIds;
    }


    @Override
    public int getCount() {
        return mImageIds.length;
    }


    @Override
    public Object getItem(int position) {
        return position;
    }


    @Override
    public long getItemId(int position) {
        return position;
    }


    //The view returned by this method represents each list item
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ImageView imageView = null;
        if(null == convertView) {
            //Create an ImageView
            imageView = new ImageView(mContext);
            //Sets the zoom type of the ImageView
            imageView.setScaleType(ImageView.ScaleType.FIT_XY);
            //Set layout parameters for ImageView
            imageView.setLayoutParams(new ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));
            convertView = imageView;
        } else {
            imageView = (ImageView) convertView;
        }


        //Set up picture resources for ImageView
        imageView.setImageResource(mImageIds[position]);

        return imageView;
    }
}

Next, provide an adapter for the adapterviewfilpper, using a custom baseadapter. Create a new adapterviewfilperactivity.java file and load the layout file created above. The specific code is as follows:

package com.jinyu.cqkxzsxy.android.listviewsample;


import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.AdapterViewFlipper;
import android.widget.Button;


import com.jinyu.cqkxzsxy.android.listviewsample.adapter.MyFilpperAdapter;


public class AdapterViewFilperActivity extends AppCompatActivity implements View.OnClickListener {
    private AdapterViewFlipper mFlipper = null;
    private Button mPrevBtn = null;
    private Button mNextBtn = null;
    private Button mAutoBtn = null;
    private int[] mImageIds = {
            R.drawable.image_01,R.drawable.image_02,R.drawable.image_03,
            R.drawable.image_04,R.drawable.image_05,R.drawable.image_06,
            R.drawable.image_07,R.drawable.image_08,R.drawable.image_09
    };


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


        //Get interface components
        mFlipper = (AdapterViewFlipper) findViewById(R.id.flipper);
        mPrevBtn = (Button) findViewById(R.id.prev_btn);
        mNextBtn = (Button) findViewById(R.id.next_btn);
        mAutoBtn = (Button) findViewById(R.id.auto_btn);


        //Set the adapter for adapterviewflipper
        MyFilpperAdapter adapter = new MyFilpperAdapter(this, mImageIds);
        mFlipper.setAdapter(adapter);


        //Set the click event listener for the three buttons
        mPrevBtn.setOnClickListener(this);
        mNextBtn.setOnClickListener(this);
        mAutoBtn.setOnClickListener(this);
    }


    @Override
    public void onClick(View view) {
        switch (view.getId()){
            case R.id.prev_btn:
                //Show previous component
                mFlipper.showPrevious();
                //Stop autoplay
                mFlipper.stopFlipping();
                break;
            case R.id.next_btn:
                //Displays the next component.
                mFlipper.showNext();
                //Stop autoplay
                mFlipper.stopFlipping();
                break;
            case R.id.auto_btn:
                //Start autoplay
                mFlipper.startFlipping();
                break;
            default:
                break;
        }
    }
}

The above program code calls the showprevious() and shownext() methods of adapterviewflipper to control the component to display the previous and next components, and calls the startflipping() method to control automatic playback.

Modify the activity started by the program and run the program to see the interface effect shown in the figure below.

Click the previous or next button to switch the displayed components. Click the auto play button to see that the adapterviewflipper changes a picture every 5 seconds. The fade effect will be used when switching pictures.

So far, the simple use of adapterviewflipper has been learned. It is recommended to practice and master more properties and methods.

The above is the details of how to easily complete the picture rotation with adapterviewflipper. For more information about how to complete the picture rotation with adapterviewflipper, please pay attention to other relevant articles of developeppaer!