The method of using Imageviewswitcher in Android to realize picture switching and carousel navigation _android

Source: Internet
Author: User

I've written earlier about the effect of using viewflipper and Viewpager to implement view switching in the screen (Viewpager not implemented) with links:

Android uses the Viewflipper class to implement screen switching (the problem with the axes has been modified)

Android uses Viewpager to achieve screen page switching and page carousel effects

Today we are in a different way of implementing imageviewswitcher.

Imageswitcher is a control that controls the display of pictures in Android, such as slide effects

Imageswitcher's rough understanding is the ImageView selector.

The principle of Imageswitcher: Imageswitcher has two View:imageview, when the left and right sliding, in the two imageview between the back and forth to show the picture.

Since there are two imageview, then we have to create two ImageView to Imageswitcher. The ImageView created in the Imageviewswitcher is implemented through the Viewfactory factory.

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

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

Step one: Create a Master layout (framelayout) file Activity_main.xml in layout (LinearLayout layout that contains the origin of the navigation)

<?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:id=" @+id/activity_main "android:layout_width=" Match_parent "android:layout_height=" Match_parent "tools:context="
Com.example.administrator.switcher.MainActivity "> <imageswitcher android:layout_width=" match_parent " android:layout_height= "Match_parent" android:id= "@+id/is" > </ImageSwitcher> <linearlayout android:id= " @+id/point_layout "android: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" android:layout_weight= "1" android:src= "@mipmap/default_holo"/> <ImageView Android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" android:layout_weight= "1" android:src= "@ Mipmap/default_holo "/> <imageview android:laYout_width= "Wrap_content" android:layout_height= "Wrap_content" android:layout_weight= "1" android:src= "@mipmap Default_holo "/> <imageview android:layout_width= wrap_content" android:layout_height= "Wrap_content" Android: layout_weight= "1" android:src= "@mipmap/default_holo"/> </LinearLayout> </FrameLayout>

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

Step Two: Java function implementation code Mainactivity.java

Import android.support.v7.app.AppCompatActivity;
Import Android.os.Bundle;
Import android.view.MotionEvent;
Import Android.view.View;
Import Android.widget.ImageSwitcher;
Import Android.widget.ImageView;
Import Android.widget.LinearLayout;
Import Android.widget.ViewSwitcher;
Import java.util.ArrayList;
/** * Created by Panchengjia on 2016/12/04.
* * public class Mainactivity extends appcompatactivity implements viewswitcher.viewfactory,view.ontouchlistener{ Private Imageswitcher is;//declare imageswitcher layout private linearlayout point_layout;//declare navigation dot layout//Picture ID array int[] images={
R.MIPMAP.A1,R.MIPMAP.A2,R.MIPMAP.A3,R.MIPMAP.A4};
Materialized storage navigation dot set arraylist<imageview> points = new arraylist<> (); int index;//Declaration index, record picture ID array subscript float startx;//finger touch screen x coordinates (demo left and right) the coordinates of float endx;//finger leaving screen (demo left and right) @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview (r.layout.activity_
Main);
is = (imageswitcher) Findviewbyid (r.id.is); Is.setfactory (This);//through the factory to achieve Imageswitcher initpoint (); Is.setontouchlistener (this); The method of setting touch events}//initializing a navigation dot private void Initpoint () {point_layout= (linearlayout)
Findviewbyid (r.id.point_layout); int count = Point_layout.getchildcount ()//Get the number of dots in the layout for (int i =0;i<count;i++) {////Add a dot in the layout to the Dot collection Points.Add (
ImageView) Point_layout.getchildat (i));
//Set the point state of the first picture (that is, 0 subscript of the image array) to a touch solid state points.get (0). Setimageresource (R.mipmap.touched_holo); //Set the navigation origin of the selected picture to the state public void setimagebackground (int selectimage) {for (int i=0;i<points.size (); i++) {// If the subscript of the selected picture equals the ID of the subscript in the Dot collection, change the dot state if (i==selectimage) {points.get (i). Setimageresource (R.mipmap.touched_holo);}
else{Points.get (i). Setimageresource (R.mipmap.default_holo);}
///Implement Viewfactory Method instantiation ImageView (ImageView properties are not set here) @Override public view Makeview () {//Instantiate a ImageView view for switching
ImageView IV = new ImageView (this);
The first view of the default display is Images[0] Iv.setimageresource (images[0]);
return IV; @Override public boolean Ontouch (View V, motionevent event) {//press screen if (event.getAction () ==motionevent.action_down) {startx=event.getx ()//Gets the coordinates of the x axis when the screen is pressed//the finger is raised}else if (event.getaction () = = MOTIONEVENT.ACTION_UP) {endx=event.getx ();///////////////////////////////////////////////////
Three-mesh operation to determine if the current picture is the last one, start from the beginning index = index+1<images.length?++index:0; Use the system's own switch to animate the animation effect (or you can customize the animation effect as Viewflipper) is.setinanimation (this,android.
R.ANIM.FADE_IN); Is.setoutanimation (this,android.
R.anim.fade_out); The judgment end coordinate is less than the starting coordinate is the previous one (to avoid misoperation, set 30 of the judgment interval)}else if (endx-startx>30) {//three mesh operation to determine that the current picture is already the first one, the last picture in the array is index =
Index-1>=0?--index:images.length-1; Is.setinanimation (this,android.
R.ANIM.FADE_IN); Is.setoutanimation (this,android.
R.anim.fade_out);
//Set Imageswitcher Picture resource Is.setimageresource (Images[index]);
The call method sets the dot corresponding state setimagebackground (index);
return true; }
}

Personal feeling, on the picture switch carousel, Imageviewswitcher relative to Viewflipper and viewpager to achieve, or a lot simpler.

The above is a small set of Android to introduce the use of Imageviewswitcher to realize the picture switch carousel navigation method, I hope to help you, if you have any questions please give me a message, small series will promptly reply to everyone. Here also thank you very much for the cloud Habitat Community website support!

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.