您的位置:首页 > 移动开发 > Android开发

Android之实现局部自动滑动图片以及图片点击事件(Activity和Fragment都可)

2020-06-04 05:38 453 查看

参考:https://blog.csdn.net/small_lee/article/details/51213245
1、创立布局文件:(提示:将图片资源放在drawable文件中)

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">

<androidx.viewpager.widget.ViewPager
android:id="@+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="100dp" />
<RadioGroup
android:id="@+id/group"
android:layout_width="fill_parent"
android:layout_height="100dp"/>
</LinearLayout>

</FrameLayout>

2、若是要在Activity中实现,则参考以下代码,否则跳转3:

package com.example.slideimg;

import android.os.*;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.*;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

import java.lang.ref.*;
import java.util.*;

public class MainActivity extends AppCompatActivity {
private static ViewPager viewPager;
private RadioGroup group;
//图片资源,实际项目需要从网络获取
private int[] imageIds = {R.drawable.food01, R.drawable.food02, R.drawable.food03, R.drawable.food04};
//存放图片的数组
private List<ImageView> mList;
//当前索引位置以及上一个索引位置
private static int index = 0, preIndex = 0;
//是否需要轮播标志
private boolean isContinue = true;
//定时器,用于实现轮播
private Timer timer = new Timer();
private MyHandler mHandler;

public static class MyHandler extends Handler {
private WeakReference<MainActivity> weakReference;
public MyHandler(MainActivity activity) {
weakReference = new WeakReference<>(activity);
}
@Override
public void handleMessage(Message msg) {
if (weakReference.get() != null) {
index++;
viewPager.setCurrentItem(index);
}
super.handleMessage(msg);
}
}
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
initData();
addListener();
//让当前图片位于中间某个位置,目的就是为了开始能够左滑
viewPager.setCurrentItem(imageIds.length * 100);
initRadioButton(imageIds.length);//注意这句和上面那句顺序不能写反,否则会出现第一个圆点无法显示选中状态
startSwitch();
}
/**
* 初始化控件
*/
public void initView() {
viewPager = (ViewPager) findViewById(R.id.viewpager);
group= (RadioGroup) findViewById(R.id.group);
}
/**
* 初始化数据
*/
public void initData() {
mList = new ArrayList<>();
viewPager.setAdapter(pagerAdapter);
mHandler = new MyHandler(this);
}
/**
* 添加监听
*/
public void addListener() {
viewPager.addOnPageChangeListener(onPageChangeListener);
viewPager.setOnTouchListener(onTouchListener);
}
/**
* 进行图片轮播
*/
public void startSwitch() {
//执行定时任务
timer.schedule(new TimerTask() {
@Override
public void run() {
//首先判断是否需要轮播,是的话我们才发消息
if (isContinue) {
mHandler.sendEmptyMessage(1);
}
}
}, 3000, 3500);//延迟3秒,每隔3.5秒发一次消息;
}
/**
* 根据图片个数初始化按钮
* @param length 图片所在集合长度
*/
private void initRadioButton(int length) {
for (int i = 0; i < length; i++) {
ImageView imageview = new ImageView(this);
imageview.setPadding(20, 0, 0, 0);//设置每个按钮之间的间距
//将按钮依次添加到RadioGroup中
group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//默认选中第一个按钮,因为默认显示第一张图片
group.getChildAt(0).setEnabled(false);
}
}
/**
* 根据当前触摸事件判断是否要轮播
*/
View.OnTouchListener onTouchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
//手指按下和划动的时候停止图片的轮播
case MotionEvent.ACTION_DOWN:
case MotionEvent.ACTION_MOVE:
isContinue = false;
break;
default:
isContinue = true;
}
return false;//注意这里只能返回false,如果返回true,Dwon就会消费掉事件,MOVE无法获得事件,
// 导致图片无法滑动
}
};
/**
* 根据当前选中的页面设置按钮的选中
*/
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
index = position;//当前位置赋值给索引
setCurrentDot(index % imageIds.length);//因为只有四个按钮,所以我们在此要对长度区域,保证范围在0到4
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
/**
* 设置对应位置按钮的状态
* @param i 当前位置
*/
private void setCurrentDot(int i) {
if (group.getChildAt(i) != null) {
group.getChildAt(i).setEnabled(false);//当前按钮选中,显示蓝色
}
if (group.getChildAt(preIndex) != null) {
group.getChildAt(preIndex).setEnabled(true);//上一个取消选中。显示灰色
preIndex = i;//当前位置变为上一个,继续下次轮播
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
//返回一个比较大的值,目的是为了实现无限轮播
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % imageIds.length;//因为position非常大,而我们需要的position不能大于图片集合长度
//所以在此取余
ImageView imageView = new ImageView(MainActivity.this);
imageView.setImageResource(imageIds[position]);
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(imageView);
mList.add(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// 注意在此不要做任何操作,因为我们需要实现向左滑动,否则会产生IndexOutOfBoundsException
}
};
@Override
protected void onDestroy() {
super.onDestroy();
//页面销毁的时候取消定时器
if (timer != null) {
preIndex = 0;
timer.cancel();
}
}
}

3、在Fragment中实现:

package com.example.f2;

import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.RadioGroup;

import androidx.fragment.app.Fragment;
import androidx.viewpager.widget.PagerAdapter;
import androidx.viewpager.widget.ViewPager;

import java.lang.ref.WeakReference;
import java.util.ArrayList;
import java.util.List;
import java.util.Timer;
import java.util.TimerTask;

