android功能引导界面实现,Android引导页面的简单实现

第一次进入应用的时候,都会有一个引导页面,引导页面的实现起来也很简单,实现的方式也有很多,下面是自己写的一个引导页面的效果,大致的实现思路为:

最外层是一个FragmentActivity,里面包含4个fragment,在fragment中给ViewPager开一个循环,这样实现了图片播,其实效果就是在FragmentActivity中几个fragment滑动切换,

fragment中ViewPager无限轮播和滑动切换;

下面为代码实现:

public class MainActivity extends ActionBarActivity {

private ViewPager viewpager;

private FragmentManager fm;

private ViewPagerAdapter adapter;

private ArrayList items = new ArrayList();

private Button btn_guide;

private View point1,point2,point3,point4;

private int choiceBg = R.drawable.shape_bule_point;// 被选背景

private int unChoiceBg = R.drawable.shape_center_point_red;// 未被选背景

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

requestWindowFeature(Window.FEATURE_NO_TITLE);

setContentView(R.layout.activity_main);

initView();

}

private void initView() {

btn_guide = (Button) findViewById(R.id.btn_guide);

point1 = findViewById(R.id.point1);

point2 = findViewById(R.id.point2);

point3 = findViewById(R.id.point3);

point4 = findViewById(R.id.point4);

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

fm = this.getSupportFragmentManager();

items.add(new FirstFragment());

items.add(new SecondFragment());

items.add(new ThridFragment());

items.add(new FourFragment());

adapter = new ViewPagerAdapter(fm,items);

viewpager.setAdapter(adapter);

viewpager.setCurrentItem(0,false);

viewpager.setOffscreenPageLimit(items.size());

// 被选设置为蓝色

point1.setBackgroundResource(choiceBg);

viewpager.setOnPageChangeListener(new GuidePageListener());

}

/**

* viewpager的滑动监听

*

* @author Kevin

*

*/

class GuidePageListener implements OnPageChangeListener {

// 滑动事件

@Override

public void onPageScrolled(int position,float positionOffset,int positionOffsetPixels) {

}

// 某个页面被选中

@Override

public void onPageSelected(int position) {

if (position == 0) {

setPointBg(choiceBg,unChoiceBg,unChoiceBg);

} else if (position == 1) {

setPointBg(unChoiceBg,choiceBg,unChoiceBg);

} else if (position == 2) {

setPointBg(unChoiceBg,unChoiceBg);

} else {

setPointBg(unChoiceBg,choiceBg);

}

if (position == items.size() - 1) {// 最后一个页面

btn_guide.setVisibility(View.VISIBLE);// 显示开始体验的按钮

} else {

btn_guide.setVisibility(View.INVISIBLE);

}

}

// 滑动状态发生变化

@Override

public void onPageScrollStateChanged(int state) {

}

}

/**

* 设置被选小圆点的背景颜色

*

* @param pointBg1

* @param pointBg2

* @param pointBg3

* @param pointBg4

*/

private void setPointBg(int pointBg1,int pointBg2,int pointBg3,int pointBg4) {

point1.setBackgroundResource(pointBg1);

point2.setBackgroundResource(pointBg2);

point3.setBackgroundResource(pointBg3);

point4.setBackgroundResource(pointBg4);

}

}

在这里要注意ViewPager和fragment在滑动变化时,改变底部小圆点被选的颜色;

public class HomeAdapter extends PagerAdapter {

private List data;

private ImageCycleViewListener mImageCycleViewListener;

private Context context;

public HomeAdapter(Context context,List data,ImageCycleViewListener mImageCycleViewListener) {

this.context = context;

this.mImageCycleViewListener = mImageCycleViewListener;

this.data = new ArrayList();

if (data != null) {

this.data.addAll(data);

}

}

public void notifyData(List data) {

if (data != null) {

this.data.clear();

this.data.addAll(data);

}

notifyDataSetChanged();

}

// 当天viewpager有多少个条目

LinkedList imageList = new LinkedList();

@Override

public int getCount() {

if (data.size() != 0) {

return Integer.MAX_VALUE;// 无限循环

} else {

return 0;

}

}

// 判断返回的对象和加载view对象关系

@Override

public boolean isViewFromObject(View arg0,Object arg1) {

return arg0 == arg1;

}

// 销毁一个条目

@Override

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

// super.destroyItem(container,position,object);

ImageView view = (ImageView) object;

imageList.add(view);// 把移除的对象添加到缓存集合中

container.removeView(view);

}

// 创建一个条目

@Override

