天天看点

android studio StackView控件的源码解释和简单示例

   我在这里给大家介绍一个好玩的控件,stackView,但是这个控件好像不是很常用到,至少我也是最近才

遇到这个控件,觉得还是不错的,所以就给大家介绍下。也权当自己在熟悉一遍。

   因为网上的资料还比较少,所以自己将源码大略的翻译一遍,英语还是有点蹩脚,见谅!

   开始我们的学习之旅吧!!!

   stackView官方定义:A view that displays its children in a stack and allows users

to discretely swipe through the children.

   解释:stackView是在一个栈中显示它的子控件,可以允许用户直接的去滑动它的

子控件。

源码解释:

1、Google已经帮我们定义好了例如

//解释:默认的动画时间参数

    private static final int DEFAULT_ANIMATION_DURATION = 400;

    private static final int MINIMUM_ANIMATION_DURATION = 50;

    private static final int STACK_RELAYOUT_DURATION = 100;

//解释:定义两个往上滑或者往下滑的两个动作模式,并且是只在这两个模式间切换。

    //不会有第三个动作模式。

    private static final int ITEMS_SLIDE_UP = 0;

    private static final int ITEMS_SLIDE_DOWN = 1;

//解释:指定不同的手势状态以及一些手势状态等

    private static final int GESTURE_NONE = 0;

    private static final int GESTURE_SLIDE_UP = 1;

    private static final int GESTURE_SLIDE_DOWN = 2;

//解释:表示手指要往上或者下滑动多少,stackView才会完成剩下的滑动切换动作

    private static final float SWIPE_THRESHOLD_RATIO = 0.2f; //官方的是20%

//解释:指定到达相对于stackView控件的宽高的固定距离,则视图会执行向上或向下的滑动操作;

    private static final float SLIDE_UP_RATIO = 0.7f;

//解释:当前没有可用的手势时的默认值

    private static final int INVALID_POINTER = -1;

//解释:在stackView栈中的活动的视图的顺序。当一个fewer view视图(我理解为,较近的视图)

  //实际可见时,另一个视图就被隐藏了。

    private static final int NUM_ACTIVE_VIEWS = 5; //定义5个活动的视图

    private static final int FRAME_PADDING = 4; //?

    private final Rect mTouchRect = new Rect();

    private static final int MIN_TIME_BETWEEN_INTERACTION_AND_AUTOADVANCE = 5000;

    private static final long MIN_TIME_BETWEEN_SCROLLS = 100; //100毫秒就滑动完

//解释:以下这些变量值,是在栈中各个视图和用户交互时的状态密切相关的变量。

    private float mInitialY;

    private float mInitialX;

    private int mActivePointerId;

    private int mYVelocity = 0;

    .....还有好多,这里就不一一列举出来了。

stackView的函数解释:

//解释:这个是其中一个参数最多的构造函数

    public StackView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {

    }

//解释:在相对的两个不同的索引index里面进行动画切换。

    void transformViewForTransition(int fromIndex, int toIndex, final View view, boolean animate) {}

//显示下一个视图

public void showNext() {}

//显示上一个视图

public void showPrevious() {}

//处理鼠标滚轮事件的处理函数

public boolean onGenericMotionEvent(MotionEvent event) {}

//触发拦截触摸事件

public boolean onInterceptTouchEvent(MotionEvent ev) {}

 //不解释了这个,见太多了

public boolean onTouchEvent(MotionEvent ev) {}

//显示下一张,类似showNext()方法

public void advance() {}

//得到类名

public CharSequence getAccessibilityClassName() {

     return StackView.class.getName();

  }

//初始化??用

 public void onInitializeAccessibilityNodeInfoInternal(AccessibilityNodeInfo info) {}

最后给出一个简单的示例:

示例截图:

android studio StackView控件的源码解释和简单示例

直接上代码:

首先是主布局activity_main.xml,很简单的放了一个stackView和底部4个按钮分别是向上,向下切换,开始和停止播放自动动画。

<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"
    tools:context=".MainActivity">

    <StackView
        android:id="@+id/sk_show"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:loopViews="true" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:gravity="center"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btn_prev"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="privious" />

        <Button
            android:id="@+id/btn_next"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="next" />

        <Button
            android:id="@+id/btn_autoPlay"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="auto play" />

        <Button
            android:id="@+id/btn_autostop"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:text="auto play" />
    </LinearLayout>