public class MyFragment1 extends Fragment {

private static ViewPager viewPager;
private RadioGroup group;
//图片资源,实际项目需要从网络获取
private int[] imageIds = {R.drawable.food01, R.drawable.food02, R.drawable.food03, R.drawable.food04};
//存放图片的数组
private List<ImageView> mList;
//当前索引位置以及上一个索引位置
private static int index = 0, preIndex = 0;
//是否需要轮播标志
private boolean isContinue = true;
//定时器,用于实现轮播
private Timer timer = new Timer();
private MyHandler mHandler;

public static class MyHandler extends Handler {
private WeakReference<Fragment> weakReference;
public MyHandler(Fragment fragment) {
weakReference = new WeakReference<>(fragment);
}
@Override
public void handleMessage(Message msg) {
if (weakReference.get() != null) {
index++;
viewPager.setCurrentItem(index);
}
super.handleMessage(msg);
}
}

public MyFragment1() {
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fg_content, container, false);

viewPager = (ViewPager)view.findViewById(R.id.viewpager);
group= (RadioGroup)view.findViewById(R.id.group);

initData();
addListener();
//让当前图片位于中间某个位置,目的就是为了开始能够左滑
viewPager.setCurrentItem(imageIds.length * 100);
initRadioButton(imageIds.length);//注意这句和上面那句顺序不能写反,否则会出现第一个圆点无法显示选中状态
startSwitch();
Log.e("HEHE", "1日狗");
return view;
}
/**
* 初始化控件
*/
/**
* 初始化数据
*/
public void initData() {
mList = new ArrayList<>();
viewPager.setAdapter(pagerAdapter);
mHandler = new MyHandler(this);
}
/**
* 添加监听
*/
public void addListener() {
viewPager.addOnPageChangeListener(onPageChangeListener);
viewPager.setOnTouchListener(onTouchListener);
}
/**
* 进行图片轮播
*/
public void startSwitch() {
//执行定时任务
timer.schedule(new TimerTask() {
@Override
public void run() {
//首先判断是否需要轮播,是的话我们才发消息
if (isContinue) {
mHandler.sendEmptyMessage(1);
}
}
}, 3000, 3500);//延迟3秒,每隔3.5秒发一次消息;
}
/**
* 根据图片个数初始化按钮
* @param length 图片所在集合长度
*/
private void initRadioButton(int length) {
for (int i = 0; i < length; i++) {
ImageView imageview = new ImageView(MyFragment1.super.getContext());
imageview.setPadding(20, 0, 0, 0);//设置每个按钮之间的间距
//将按钮依次添加到RadioGroup中
group.addView(imageview, ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
//默认选中第一个按钮,因为默认显示第一张图片
group.getChildAt(0).setEnabled(false);
}
}
/**
* 根据当前触摸事件判断是否要轮播
*/
View.OnTouchListener onTouchListener = new View.OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
//手指按下和划动的时候停止图片的轮播
case MotionEvent.ACTION_DOWN://点击事件
int id=imageView.getId();
if(id==0) Toast.makeText(getContext(),"点击了甜点"+id,Toast.LENGTH_SHORT).show();
else if(id==1) Toast.makeText(getContext(),"点击了主食"+id,Toast.LENGTH_SHORT).show();
else if(id==2) Toast.makeText(getContext(),"点击了快餐"+id,Toast.LENGTH_SHORT).show();
else Toast.makeText(getContext(),"点击了饮品"+id,Toast.LENGTH_SHORT).show();
break;
case MotionEvent.ACTION_MOVE:
isContinue = false;
break;
default:
isContinue = true;
}
return false;//注意这里只能返回false,如果返回true,Dwon就会消费掉事件,MOVE无法获得事件,
// 导致图片无法滑动
}
};
/**
* 根据当前选中的页面设置按钮的选中
*/
ViewPager.OnPageChangeListener onPageChangeListener = new ViewPager.OnPageChangeListener() {
@Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
index = position;//当前位置赋值给索引
setCurrentDot(index % imageIds.length);//因为只有四个按钮,所以我们在此要对长度区域,保证范围在0到4
}
@Override
public void onPageScrollStateChanged(int state) {
}
};
/**
* 设置对应位置按钮的状态
* @param i 当前位置
*/
private void setCurrentDot(int i) {
if (group.getChildAt(i) != null) {
group.getChildAt(i).setEnabled(false);//当前按钮选中,显示蓝色
}
if (group.getChildAt(preIndex) != null) {
group.getChildAt(preIndex).setEnabled(true);//上一个取消选中。显示灰色
preIndex = i;//当前位置变为上一个,继续下次轮播
}
}
PagerAdapter pagerAdapter = new PagerAdapter() {
@Override
public int getCount() {
//返回一个比较大的值,目的是为了实现无限轮播
return Integer.MAX_VALUE;
}
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
@Override
public Object instantiateItem(ViewGroup container, int position) {
position = position % imageIds.length;//因为position非常大,而我们需要的position不能大于图片集合长度
//所以在此取余
ImageView imageView = new ImageView(MyFragment1.super.getContext());
imageView.setImageResource(imageIds[position]);
imageView.setId(position);//用于点击事件
imageView.setScaleType(ImageView.ScaleType.FIT_XY);
container.addView(imageView);
mList.add(imageView);
return imageView;
}
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
// 注意在此不要做任何操作,因为我们需要实现向左滑动,否则会产生IndexOutOfBoundsException
}
};

@Override
public void onDestroy() {
super.onDestroy();
//页面销毁的时候取消定时器
if (timer != null) {
preIndex = 0;
timer.cancel();
}
}
}

4、结束。

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