一步一步学android控件(之二十八)—— ViewFlipper

原创 2013年12月06日 09:16:01

说到ViewFlipper控件呢就想到ImageSwitcher和TextViewSwitcher(具体使用方法参见一步一步学android控件(之十九)—— ImageSwitcher & TextSwitcher),ImageSwitcher用来在两个ImageView之间切换;TextViewSwitcher用来在两个TextView之间切换;而ViewFlipper呢支持多种类型的多个View之间切换。ViewFlipper和ImageSwitcher、TextViewSwitcher的相同点就是同一时刻都只显示一个View。

ViewFlipper也是ViewAnimator的扩展,其继承结构图如下:


下面通过一个简单的示例展示ViewFlipper的用法:

1、在ViewFlipper中添加不同类型的View。

2、了解ViewFlipper的自动播放模式(类似幻灯片),个自定义用户操作模式(用户向左滑动显示下一个View,向右滑动,显示上一个View)。

效果展示:


贴代码:

1、布局文件widget_view_flipper_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/auto_fling_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/str_auto_fling" />

        <Button
            android:id="@+id/action_fling_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/str_action_fling" />
    </LinearLayout>

    <ViewFlipper
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/view_flipper_show"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:autoStart="true"
        android:flipInterval="2000"
        android:layout_gravity="center" >

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/app_name"
            android:src="@drawable/fendou" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/app_name"
            android:src="@drawable/image_run" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/app_name"
            android:src="@drawable/angry_bird" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:contentDescription="@string/app_name"
            android:src="@drawable/hello_image_view" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/app_name"
            android:textAppearance="?android:attr/textAppearanceLarge" />
    </ViewFlipper>

</LinearLayout>

属性android:autoStart="true",表示ViewFlipper自动切换。android:flipInterval="2000",切换的频率——每两秒切换一次View。


2、布局文件中使用到的字符串strings.xml

<!-- strings for ViewFlipper -->
    <string name="str_auto_fling">自动切换</string>
    <string name="str_action_fling">滑动切换</string>
    <!-- end -->

3、activity——WidgetViewFlipperActivity.java

package com.xy.zt.selfdefinewieget;

import android.app.Activity;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.View.OnTouchListener;
import android.widget.Button;
import android.widget.ViewFlipper;

public class WidgetViewFlipperActivity extends Activity
        implements OnClickListener, OnTouchListener {

    public static final float MIN_GAP = 10;
    private float downX;

    private ViewFlipper mFLipper;
    private Button mAutoFling;
    private Button mActionFLing;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.widget_view_flipper_layout);
        init();
    }

    private void init() {
        mFLipper = (ViewFlipper) findViewById(R.id.view_flipper_show);
        mAutoFling = (Button) findViewById(R.id.auto_fling_btn);
        mAutoFling.setOnClickListener(this);
        mActionFLing = (Button) findViewById(R.id.action_fling_btn);
        mActionFLing.setOnClickListener(this);
    }

    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.auto_fling_btn:
                mFLipper.setAutoStart(true);
                mFLipper.setFlipInterval(1000);
                mFLipper.setOnTouchListener(null);
                mFLipper.startFlipping();
                break;
            case R.id.action_fling_btn:
                mFLipper.stopFlipping();
                mFLipper.setAutoStart(false);
                mFLipper.setOnTouchListener(this);
                break;
        }

    }

    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                downX = event.getX();
                break;
            case MotionEvent.ACTION_UP:
                float upX = event.getX();
                if (upX - downX > MIN_GAP) {
                    mFLipper.showPrevious();
                } else if (upX - downX <= MIN_GAP) {
                    mFLipper.showNext();
                }
                break;
            case MotionEvent.ACTION_CANCEL:
                return false;

        }
        return true;
    }

}
在onTouch方法中根据水平滑动距离判断,是向左滑动则显示下一个View,向右滑动则显示上一个View。


4、在ViewData.java中添加如下内容(此部分内容可选):

public static final int VIEW_FLIPPER_ID = SLISING_DRAWER_ID + 1;
    public static final String VIEW_FLIPPER_NAME = "ViewFlipper";
