ViewFlipper和ViewPager，fluttertextfield高度

原创于 2021-12-16 17:56:44 发布 · 165 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#面试 #android #移动开发

程序员专栏收录该内容

98 篇文章

订阅专栏

本文介绍了在Android中如何使用ViewFlipper和ViewPager实现滑动翻页效果，提供了详细的XML布局代码和Java实现，包括自定义动画效果。适合Android开发者学习移动开发中的页面滑动切换技巧。

下面的代码片段详细说明了如何实现滑动翻页。

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:orientation=“vertical” >

<ViewFlipper

android:id="@+id/viewFlipper1"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent” >

<ImageView

android:id="@+id/imageView1"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:src="@drawable/b" />

<ImageView

android:id="@+id/imageView2"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:src="@drawable/c" />

<ImageView

android:id="@+id/imageView3"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:src="@drawable/d" />

<ImageView

android:id="@+id/imageView4"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:src="@drawable/f" />

<ImageView

android:id="@+id/imageView5"

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:src="@drawable/g" />

</ViewFlipper>

</LinearLayout>

public class ViewFlipperActivity extends Activity implements OnTouchListener, android.view.GestureDetector.OnGestureListener {

private ViewFlipper flipper;

GestureDetector mGestureDetector;

private int mCurrentLayoutState;

private static final int FLING_MIN_DISTANCE = 80;

private static final int FLING_MIN_VELOCITY = 150;

@Override

protected void onCreate(Bundle savedInstanceState) {

// TODO Auto-generated method stub

super.onCreate(savedInstanceState);

setContentView(R.layout.viewflipper);

flipper=(ViewFlipper) this.findViewById(R.id.viewFlipper1);

//注册一个用于手势识别的类

mGestureDetector = new GestureDetector(this);

//给mFlipper设置一个listener

flipper.setOnTouchListener(this);

mCurrentLayoutState = 0;

//允许长按住ViewFlipper,这样才能识别拖动等手势

flipper.setLongClickable(true);

}

/**

* 此方法在本例中未用到，可以指定跳转到某个页面

* @param switchTo

public void switchLayoutStateTo(int switchTo) {

while (mCurrentLayoutState != switchTo) {

if (mCurrentLayoutState > switchTo) {

mCurrentLayoutState–;

flipper.setInAnimation(inFromLeftAnimation());

flipper.setOutAnimation(outToRightAnimation());

flipper.showPrevious();

} else {

mCurrentLayoutState++;

flipper.setInAnimation(inFromRightAnimation());

flipper.setOutAnimation(outToLeftAnimation());

flipper.showNext();

}

/**

* 定义从右侧进入的动画效果

* @return

protected Animation inFromRightAnimation() {

Animation inFromRight = new TranslateAnimation(

Animation.RELATIVE_TO_PARENT, +1.0f,

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, 0.0f);

inFromRight.setDuration(200);

inFromRight.setInterpolator(new AccelerateInterpolator());

return inFromRight;

}

/**

* 定义从左侧退出的动画效果

* @return

protected Animation outToLeftAnimation() {

Animation outtoLeft = new TranslateAnimation(

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, -1.0f,

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, 0.0f);

outtoLeft.setDuration(200);

outtoLeft.setInterpolator(new AccelerateInterpolator());

return outtoLeft;

}

/**

* 定义从左侧进入的动画效果

* @return

protected Animation inFromLeftAnimation() {

Animation inFromLeft = new TranslateAnimation(

Animation.RELATIVE_TO_PARENT, -1.0f,

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, 0.0f);

inFromLeft.setDuration(200);

inFromLeft.setInterpolator(new AccelerateInterpolator());

return inFromLeft;

}

/**

* 定义从右侧退出时的动画效果

* @return

protected Animation outToRightAnimation() {

Animation outtoRight = new TranslateAnimation(

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, +1.0f,

Animation.RELATIVE_TO_PARENT, 0.0f,

Animation.RELATIVE_TO_PARENT, 0.0f);

outtoRight.setDuration(200);

outtoRight.setInterpolator(new AccelerateInterpolator());

return outtoRight;

}

public boolean onDown(MotionEvent e) {

// TODO Auto-generated method stub

return false;

}

* 用户按下触摸屏、快速移动后松开即触发这个事件

* e1：第1个ACTION_DOWN MotionEvent

* e2：最后一个ACTION_MOVE MotionEvent

* velocityX：X轴上的移动速度，像素/秒

* velocityY：Y轴上的移动速度，像素/秒

* 触发条件：

* X轴的坐标位移大于FLING_MIN_DISTANCE，且移动速度大于FLING_MIN_VELOCITY个像素/秒

public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,

float velocityY) {

if (e1.getX() - e2.getX() > FLING_MIN_DISTANCE

&& Math.abs(velocityX) > FLING_MIN_VELOCITY) {

// 当像左侧滑动的时候

//设置View进入屏幕时候使用的动画

flipper.setInA

《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》

【docs.qq.com/doc/DSkNLaERkbnFoS0ZF】完整内容开源分享

nimation(inFromRightAnimation());

//设置View退出屏幕时候使用的动画

flipper.setOutAnimation(outToLeftAnimation());

flipper.showNext();

} else if (e2.getX() - e1.getX() > FLING_MIN_DISTANCE

&& Math.abs(velocityX) > FLING_MIN_VELOCITY) {

// 当像右侧滑动的时候

flipper.setInAnimation(inFromLeftAnimation());

flipper.setOutAnimation(outToRightAnimation());

flipper.showPrevious();

}

return false;

}

public void onLongPress(MotionEvent e) {

// TODO Auto-generated method stub

}

public boolean onScroll(MotionEvent e1, MotionEvent e2, float distanceX,

float distanceY) {

// TODO Auto-generated method stub

return false;

}

public void onShowPress(MotionEvent e) {

// TODO Auto-generated method stub

}

public boolean onSingleTapUp(MotionEvent e) {

// TODO Auto-generated method stub

return false;

}

public boolean onTouch(View v, MotionEvent event) {

// TODO Auto-generated method stub

// 一定要将触屏事件交给手势识别类去处理（自己处理会很麻烦的）

return mGestureDetector.onTouchEvent(event);

}

from：http://blog.youkuaiyun.com/arui319

2、ViewPager

说明：

ViewPager用于实现多页面的切换效果，该类存在于Google的兼容包里面，所以在引用时记得在BuilldPath中加入“android-support-v4.jar”

主布局文件

main.xml

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android=“http://schemas.android.com/apk/res/android”

android:layout_width=“fill_parent”

android:layout_height=“fill_parent”

android:orientation=“vertical” >

<android.support.v4.view.ViewPager

android:id="@+id/viewpager"

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“center” >

<android.support.v4.view.PagerTitleStrip

android:id="@+id/pagertitle"

android:layout_width=“wrap_content”

android:layout_height=“wrap_content”

android:layout_gravity=“top” />

</android.support.v4.view.ViewPager>

</LinearLayout>

其中ViewPager为多页显示控件，PagerTitleStrip用于显示当前页面的标题

主窗口代码：

PagerTitleDemoActivity.java

package com.ns.pager;

import java.util.ArrayList;

import android.app.Activity;

import android.os.Bundle;

import android.support.v4.view.PagerAdapter;

import android.support.v4.view.PagerTitleStrip;

import android.support.v4.view.ViewPager;

import android.view.LayoutInflater;

import android.view.View;

public class PagerTitleDemoActivity extends Activity {

/** Called when the activity is first created. */

private ViewPager mViewPager;

private PagerTitleStrip mPagerTitleStrip;

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.main);

