ANDROID中使用IMAGEVIEWSWITCHER實現 圖片切換 輪播導航效果

http://www.cnblogs.com/panhouye/p/6132402.html
前面寫過了使用ViewFlippe r和ViewPager實現屏幕中視圖切換的效果（ViewPager未實現輪播）附鏈接：

今天我們在換一種實現方式ImageViewSwitcher。
ImageSwitcher是Android中控製圖片展示效果的一個控件，如：幻燈片效果
ImageSwitcher粗略的理解就是ImageView的選擇器。
ImageSwitcher的原理：ImageSwitcher有兩個子View：ImageView，當左右滑動的時候，就在這兩個ImageView之間來回切換來顯示圖片。
既然有兩個子ImageView，那麼我們要創建兩個ImageView給ImageSwitcher。創建ImageViewSwitcher中的ImageView是通過ViewFactory工廠來實現的。
下面我們展示下本次實現效果（可以輪播哦）
个人感觉，就图片切换轮播来讲，ImageViewSwitcher相对于ViewFlipper和ViewPager实现起来，还是简单了很多。大家可以谈谈自己的看法，欢迎留言讨论。

<?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>

=============================================================

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;//声明ImageSwitcher布局
    private LinearLayout point_layout;//声明导航圆点的布局
    //图片id数组
    int[] images={R.mipmap.a1,R.mipmap.a2,R.mipmap.a3,R.mipmap.a4};
    //实例化存储导航圆点的集合
    ArrayList<ImageView> points = new ArrayList<>();
    int index;//声明index，记录图片id数组下标
    float startX;//手指接触屏幕时X的坐标（演示左右滑动）
    float endX;//手指离开屏幕时的坐标（演示左右滑动）

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        is = (ImageSwitcher) findViewById(R.id.is);
        is.setFactory(this);//通过工厂实现ImageSwitcher
        initpoint();
        is.setOnTouchListener(this);//设置触摸事件
    }
    //初始化导航圆点的方法
    private void initpoint() {
        point_layout= (LinearLayout) findViewById(R.id.point_layout);
        int count = point_layout.getChildCount();//获取布局中圆点数量
        for(int i =0;i<count;i++){
            //将布局中的圆点加入到圆点集合中
            points.add((ImageView) point_layout.getChildAt(i));
        }
        //设置第一张图片（也就是图片数组的0下标）的圆点状态为触摸实心状态
        points.get(0).setImageResource(R.mipmap.touched_holo);
    }
    //设选中图片对应的导航原点的状态
    public void setImageBackground(int selectImage) {
        for(int i=0;i<points.size();i++){
            //如果选中图片的下标等于圆点集合中下标的id，则改变圆点状态
            if(i==selectImage){
                points.get(i).setImageResource(R.mipmap.touched_holo);
            }else{
                points.get(i).setImageResource(R.mipmap.default_holo);
            }
        }
    }
    //实现ViewFactory的方法实例化imageView（这里未设置ImageView的属性）
    @Override
    public View makeView() {
        //实例化一个用于切换的ImageView视图
        ImageView iv = new ImageView(this);
        //默认展示的第一个视图为images[0]
        iv.setImageResource(images[0]);
        return iv;
    }
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        //按下屏幕
        if(event.getAction()==MotionEvent.ACTION_DOWN){
            startX=event.getX();//获取按下屏幕时X轴的坐标
            //手指抬起
        }else if (event.getAction()==MotionEvent.ACTION_UP){
            endX=event.getX();
            //判断结束坐标大于起始坐标则为下一张（为避免误操作，设置30的判断区间）
            if(startX-endX>30){
                //三目运算判断当前图片已经为最后一张，则从头开始
                index = index+1<images.length?++index:0;
                //使用系统自带的切换出入动画效果（也可以向ViewFlipper中一样自定义动画效果）
                is.setInAnimation(this,android.R.anim.fade_in);
                is.setOutAnimation(this,android.R.anim.fade_out);

                //判断结束坐标小于于起始坐标则为上一张（为避免误操作，设置30的判断区间）
            }else if(endX-startX>30){
                //三目运算判断当前图片已经为第一张，则上一张为数组内最后一张图片
                index = index-1>=0?--index:images.length-1;
                is.setInAnimation(this,android.R.anim.fade_in);
                is.setOutAnimation(this,android.R.anim.fade_out);
            }
            //设置ImageSwitcher的图片资源
            is.setImageResource(images[index]);
            //调用方法设置圆点对应状态
            setImageBackground(index);
        }
        return true;
    }
}
個人感覺，就圖片切換輪播來講，ImageViewSwitcher相對於ViewFlipper和ViewPager實現起來，還是簡單了很多。

https://www.jianshu.com/p/c052ae42fbc9

http://blog.csdn.net/stevenhu_223/article/details/45577781

https://www.jianshu.com/p/24b30a3d052f



留言

張貼留言

這個網誌中的熱門文章