private static final ViewData mViewFlipper = new ViewData(VIEW_FLIPPER_NAME,
            VIEW_FLIPPER_ID);
View_Datas.add(mViewFlipper);
WidgetsAdapter的handleItemClicked方法中添加如下内容:

case ViewData.VIEW_FLIPPER_ID:
                intent.setClass(mContext, WidgetViewFlipperActivity.class);
                mContext.startActivity(intent);
                break;

以上就是ViewFlipper的全部内容下一个控件SearchView 。



一步一步学zedboard之六生成镜像文件

用xilinx提供的petalinux tools,petalinux-build可以生成我们所需要的各种镜像文件。...
  • zhoudengqing
  • zhoudengqing
  • 2014年11月17日 15:06
  • 768

一步一步学ROP之Android ARM 32位篇

0x00    本文仅解释说明蒸米大神一步一步学ROP之Android ARM 32位篇,读者应先阅读这篇文章,遇到问题再来看我这篇文章。   0x01    第一个问题:payload = 'A'*...
  • jltxgcy
  • jltxgcy
  • 2016年02月19日 17:48
  • 1955

一步一步学ROP之linux_x86篇

0x00    本文仅解释说明蒸米大神一步一步学ROP之linux_x86篇,读者应先阅读这篇文章,遇到问题再来看我这篇文章。    阅读完这两篇文章后,我们会理解ROP(返回导向编程),DEP(堆栈...
  • jltxgcy
  • jltxgcy
  • 2016年02月19日 11:16
  • 2447

一步一步学android控件(之二) —— TextView

android 控件众多 , 额 , 具体多少个呢? 貌似有那么几十个吧,也没做个统计,嘿嘿!...... 有木有朋友感觉写了那么长时间的android代码,有时候想写点自己的东西的时候却发现自己好...
  • sun_star1chen
  • sun_star1chen
  • 2013年10月26日 00:27
  • 3450

一步一步学springboot 一

Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置。通...
  • u010509052
  • u010509052
  • 2017年04月23日 23:12
  • 448

一步一步学做一个CPU——1,准备工作

一,准备工作 参考: 罗老板的计算机结构与组成课程 http://xgxy.cug.edu.cn/rjgcx/lzw/COD/ Machine Structures. Spri...
  • wyq120547
  • wyq120547
  • 2014年06月17日 12:05
  • 1340

小菜一步一步学数据结构之(二)算法和算法分析

一次数学课上,老师让学生练习算数。于是让他们一个小时内算出1+2+3+4+5+6+……+100的得数。全班只有高斯用了不到20分钟给出了答案,因为他想到了用(1+100)+(2+99)+(3+98)…...
  • IT_DS
  • IT_DS
  • 2016年01月12日 13:15
  • 1004

一步一步学RMAN第一篇 进入RMAN

 哈哈~~~~~天苍苍野茫茫,三思终于又出场。要问三思来干啥,来把RMAN讲一讲。吃喝玩乐间学习,心得体会一箩筐。不管结论对与错,先把过程来分享。如有异议务必提,共同学习共提高。  en,写的还挺顺口...
  • junsisi
  • junsisi
  • 2007年09月17日 16:58
  • 3538

【一步一步学NPOI】

【一步一步学NPOI】1.创建Excel 【一步一步学NPOI】2.设置单元格格式 【一步一步学NPOI】3.设置单元格宽高和边框 【一步一步学NPOI】4.字体与背景 【一步一步学NPOI】5...
  • aa2012123456
  • aa2012123456
  • 2016年02月15日 09:00
  • 408

一步一步跟我学hadoop(1)----hadoop概述和安装配置

这几年云计算大数据很火,借这个东风,今天开始学习apache的分布式计算框架hadoop,希望不要太落后。 Apache Hadoop是一个在大型集群的商品硬件上运行的应用程序的框架。Hadoop框架...
  • wuyinggui10000
  • wuyinggui10000
  • 2015年07月05日 23:08
  • 2327
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:一步一步学android控件(之二十八)—— ViewFlipper
举报原因:
原因补充:

(最多只允许输入30个字)