Android uses Imageviewswitcher to achieve picture-switched carousel navigation effects

I've written about the effect of using ViewflippeR and Viewpager to switch the view on the screen ( not implemented Carousel ) Link:

Use Viewflipper for screen switching in Android

Use Viewpager in Android for screen page switching and page switching effects

Today we are changing the way of implementation Imageviewswitcher.

Imageswitcher is a control that controls the effect of a picture in Android, such as: Slide effects

Imageswitcher's rough understanding is the ImageView selector.

Imageswitcher principle: Imageswitcher has two sub-view:imageview, when the left and right sliding, the two ImageView between the switch to display the picture.

Since there are two sub-imageview, we will create two ImageView for Imageswitcher. The creation of ImageView in Imageviewswitcher is achieved through the Viewfactory factory.

Below we show the next implementation effect (can carousel OH):

Okay, nonsense, don't say much, start the code:

First step: Create a Master layout (framelayout) file Activity_main.xml (LinearLayout layout with navigation origin) in layout

1<?xml version= "1.0" encoding= "Utf-8"?>2<framelayout xmlns:android= "Http://schemas.android.com/apk/res/android"3Xmlns:tools= "Http://schemas.android.com/tools"4Android:id= "@+id/activity_main"5Android:layout_width= "Match_parent"6android:layout_height= "Match_parent"7tools:context= "Com.example.administrator.switcher.MainActivity" >8<Imageswitcher9Android:layout_width= "Match_parent"Tenandroid:layout_height= "Match_parent" OneAndroid:id= "@+id/is" > A</ImageSwitcher> -<LinearLayout -Android:id= "@+id/point_layout" theAndroid:layout_width= "Match_parent" -android:layout_height= "Wrap_content" -android:layout_gravity= "Bottom" -android:orientation= "Horizontal" > +<ImageView -Android:layout_width= "Wrap_content" +android:layout_height= "Wrap_content" Aandroid:layout_weight= "1" atandroid:src= "@mipmap/default_holo"/> -<ImageView -Android:layout_width= "Wrap_content" -android:layout_height= "Wrap_content" -android:layout_weight= "1" -android:src= "@mipmap/default_holo"/> in<ImageView -Android:layout_width= "Wrap_content" toandroid:layout_height= "Wrap_content" +android:layout_weight= "1" -android:src= "@mipmap/default_holo"/> the<ImageView *Android:layout_width= "Wrap_content" $android:layout_height= "Wrap_content"Panax Notoginsengandroid:layout_weight= "1" -android:src= "@mipmap/default_holo"/> the</LinearLayout> +</FrameLayout>

Here you can also use the configuration file to layout the following navigation dots, do not have to write dead in the layout file.

Step Two: Java feature Implementation code Mainactivity.java

1 Importandroid.support.v7.app.AppCompatActivity;2 ImportAndroid.os.Bundle;3 Importandroid.view.MotionEvent;4 ImportAndroid.view.View;5 ImportAndroid.widget.ImageSwitcher;6 ImportAndroid.widget.ImageView;7 Importandroid.widget.LinearLayout;8 ImportAndroid.widget.ViewSwitcher;9 Importjava.util.ArrayList;Ten /** One * Created by Panchengjia on 2016/12/04. A  */ -  Public classMainactivityextendsAppcompatactivityImplementsviewswitcher.viewfactory,view.ontouchlistener{ -     PrivateImageswitcher is;//declaring imageswitcher layouts the     PrivateLinearLayout point_layout;//declaring the layout of a navigation dot -     //Image ID Array -     int[] images={r.mipmap.a1,r.mipmap.a2,r.mipmap.a3,r.mipmap.a4}; -     //instantiate a collection of stored navigation dots +Arraylist<imageview> points =NewArraylist<>(); -     intIndex//declare index, record image ID array subscript +     floatStartX;//coordinates of x when finger touches the screen (presentation left and right slide) A     floatEndX;//coordinates when the finger leaves the screen (presentation left and right slide) at  - @Override -     protected voidonCreate (Bundle savedinstancestate) { -         Super. OnCreate (savedinstancestate); - Setcontentview (r.layout.activity_main); -is =(Imageswitcher) Findviewbyid (r.id.is); inIs.setfactory ( This);//implement Imageswitcher through the factory - initpoint (); toIs.setontouchlistener ( This);//Set Touch Events +     } -     //methods for initializing navigation dots the     Private voidInitpoint () { *point_layout=(LinearLayout) Findviewbyid (r.id.point_layout); $         intCount = Point_layout.getchildcount ();//get the number of dots in a layoutPanax Notoginseng          for(intI =0;i<count;i++){ -             //add a dot in a layout to a collection of dots the Points.Add ((ImageView) Point_layout.getchildat (i)); +         } A         //sets the dot state of the first picture (that is, the 0 subscript of the image array) to the touch solid state thePoints.get (0). Setimageresource (R.mipmap.touched_holo); +     } -     //set the state of the navigation origin for the selected picture $      Public voidSetimagebackground (intselectimage) { $          for(intI=0;i<points.size (); i++){ -             //Change the dot state if the subscript of the selected picture equals the ID of the middle of the dot collection -             if(i==selectimage) { the Points.get (i). Setimageresource (R.mipmap.touched_holo); -}Else{Wuyi Points.get (i). Setimageresource (R.mipmap.default_holo); the             } -         } Wu     } -     //implements the Viewfactory method instantiation ImageView (The ImageView property is not set here) About @Override $      PublicView Makeview () { -         //instantiate a ImageView view for switching -ImageView IV =NewImageView ( This); -         //the first view shown by default is Images[0] AIv.setimageresource (images[0]); +         returnIV; the     } - @Override $      Public BooleanOnTouch (View V, motionevent event) { the         //Press the screen the         if(event.getaction () = =Motionevent.action_down) { theStartx=event.getx ();//gets the coordinates of the x-axis when the screen is pressed the             //Finger lift up -}Else if(event.getaction () = =motionevent.action_up) { inendx=event.getx (); the             //The judgment end coordinate is greater than the starting coordinate is the next one (to avoid misoperation, set 30 of the judging interval) the             if(startx-endx>30){ About                 //three mesh operation to determine that the current picture is the last one, start from the beginning theindex = index+1<images.length?++index:0; the                 //use the system's own toggle to enter and exit animations (you can also customize the animation effect to Viewflipper) theIs.setinanimation ( This, Android. R.ANIM.FADE_IN); +Is.setoutanimation ( This, Android. R.anim.fade_out); -  the                 //The judgment end coordinate is less than the starting coordinate and the previous one (to avoid misoperation, set the 30 interval)Bayi}Else if(endx-startx>30){ the                 //three mesh operation to determine that the current picture is the first one, then the last image in the array theindex = index-1>=0?--index:images.length-1; -Is.setinanimation ( This, Android. R.ANIM.FADE_IN); -Is.setoutanimation ( This, Android. R.anim.fade_out); the             } the             //set up a picture resource for Imageswitcher the Is.setimageresource (Images[index]); the             //call method Set dot corresponding state - Setimagebackground (index); the         } the         return true; the     }94}

Personal feeling, on the picture switch carousel, Imageviewswitcher relative to Viewflipper and Viewpager realized, or is a lot simpler. Everyone can talk about their own views, welcome message discussion.

Android uses Imageviewswitcher to achieve picture-switched carousel navigation effects