`
wangleyiang
  • 浏览: 220885 次
社区版块
存档分类
最新评论

Android ViewFlipper简单示例

阅读更多

ViewFlipper简单示例,详情请参考:http://developer.android.com/reference/android/widget/ViewFlipper.html

 

main.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" android:background="#ffffff">

    <ViewFlipper
        android:id="@+id/viewFlipper"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent" android:gravity="center">

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="1"
                android:textSize="60dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="2"
                android:textSize="60dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="3"
                android:textSize="60dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="4"
                android:textSize="60dip" />
        </LinearLayout>

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="center" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="5"
                android:textSize="60dip" />
        </LinearLayout>
    </ViewFlipper>

    <Button
        android:id="@+id/left_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:text="左" />

    <Button
        android:id="@+id/right_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:layout_margin="5dip"
        android:text="右" />

</RelativeLayout>

 说明:

  • 使用RelativeLayout做父容器,添加按钮在ViewFlipper顶部;
  • ViewFlipper的每个子页面并列于该View内;
  • ViewFlipper的每个子页面显示一个TextView;

main.xml效果:



 main.xml布局结构:



 运行效果图:



 

 

 说明:

  1. 点击顶部按钮,可以完成页面切换;
  2. 点击底部按钮,可以实现页面切换;
  3. 滑动页面,可以实现页面的切换;

切换动画/res/anim/目录下的动画文件分别如下:

push_left_in.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="100%p"
        android:toXDelta="0" />

    <alpha
        android:duration="500"
        android:fromAlpha="0.1"
        android:toAlpha="1.0" />

</set>

 push_left_out.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="-100%p" />

    <alpha
        android:duration="500"
        android:fromAlpha="1.0"
        android:toAlpha="0.1" />

</set>

 push_right_in.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="-100%p"
        android:toXDelta="0" />

    <alpha
        android:duration="500"
        android:fromAlpha="0.1"
        android:toAlpha="1.0" />

</set>

 push_right_out.xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="500"
        android:fromXDelta="0"
        android:toXDelta="100%p" />

    <alpha
        android:duration="500"
        android:fromAlpha="1.0"
        android:toAlpha="0.1" />

</set>

主要代码:

import android.app.Activity;
import android.graphics.PixelFormat;
import android.os.Bundle;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.View;
import android.view.Window;
import android.view.WindowManager;
import android.view.View.OnClickListener;
import android.view.WindowManager.LayoutParams;
import android.widget.Button;
import android.widget.ViewFlipper;

public class MainActivity extends Activity implements OnClickListener {
	
	private WindowManager windowManager;
	
	private Button leftButton;
	private Button rightButton;
	
	private ViewFlipper viewFlipper;
	
	private float xDown;
	private float yDown;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);

		getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
				WindowManager.LayoutParams.FLAG_FULLSCREEN);
		getWindow().requestFeature(Window.FEATURE_NO_TITLE);
		
		setContentView(R.layout.main);

		viewFlipper = (ViewFlipper) this.findViewById(R.id.viewFlipper);
		
		windowManager = (WindowManager) getApplicationContext().getSystemService("window");
		LayoutParams windowManagerParams = new WindowManager.LayoutParams();
		windowManagerParams.type = LayoutParams.TYPE_PHONE;
		windowManagerParams.format = PixelFormat.RGBA_8888;
		windowManagerParams.flags = LayoutParams.FLAG_NOT_TOUCH_MODAL
				| LayoutParams.FLAG_NOT_FOCUSABLE;
		windowManagerParams.x = 0;
		windowManagerParams.y = 0;
		windowManagerParams.width = WindowManager.LayoutParams.WRAP_CONTENT;
		windowManagerParams.height = WindowManager.LayoutParams.WRAP_CONTENT;
		
		leftButton = new Button(this);
		leftButton.setBackgroundResource(android.R.drawable.alert_light_frame);
		leftButton.setText("<");
		leftButton.setOnClickListener(this);
		windowManagerParams.gravity = Gravity.LEFT | Gravity.BOTTOM;
		windowManager.addView(leftButton, windowManagerParams);
		
		rightButton = new Button(this);
		rightButton.setBackgroundResource(android.R.drawable.alert_light_frame);
		rightButton.setText(">");
		rightButton.setOnClickListener(this);
		windowManagerParams.gravity = Gravity.RIGHT | Gravity.BOTTOM;
		windowManager.addView(rightButton, windowManagerParams);
		
		findViewById(R.id.left_button).setOnClickListener(this);
		findViewById(R.id.right_button).setOnClickListener(this);
		
	}

	private void showPrevious() {
		viewFlipper.setInAnimation(this, R.anim.push_left_in);
		viewFlipper.setOutAnimation(this, R.anim.push_left_out);
		viewFlipper.showPrevious();
	}

	private void showNext() {
		viewFlipper.setInAnimation(this, R.anim.push_right_in);
		viewFlipper.setOutAnimation(this, R.anim.push_right_out);
		viewFlipper.showNext();
	}

	@Override
	public boolean onTouchEvent(MotionEvent event) {
		switch (event.getAction()) {
		case MotionEvent.ACTION_DOWN:
			xDown = event.getX();
			yDown = event.getY();
			break;
		case MotionEvent.ACTION_MOVE:
			break;
		case MotionEvent.ACTION_UP:
			float dx = event.getX() - xDown;
			float dy = event.getY() - yDown;
			// 简单定义:当x方向变化量的绝对值大于y方向时,为水平方向滑动
			if (Math.abs(dx) > Math.abs(dy)) {
				// 水平方向变化量大于0时,为向右运动
				if (dx > 0) {
					showNext();
				}
				// 水平方向变化量小于0时,为向左运动
				else if (dx < 0) {
					showPrevious();
				}
			}
			break;
		}
		return true;
	}

	@Override
	protected void onStop() {
		super.onStop();
		windowManager.removeView(leftButton);
		windowManager.removeView(rightButton);
	}

	@Override
	public void onClick(View v) {
		if (v == leftButton) {
			showPrevious();
			return;
		}
		if (v == rightButton) {
			showNext();
			return;
		}
		switch (v.getId()) {
		case R.id.left_button:
			showPrevious();
			break;
		case R.id.right_button:
			showNext();
			break;
		default:
			break;
		}
	}
}

 说明:

  • 底部两个白色背景的按钮是通过WindowManager添加的,是系统级别的窗口,故需要添加对应的权限;
  • 添加<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />权限;
  • 通过viewFlipper.setInAnimation和viewFlipper.setOutAnimation方法设置动画效果;
  • 在onStop时,需要remove添加的系统级别的窗口,否则点击Home后,那两个系统级别的按钮还存在于桌面;
  • getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN, WindowManager.LayoutParams.FLAG_FULLSCREEN);请求全屏;
  • getWindow().requestFeature(Window.FEATURE_NO_TITLE);请求没有标题栏;

多说一句:就个人而言,不喜欢总是要各种权限的应用!除非操作需要,尽量不要随意添加权限!:)

 

 

 

 

  • 大小: 7 KB
  • 大小: 9.9 KB
  • 大小: 11.6 KB
  • 大小: 12.9 KB
  • 大小: 11.9 KB
分享到:
评论

相关推荐

    android ViewFlipper使用示例(注册引导页)

    android ViewFlipper使用示例(注册引导页)。做设定好的流程类的填写注册(就例如用户注册,帮助手册,引导页面也可以)。我的博客地址:http://blog.csdn.net/qq_16064871。

    android viewflipper 图片滑动demo

    本示例“android viewflipper 图片滑动demo”正是这样一个应用场景,用于展示如何用ViewFlipper实现在应用首次启动时的图片引导页面。 首先,我们需要了解ViewFlipper的基本概念。ViewFlipper是ViewGroup的一个子类...

    android viewflipper手势拖动效果(An-Beer工作室)

    总的来说,Android 的 ViewFlipper 为开发者提供了一种简单而强大的方式来实现多视图间的切换和动画效果,特别适用于创建动态且交互性强的用户界面。通过合理利用手势识别和自定义动画,开发者可以创造出丰富多样的...

    android中使用ViewFlipper实现滑动翻页示例

    在Android开发中,ViewFlipper是一个非常有用的布局控件,它允许我们轻松地实现滑动翻页的效果。这个示例将向我们展示如何在应用程序中使用ViewFlipper来创建一个动态翻页界面,使得用户可以通过手势或编程方式切换...

    Android ViewFlipper Animation 使用

    总的来说,Android的ViewFlipper组件提供了一种简单而强大的方式来管理多个视图并添加动画效果。通过灵活地使用动画和切换方法,开发者可以创造出丰富的用户交互体验。在项目中,根据需求选择合适的动画类型和触发...

    Android 滑动效果ViewFlipper

    **Android滑动效果ViewFlipper详解** 在Android开发中,我们常常需要实现各种动画效果来提升用户体验,其中滑动切换视图是一种常见的交互方式。`ViewFlipper`是Android SDK提供的一种布局容器,它允许我们在多个子...

    Android ViewFlipper水平滑动Demo.zip

    本示例"Android ViewFlipper水平滑动Demo"着重展示了如何利用ViewFlipper实现水平滑动效果。下面将详细讲解ViewFlipper的使用及其水平滑动的实现方式。 **1. ViewFlipper介绍** ViewFlipper是Android SDK中的一个...

    Android ActivtiyGroup和ViewFlipper实现Activity滑屏切换

    “android浏览图片,下面有圆点提示当1.rar”可能是一个图片浏览器的示例,使用了页码指示器;“自画曲线,并把曲线信息存入数据库,然后自动重画曲线.rar”可能涉及到图形绘制、数据存储和刷新机制;“android WIFI...

    Android ViewFlipper翻转视图使用详解

    使用示例:使用 ViewFlipper 实现图片轮播。在布局文件中,我们可以使用静态导入的方式将多个页面添加到 ViewFlipper 中,然后使用动画效果来实现图片的轮播。在这里,我们可以使用右进右出的动画效果,使用 right_...

    Android GridView + ViewFlipper布局界面,模仿“机锋市场.zip

    在本示例中,“Android GridView + ViewFlipper布局界面,模仿“机锋市场”是一个源码项目,旨在演示如何构建一个类似机锋市场的应用界面。下面我们将深入探讨这两个组件以及它们在实际开发中的应用。 首先,...

    viewflipper

    下面是一个简单的示例: ```java viewFlipper.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { switch (event.getAction()) { case ...

    Android使用ViewFlipper实现Switch动画特效。

    开发者可以参考这个示例来学习如何在实际项目中运用ViewFlipper和动画效果,以提升用户体验。 总结起来,Android的`ViewFlipper`组件为开发者提供了一种简便的方式来切换视图并添加动画效果。结合自定义控件和anim...

    AndroidViewSwapper:Android ViewFlipper 替代布局

    Android ViewFlipper 替代布局。由于 ViewFlipper 在 Dialog 中可能存在问题,因此造了个轮子。 本应用的示例 本示例基于 AndroidHelpers 库,访问 添加依赖。 开始使用: 在布局文件中声明一个 ViewSwapper 视图...

    android自定义轮播控件基于ViewFlipper

    `ViewFlipper`是Android SDK提供的一种布局管理器,它允许我们轻松地在多个视图之间进行切换,非常适合用来实现轮播图的效果。 首先,我们要了解`ViewFlipper`的基本用法。`ViewFlipper`继承自`FrameLayout`,它...

    android ViewFlipper + Gridview 实现网格视图由上向下自动滑动效果

    在本示例中,"android ViewFlipper + Gridview 实现网格视图由上向下自动滑动效果"的目标是构建一个动态的、自滚动的网格视图,这种效果常见于广告轮播或者产品展示等场景。 ViewFlipper是Android SDK提供的一种...

    android viewflipper 例子,项目源码,直接解压

    - **默认动画**:默认情况下,ViewFlipper会在切换视图时应用一个简单的滑动效果。 - **自定义动画**:开发者可以设置自定义动画,通过`setInAnimation()`和`setOutAnimation()`传入`Animation`对象。常见的动画...

    ViewFlipper的使用

    以下是一个简单的平移动画示例: ```xml &lt;set xmlns:android="http://schemas.android.com/apk/res/android"&gt; android:fromXDelta="100%p" android:toXDelta="0" android:duration="500" /&gt; ``` 将上述动画...

    Android仿淘宝头条滚动广告条 ViewFlipper

    `ViewFlipper`是Android SDK提供的一种布局容器,它允许我们在多个视图之间进行平滑的切换,常用于实现轮播图、广告条等效果。在实现淘宝头条滚动广告条时,我们首先需要理解`ViewFlipper`的基本用法。 1. **...

    ViewFlipper的三个小例子

    以下是一个简单的示例: ```java // 创建ViewFlipper对象 ViewFlipper viewFlipper = findViewById(R.id.view_flipper); // 添加两个视图 View view1 = ...; // 初始化第一个视图 View view2 = ...; // 初始化第二...

    ViewFlipper实现图片轮播

    以下是一个简单的示例: ```java ViewFlipper viewFlipper = findViewById(R.id.view_flipper); viewFlipper.setInAnimation(this, R.anim.slide_in_left); viewFlipper.setOutAnimation(this, R.anim.slide_out_...

Global site tag (gtag.js) - Google Analytics