安卓使用onTouchEvent实现滑屏(左右滑动,底部图标跟着移动)功能
时间: 2023-12-22 14:03:48 浏览: 49
可以通过以下步骤实现安卓滑屏功能:
1. 在布局文件中添加一个 `RelativeLayout` 作为外层容器,并在其中添加一个 `ViewPager` 用于滑动展示内容,以及一个底部固定的 `LinearLayout` 用于显示滑动的指示图标。
2. 在 Activity 中获取 ViewPager 和 LinearLayout 的引用,并创建一个 PagerAdapter 用于为 ViewPager 设置内容。
3. 在 PagerAdapter 中实现 `instantiateItem()` 方法,将需要滑动的页面添加到 ViewPager 中,并返回页面的 View。
4. 在 Activity 中设置 ViewPager 的 PagerAdapter,并使用 `addOnPageChangeListener()` 方法监听 ViewPager 的滑动事件。
5. 在 `onPageScrolled()` 方法中计算当前 ViewPager 的滑动偏移量,根据偏移量调整底部指示图标的位置。
6. 在 Activity 中重写 `onTouchEvent()` 方法,根据手指在屏幕上的移动距离,判断用户是想进行左滑还是右滑操作,并通过 ViewPager 的 `setCurrentItem()` 方法实现页面的切换。
以下是具体的代码实现:
XML 布局文件:
```
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ViewPager
android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<LinearLayout
android:id="@+id/indicator_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:orientation="horizontal">
<ImageView
android:id="@+id/indicator_1"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_margin="5dp"
android:src="@drawable/indicator_selected" />
<ImageView
android:id="@+id/indicator_2"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_margin="5dp"
android:src="@drawable/indicator_unselected" />
<ImageView
android:id="@+id/indicator_3"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_margin="5dp"
android:src="@drawable/indicator_unselected" />
</LinearLayout>
</RelativeLayout>
```
Activity 中的代码:
```
public class MainActivity extends AppCompatActivity {
private ViewPager viewPager;
private LinearLayout indicatorLayout;
private int[] imageIds = {R.drawable.image1, R.drawable.image2, R.drawable.image3};
private List<ImageView> imageViews = new ArrayList<>();
private int currentPosition = 0;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = findViewById(R.id.view_pager);
indicatorLayout = findViewById(R.id.indicator_layout);
for (int i = 0; i < imageIds.length; i++) {
ImageView imageView = new ImageView(this);
imageView.setImageResource(imageIds[i]);
imageView.setScaleType(ImageView.ScaleType.CENTER_CROP);
imageViews.add(imageView);
ImageView indicator = (ImageView) indicatorLayout.getChildAt(i);
indicator.setImageResource(i == 0 ? R.drawable.indicator_selected : R.drawable.indicator_unselected);
}
viewPager.setAdapter(new PagerAdapter() {
@Override
public int getCount() {
return imageIds.length;
}
@Override
public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
return view == object;
}
@NonNull
@Override
public Object instantiateItem(@NonNull ViewGroup container, int position) {
ImageView imageView = imageViews.get(position);
container.addView(imageView);
return imageView;
}
@Override
public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
container.removeView((View) object);
}
});
viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
int leftMargin = (int) ((position + positionOffset) * (getResources().getDimension(R.dimen.indicator_size) + getResources().getDimension(R.dimen.indicator_margin)));
RelativeLayout.LayoutParams layoutParams = (RelativeLayout.LayoutParams) indicatorLayout.getLayoutParams();
layoutParams.setMargins(leftMargin, 0, 0, 0);
indicatorLayout.setLayoutParams(layoutParams);
}
@Override
public void onPageSelected(int position) {
ImageView currentIndicator = (ImageView) indicatorLayout.getChildAt(currentPosition);
currentIndicator.setImageResource(R.drawable.indicator_unselected);
ImageView nextIndicator = (ImageView) indicatorLayout.getChildAt(position);
nextIndicator.setImageResource(R.drawable.indicator_selected);
currentPosition = position;
}
@Override
public void onPageScrollStateChanged(int state) {
}
});
}
private float startX;
private float startY;
@Override
public boolean onTouchEvent(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
startX = event.getX();
startY = event.getY();
break;
case MotionEvent.ACTION_MOVE:
float endX = event.getX();
float endY = event.getY();
if (Math.abs(endX - startX) > Math.abs(endY - startY)) {
if (endX - startX > 0 && currentPosition > 0) {
viewPager.setCurrentItem(currentPosition - 1);
} else if (endX - startX < 0 && currentPosition < imageIds.length - 1) {
viewPager.setCurrentItem(currentPosition + 1);
}
}
break;
case MotionEvent.ACTION_UP:
break;
}
return super.onTouchEvent(event);
}
}
```