mViewPager = (ViewPager)findViewById(R.id.viewpager);

mPagerTitleStrip = (PagerTitleStrip)findViewById(R.id.pagertitle);

//将要分页显示的View装入数组中

LayoutInflater mLi = LayoutInflater.from(this);

View view1 = mLi.inflate(R.layout.view1, null);

View view2 = mLi.inflate(R.layout.view2, null);

View view3 = mLi.inflate(R.layout.view3, null);

//每个页面的Title数据

final ArrayList views = new ArrayList();

views.add(view1);

views.add(view2);

views.add(view3);

final ArrayList titles = new ArrayList();

titles.add(“tab1”);

titles.add(“tab2”);

titles.add(“tab3”);

//填充ViewPager的数据适配器

PagerAdapter mPagerAdapter = new PagerAdapter() {

@Override

public boolean isViewFromObject(View arg0, Object arg1) {

return arg0 == arg1;

}

@Override

public int getCount() {

return views.size();

}

@Override

public void destroyItem(View container, int position, Object object) {

((ViewPager)container).removeView(views.get(position));

}

@Override

public CharSequence getPageTitle(int position) {

return titles.get(position);

}

@Override

public Object instantiateItem(View container, int position) {

((ViewPager)container).addView(views.get(position));

return views.get(position);

}

};

mViewPager.setAdapter(mPagerAdapter);

}

运行效果：

from：http://my.oschina.net/fanxiao/blog/40306

3、Gallery

package xiaosi.gallery;
Sequence getPageTitle(int position) {

return titles.get(position);

}

@Override

public Object instantiateItem(View container, int position) {

((ViewPager)container).addView(views.get(position));

return views.get(position);

}

};

mViewPager.setAdapter(mPagerAdapter);

}

[外链图片转存中…(img-7fOo1jOS-1639648587608)]

运行效果：

[外链图片转存中…(img-UsXs0J3i-1639648587608)]

from：http://my.oschina.net/fanxiao/blog/40306

3、Gallery

[外链图片转存中…(img-g0H8KSlm-1639648587609)]

package xiaosi.gallery;