public Object instantiateItem(ViewGroup container,int position) {

int index = 0;

if (data.size() != 0) {

index = position % data.size();

}

final ImageView image;

if (imageList.size() > 0) {

image = imageList.remove(0);

} else {

image = new ImageView(context);

}

// BitmapUtils bitmapUtils = BitMapHelper.getBitmapUtils();

final GuiderInfo vo = data.get(index);

if (vo != null) {

// String url = vo.url;

// bitmapUtils.display(image,url,new BitmapLoadCallBack() {

//

// @SuppressWarnings("deprecation")

// @Override

// public void onLoadCompleted(View arg0,String arg1,Bitmap bitmap,BitmapDisplayConfig arg3,BitmapLoadFrom arg4) {

// image.setImageBitmap(null);

// BitmapDrawable ob = new BitmapDrawable(context.getResources(),bitmap);

// image.setBackgroundDrawable(ob);

// }

//

// @Override

// public void onLoadFailed(View arg0,Drawable arg2) {

// // TODO Auto-generated method stub

//

// }

// });

int imageid = vo.imageid;

image.setImageResource(imageid);

// bitmapUtils.display(image,url);

}

final int pos = index;

if (mImageCycleViewListener != null) {

image.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

mImageCycleViewListener.onImageClick(vo,pos,image);

}

});

}

container.addView(image);// 加载的view对象

return image;// 返回的对象

}

/**

* 轮播控件的监听事件

*

* @author minking

*/

public static interface ImageCycleViewListener {

/**

* 单击图片事件

*

* @param position

* @param imageView

*/

public void onImageClick(GuiderInfo info,int postion,View imageView);

}

}

public class FirstFragment extends Fragment implements ImageCycleViewListener {

private View view;

private ViewPager header_view;

private HomeAdapter adapter;

private List data = new ArrayList();

private boolean flag;

private TextView tv_dis;

@Override

public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState) {

view = inflater.inflate(R.layout.first_fragment,container,false);

setData();

initView();

return view;

}

@SuppressWarnings("deprecation")

private void initView() {

tv_dis = (TextView) view.findViewById(R.id.tv_dis);

header_view = (ViewPager) view.findViewById(R.id.header_view);

adapter = new HomeAdapter(getActivity(),data,this);

header_view.setAdapter(adapter);

header_view.setOnPageChangeListener(new OnPageChangeListener() {

@Override

public void onPageSelected(int arg0) {

//计算当前选中的图片index

int index = arg0 % 2;

System.out.println("-----------index" + index);

GuiderInfo dtGzsApplyCenterHeader = data.get(index);

tv_dis.setText(""+dtGzsApplyCenterHeader.event_content);

}

@Override

public void onPageScrolled(int arg0,float arg1,int arg2) {

}

@Override

public void onPageScrollStateChanged(int arg0) {

}

});

// 设置中间值

final AuToRunTask run = new AuToRunTask();

header_view.setCurrentItem(1000 * data.size());// 实现左右两边都可以滑动

header_view.setOnTouchListener(new OnTouchListener() {

@Override

public boolean onTouch(View v,MotionEvent event) {

switch (event.getAction()) {

case MotionEvent.ACTION_DOWN:// 按下

run.stop();

break;

case MotionEvent.ACTION_CANCEL:// 事件取消

case MotionEvent.ACTION_UP:// 抬起

run.start();

break;

default:

break;

}

return false;// viewpager触摸事件返回值要是fasle不能为true

}

});

run.start();// 开启轮播

}

@Override

public void onImageClick(GuiderInfo info,View imageView) {

}

// 自动轮播

class AuToRunTask implements Runnable {

@Override

public void run() {

if (flag) {

// 取消之前的任务

DensityUtil.cancle(this);

// 获取当前条目

int currentItem = header_view.getCurrentItem();

currentItem++;

header_view.setCurrentItem(currentItem);

// 延迟执行当前的一个任务

DensityUtil.postDelayed(this,2000);// 递归调用

}

}

public void start() {

if (!flag) {

// 取消之前的任务

DensityUtil.cancle(this);

flag = true;

// 延迟执行当前的一个任务

DensityUtil.postDelayed(this,1000);// 递归调用

}

}

public void stop() {

if (flag) {

flag = false;

DensityUtil.cancle(this);

}

}

}

private void setData() {

GuiderInfo vo = new GuiderInfo();

vo.imageid = R.drawable.shape_red;

vo.event_content="红色";

data.add(vo);

GuiderInfo vo1 = new GuiderInfo();

vo1.imageid = R.drawable.shape_yellow;

vo1.event_content="黄色";

data.add(vo1);

}

}

以上为效果实现的主要代码,效果运行如下:

15059027381.gif?20171711223

上面的效果图还有一小部分效果未展示出来,其实上面的圆是循环轮播的,同时也是可以滑动的;

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

总结

以上是编程之家为你收集整理的Android引导页面的简单实现全部内容,希望文章能够帮你解决Android引导页面的简单实现所遇到的程序开发问题。

如果觉得编程之家网站内容还不错,欢迎将编程之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。

小编个人微信号 jb51ccc

喜欢与人分享编程技术与工作经验,欢迎加入编程之家官方交流群!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值