Use Case Description（描述使用案例）

Use Case Description（描述使用案例） http://relyky.blogspot.tw/2010/03/use-case-description.html 此篇文章參考整理自： Writing effective Use Case Examples   http://www.gatherspace.com/static/use_case_example.html http://faculty.stut.edu.tw/~pwchen/sa&d/use-case-model.ppt http://ctl.scu.edu.tw/scutwebpub/website/DocUpload/CourseTeaching/7700011120081020155557_1.ppt 國立中山大學學位論文全文系統  http://etd.lib.nsysu.edu.tw/ETD-db/ETD-search-c/getfile?URN=etd-0710107-033445&filename=etd-0710107-033445.pdf http://docs.google.com/Doc?docid=0AXIgZjy4dqkWZGR0dzJiOTJfMTI1bWs5MjUyNw&hl=en 前言： 其實目的並非是Use Case 而是其“Description”，目的是想用此“Use Case Description”技巧來描述補捉使用者真正要的須求與規格。 主題： Use Case Description 是Use Case的內容描述，補足其極其簡單的表達，以可以明確說明該Use Case的明確目標與其執行情節的使用者觀點的流程。 Scenarios（情節) A scenario is a sequence of events that occurs during one particular execution of a system. 一個使用案例實際上不只是一序列的動作，對於各種不同的情況，其序列描述也是有很多的變化，每一序列的動作就叫稱之為情節。 For example: John Doe logs in transmits a message from John Doe to the
閱讀完整內容

列出不重複的隨機亂數

要如何列出不重複的隨機亂數呢？ 因為隨機亂數連續取值，會產生重複號碼。 要解決這個問題。 例如：程式輸出  樂透彩 選號 49個數字隨機取6個 想到三個陣列方法。 方法一：直接把全部數字49個號碼儲存在陣列裡面， 再用迴圈跑個一輪做隨機元素交換，for(i=0; i<arr.length; i++)， 迴圈裡面用一個隨機亂數取值， 指到哪個元素就 i=序列的元素跟那個隨機元素交換。 方法二：如同方法一把全部數字49個號碼儲存在陣列裡面， 再用隨機方式取出陣列裡的元素號碼，並且重新設定該元素內的 值為號碼以外的值，像是負一或其他，然後再繼續隨機取值， 如果取到的值為設定的取出重設值(代表已經選過了)，就再來一次。 方法三：使用兩個迴圈，內層迴圈裡隨機亂數取值，然後再跟之前 取過號碼的元素做比較，如果發現有一樣的號碼，可以使用i--讓 隨機亂數在重找一遍號碼，當然外面迴圈跑到越後面，後面的元素 取得的號碼跟前面重複的機會就越高。所以，這個迴圈會跑個很多次， 使用計數器，發現49取49個亂數的迴圈跑個四百多次都有可能。 方法四：已選出來的，把儲存值更改成零或負一.. Javascript使用方法二更方便，直接刪除已經取得的號碼。 <script type="text/javascript">   var arr =[];     for (i=0;i<49;i++){        arr[i]=i+1;     }   var rancodes6= new Array(6);   function ans(){     var x;     for(i=0;i<6;i++){       //這邊記得要用49-i，元素每取走一個，就少一個。     x=Math.floor(Math.random()*(49-i))     rancodes6[i]=arr.splice(x,1);   }   return rancodes6;   }     document.write(&quo
閱讀完整內容

子類別建構子super觀念

圖片
父類別子類別建構子觀念 寫程式編譯的時候出現一個 錯誤 IMPLICIT SUPER CONSTRUCTOR IS UNDEFINED FOR DEFAULT CONSTRUCTOR. MUST DEFINE AN EXPLICIT CONSTRUCTOR Implicit super constructor ZHero() is undefined. Must explicitly invoke another constructor Google找到這篇文章寫得很棒 https://ddnews.me/tech/qka5h3zp.html 關於JAVA建構子（CONSTRUCTOR）的常見問題總結 作者   六尺帳篷  - 2017-06-12 這篇文章總結了Java使用建構子中最常遇到的五個問題！ 1 為什麼調用子類的構造方法的時候，預設會調用父類的構造方法 看下面這個簡單的例子： package cc; public class Sub extends Super { public Sub() { System.out.println("Sub"); } public static void main(String[] args) { Sub sub = new Sub(); } } class Super { public Super() { System.out.println("Super"); } } Paste_Image.png 當繼承自一個類的時候，構造方法就會首先調用super()方法。如果沒有顯式的寫這個語句，那麼編譯器就會自動插入這個語句。這就是為什麼我們上面的那個例子程序會先調用super的構造方法。 但要切記，  雖然調用了父類的構造方法，但只建立了一個對象也就是子對象。 之所以要調用父類的構造方法，是因為super類可能需要建構子來初始化一些私有的成員變數。 編譯器自動插入super構造方法後，子類的建構子就會像下面這樣： public Sub(){ super()
閱讀完整內容