android中可左右滑动输入框
在网上无意看到一个UI动画，用户输入身份证信息时可以左右滑动输入框进行输入，并且信息可以实时显示。闲下之余，自己就动手用代码实现出来了，废话不多说，开始讲讲如何实现制作的。
1，布局制作
先写一个主界面avtivity_main，这里只是显示界面，为了便于实现交互，使用FrameLayout实现主要界面，布局填充。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#FC9B18"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="@+id/tv_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="身份证信息"
android:textColor="#fff"
android:textSize="22sp" />
LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:id="@+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
FrameLayout>
LinearLayout>
LinearLayout>
下面是主要界面fragment_pager，用于展示输入界面和显示输入内容，没有使用权重，因为弹出的输入框是放在ViewPager中，如果使用权重比例，会影响效果。
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/mainview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EFEFEF"
android:orientation="vertical" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="180dp"
android:layout_marginLeft="22dp"
android:layout_marginRight="22dp"
android:layout_marginTop="10dp"
android:background="@drawable/papers_bag"
android:orientation="vertical"
android:paddingLeft="22dp" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="证件信息"
android:textColor="#9fffffff"
android:textSize="16sp" />
<View
android:layout_width="190dp"
android:layout_height="1dp"
android:layout_marginTop="8dp"
android:background="#80ffffff" >
View>
<LinearLayout
style="@style/papers_bag"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
style="@style/papers_textview_type"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:text="姓名" />
<TextView
android:id="@+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:text="唯一"
android:textColor="#80ffffff"
android:textSize="14sp" />
LinearLayout>
<LinearLayout
style="@style/papers_bag"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
style="@style/papers_textview_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="证件类型" />
<TextView
android:id="@+id/tv_pager"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:text="身份证"
android:textColor="#80ffffff"
android:textSize="14sp" />
LinearLayout>
<LinearLayout
style="@style/papers_bag"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
style="@style/papers_textview_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="证件号码" />
<TextView
android:id="@+id/tv_nume"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="4dp"
android:text="4654986546549894"
android:textColor="#80ffffff"
android:textSize="14sp" />
LinearLayout>
LinearLayout>
<LinearLayout
android:id="@+id/ll_erview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipChildren="false"
android:gravity="center_horizontal"
android:orientation="vertical" >
<android.support.v4.view.ViewPager
android:id="@+id/viewpager"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:clipChildren="false"
android:focusable="true"
android:focusableInTouchMode="true"
android:visibility="gone" >
android.support.v4.view.ViewPager>
<TextView
android:id="@+id/tv_sname"
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="10dp"
android:background="@drawable/shape_rectangle"
android:gravity="center_vertical"
android:paddingLeft="20dp"
android:text="姓名"
android:textSize="12sp" />
<TextView
android:id="@+id/tv_spager"
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="16dp"
android:background="@drawable/shape_rectangle"
android:gravity="center_vertical"
android:paddingLeft="20dp"
android:text="证件类型"
android:textSize="12sp" />
<TextView
android:id="@+id/tv_snume"
android:layout_width="match_parent"
android:layout_height="55dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="16dp"
android:background="@drawable/shape_rectangle"
android:gravity="center_vertical"
android:paddingLeft="20dp"
android:text="证件号"
android:textSize="12sp"
android:visibility="visible" />
<Button
android:id="@+id/bt_next"
android:layout_width="320dp"
android:layout_height="55dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="16dp"
android:background="@drawable/identity_selector"
android:text="下一步"
android:textColor="#ffffff"
android:textSize="24sp" >
Button>
LinearLayout>
LinearLayout>左右滑动输入布局item，在ViewPager中放置控件EditView，详见代码实例
2、代码逻辑
一个Activity，一个Fragment，当然使用ViewPager肯定少不了Adapter，将主要代码编写在里Fragment中，这里实现主要逻辑。
在Adapter中EditPagerAdapter继承PargerAdapter，重写instantiateItem（）方法，将ItemView初始化成ViewPager对象。这样含有EditView的ViewPager就可以实现左右滑动的效果。
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % listView.size();
if (position < 0) {
position = listView.size() + position;
}
View view = listView.get(position);
// 如果View已经在之前添加到了一个父组件，则必须先remove，否则会抛出IllegalStateException。
ViewParent vp = view.getParent();
if (vp != null) {
ViewGroup parent = (ViewGroup) vp;
parent.removeView(view);
}
((ViewPager) container).addView(view);
return view;
}DepthPageTransformer是网上找到的工具类，来实现ViewPager两侧若隐若现的效果，通过viewpager中setPageMargin（）方法，传入设置的间距，可使效果更加明显。
这里讲一下ViewPager中EditView与软键盘的交互：
1.在身份证、姓名等的地方是TextView，当点击时同时弹出ViewPager与软键盘
2.根据软键盘隐藏和显示，整个view布局发生的高度变化，来判断ViewPager显示状态
注意：初始化ViewPager中EditView以及键盘焦点获取必须要在Activity生命周期onResume()中，因为在oncreate中View.getWidth和View.getHeight无法获得一个view的高度和宽度，这是因为View组件布局要在onResume回调后完成。
通过getViewTreeObserver().addOnGlobalLayoutListener()来获得宽度或者高度。这是获得整体view的宽度和高度的方法之一。
OnGlobalLayoutListener 是ViewTreeObserver的内部类，当一个视图树的布局发生改变时，可以被ViewTreeObserver监听到，这是一个注册监听视图树的观察者(observer)，在视图树的全局事件改变时得到通知。ViewTreeObserver不能直接实例化，而是通过getViewTreeObserver()获得。
这里定义为大于或小于500时，也可以实现大于小于布局整体高度的三分之一，这样更有利于适配。
// 根据界面弹出键盘布局整体高度发生变化来判断当键盘弹出时显示输入框，当键盘隐藏时同时隐藏滑动输入框
mainView.getViewTreeObserver().addOnGlobalLayoutListener(
new OnGlobalLayoutListener() {
@Override
public void onGlobalLayout() {
// TODO Auto-generated method stub
int heightDill = mainView.getRootView().getHeight()
- mainView.getHeight();
int height = mainView.getRootView().getHeight();
int height2 = mainView.getHeight();
//
if (heightDill > 500) {
viewpager.setVisibility(View.VISIBLE);
} else {
viewpager.setVisibility(View.GONE);
}
}
});下面是获取软键盘的方法，当点击身份证、姓名等的地方TextView获取软键盘。
private void getSoftKef(final View v) {
InputMethodManager m = (InputMethodManager) v.getContext()
.getSystemService(Context.INPUT_METHOD_SERVICE);
m.toggleSoftInput(0, InputMethodManager.HIDE_NOT_ALWAYS);
}private void initView(int num) {
for (int i = 0; i < num; i++) {
View itemView = View.inflate(getActivity(),
R.layout.viewpager_item, null);
TextView tv_item = (TextView) itemView.findViewById(R.id.tv_item);
et_item = (EditText) itemView.findViewById(R.id.et_item);
et_item.requestFocus();
//给editText获取软键盘焦点
final InputMethodManager intputManager = (InputMethodManager) et_item
.getContext()
.getSystemService(Context.INPUT_METHOD_SERVICE);
ImageView iv_item = (ImageView) itemView.findViewById(R.id.iv_item);
if (i == 0) {
tv_item.setText("姓名");
onTextWatcher(tv_name, tv_sname);
iv_item.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
viewpager.setCurrentItem(1);
}
});
} else if (i == 1) {
tv_item.setText("证件类型");
onTextWatcher(tv_pager, tv_spager);
iv_item.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
viewpager.setCurrentItem(2);
}
});
} else if (i == 2) {
tv_item.setText("证件号");
onTextWatcher(tv_nume, tv_snume);
iv_item.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
intputManager.hideSoftInputFromWindow(
et_item.getWindowToken(), 0);
}
});
}
listView.add(itemView);
}
}3**总结**
此实例充分运用ViewPager左右滑动的效果，Fragment，视图树监听整体布局的变化来实现，使输入框更加炫酷，运用在项目也是不错的动画效果，不足之处屏幕适配不够好，在2560*1440像素中，滑动的ViewPager会变的比较小，而且在底部与软键盘间距较大。这个问题后期需要优化，有兴趣的朋友有什么好的方案可以给我留言
下面是github上eclipse版本源代码下载地址：https://github.com/ComeonSZH/EditViewSlide
我是一只奋斗的菜鸟