</RelativeLayout>
           

然后是一个用来装载每一个图片的子布局stackview_cell.xml,里面就放了一个imageView而已。

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

    <ImageView
        android:layout_centerInParent="true"
        android:id="@+id/img_show"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleType="fitCenter" />
</RelativeLayout>
           

最后是MainActivity.java的代码,主要是利用适配器将每个图片设置进stackView里面去。还加上一个自动循环播放的按钮和停止播放的按钮。

package com.kuyu.com.stackview;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
import android.widget.SimpleAdapter;
import android.widget.StackView;

import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import java.util.Timer;
import java.util.TimerTask;

public class MainActivity extends AppCompatActivity implements View.OnClickListener {
    private StackView sk_show;
    private Button btn_prev, btn_next, btn_autoplay, btn_autostop;
    private int[] imgIds = new int[]{R.drawable.imgv1, R.drawable.imgv2, R.drawable.imgv3,
            R.drawable.imgv4, R.drawable.imgv5, R.drawable.imgv6};
    private Timer timer;
    private TimerTask task;
    private final int UPDATE_ID = 101;
    private int iCount;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initViews();
        initListener();
        initDate();
    }

    /**
     * 初始化空间
     */
    private void initViews() {
        sk_show = (StackView) findViewById(R.id.sk_show);
        btn_prev = (Button) findViewById(R.id.btn_prev);
        btn_next = (Button) findViewById(R.id.btn_next);
        btn_autoplay = (Button) findViewById(R.id.btn_autoPlay);
        btn_autostop = (Button) findViewById(R.id.btn_autostop);
    }

    /**
     * 初始化监听器
     */
    private void initListener() {
        btn_prev.setOnClickListener(this);
        btn_next.setOnClickListener(this);
        btn_autoplay.setOnClickListener(this);
        btn_autostop.setOnClickListener(this);
    }

    /**
     * 初始化数据
     */
    private void initDate() {
        List<Map<String, Object>> listItems = new ArrayList<>();
        for (int i = 0; i < imgIds.length; i++) {
            Map<String, Object> item = new HashMap<String, Object>() {
            };
            item.put("img", imgIds[i]);
            listItems.add(item);
        }
        SimpleAdapter adapter = new SimpleAdapter(this, listItems, R.layout.stackview_cell, new
                String[]{"img"}, new int[]{R.id.img_show}); //用适配器将每个图片设置到stackView里面去
        sk_show.setAdapter(adapter);
        btn_autostop.setClickable(false);
    }



    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn_prev:
                sk_show.showPrevious();
                break;

            case R.id.btn_next:
                sk_show.showNext();
                break;

            case R.id.btn_autoPlay:
                btn_autoplay.setClickable(false);
                btn_autostop.setClickable(true);
                startPlay();
                break;

            case R.id.btn_autostop:
                btn_autostop.setClickable(false);
                btn_autoplay.setClickable(true);
                stopPlay();
                break;
        }
    }

    /**
     * 开始自动播放
     */
    private void startPlay() {
        timer = new Timer();
        task = new TimerTask() {
            @Override
            public void run() {
                Message msg = handler.obtainMessage();
                msg.arg1 = UPDATE_ID;
                handler.sendMessage(msg);
                iCount++;
                if(iCount > 20){
                    timer.cancel();
                    task.cancel();
                    iCount = 0;
                    btn_autoplay.setClickable(true);
                }
            }
        };
        timer.schedule(task,0, 1000);
    }

    /**
     * 停止自动播放
     */
    private void stopPlay(){
        timer.cancel();
        task.cancel();
    }

    /**
     * 更新ui
     */
    Handler handler = new Handler(){
        public void handleMessage(Message msg) {
            switch (msg.arg1){
                case UPDATE_ID:
                    sk_show.showNext();
                    break;
            }
        }
    };
}
           

   最后,奉上下载链接:点击打开链接

   好啦,关于StackView控件就先介绍到这里了。

   以后发现有更好玩的东西在放上来,大家一起分享。