鱼鱼Chen之学写自己的apk（一） ViewPager实现第一次使用的引导

最新推荐文章于 2021-05-29 01:04:48 发布

Inori酱

最新推荐文章于 2021-05-29 01:04:48 发布

阅读量616

点赞数

本文链接：https://blog.csdn.net/zerolovesc1993/article/details/45066993

版权

恩，这个计划拖了好久。。。。。。终于开始写了，希望能对大家有所帮助

准备是一篇篇地把要用到的部分解析清楚，最后上我写好的apk（已经发布了哦）

http://apk.hiapk.com/appinfo/com.dota.example.targetapplication/1

一、分析一下结构

布局就不说了，每个对应一个Activity。MainActivity是主页面，WelcomeActivity是启动页面，GuideActivity是引导页面（只有第一次使用才会显示）。GuideViewPagerAdapter是用来给ViewPager使用的适配器

二、首先是WelcomeActivity

这里用到之前学到的知识点,如何创建一个启动页面

http://blog.csdn.net/zerolovesc1993/article/details/42871889

并结合使用了一个SharedPreferences来存储数据（用来判断是否为第一次使用）

关于SharedPreferences的使用这里简单说一下

SharedPreferences.Editor editor = getSharedPreferences("data",
				MODE_PRIVATE).edit();
		editor.putBoolean("isRunned", true);
		editor.commit();

这是写入的部分，先得到一个Editor，调用edit（）方法，才可以存储数据，跟intent的extra差不多。写好后一定要调用commit（）方法来提交。

SharedPreferences preferences = getSharedPreferences("data",
				MODE_PRIVATE);
		Flag = preferences.getBoolean("isRunned", false);

这是读取的部分，得到SharedPreferences后，直接就可取出。getBoolean()方法里的第二个参数表示不存在对应key时设置的默认值。

行了，上完整的代码。WelcomeActivity.java的

public class WelcomeActivity extends Activity {
	private ImageView imageView;
	private boolean Flag;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_welcome);
		imageView = (ImageView) findViewById(R.id.image_Center);
		SharedPreferences preferences = getSharedPreferences("data",
				MODE_PRIVATE);
		Flag = preferences.getBoolean("isRunned", false);
		Animation animation = new AlphaAnimation(0.3f, 1.0f);
		animation.setDuration(3000);
		imageView.setAnimation(animation);
		animation.setAnimationListener(new AnimationListener() {

			@Override
			public void onAnimationStart(Animation animation) {
				imageView.setImageResource(R.drawable.gc);
			}

			@Override
			public void onAnimationRepeat(Animation animation) {
				// TODO Auto-generated method stub

			}

			@Override
			public void onAnimationEnd(Animation animation) {
				if (Flag) {
					Intent intent = new Intent(WelcomeActivity.this,
							MainActivity.class);
					startActivity(intent);
					finish();
				} else {
					Intent intent = new Intent(WelcomeActivity.this,
							GuideActivity.class);
					startActivity(intent);
					finish();
				}
			}
		});
	}
}

activity_welcome.xml（layout）的

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/inroi003"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/image_Center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
         />

</RelativeLayout>

三、接着直接说MainActivity好了，重点放到最后讲

MainActivity里我加了一个重置记忆

public class MainActivity extends Activity {
	private Button btnReset;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		SharedPreferences.Editor editor = getSharedPreferences("data",
				MODE_PRIVATE).edit();
		editor.putBoolean("isRunned", true);
		editor.commit();
		btnReset = (Button) findViewById(R.id.btnReset);
		btnReset.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View v) {
				SharedPreferences.Editor editor = getSharedPreferences("data",
						MODE_PRIVATE).edit();
				editor.putBoolean("isRunned", false);
				editor.commit();
			}
		});
	}

}

activity_main.xml的（layout）

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.dota.example.fishychenofviewpager.MainActivity" >

    <TextView
        android:id="@+id/textView_main"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:text="这是主页面"
        android:textSize="25sp" />

    <Button
        android:id="@+id/btnReset"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView_main"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="16dp"
        android:text="重置" />

</RelativeLayout>

四、先写GuideActivity的布局部分吧

这边的思路是三个部分（1）ViewPager （2）一个ImageView用来进入主页面（3）一个LinearLayout用来存放所有的点

这里的话，要提的是，ViewPager这个组件虽然是google官方提供的组件，但是你还要是要用v4支持包来导入（包名别打错了哦）

android.support.v4.view.ViewPager

下面是完整的代码 activity_guide.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <ImageView
        android:id="@+id/image_Start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="32dp"
        android:background="@drawable/app_guide_overbtn"
        android:visibility="gone" />

    <LinearLayout
        android:id="@+id/linearLayout_point"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="8dp"
        android:orientation="horizontal" >

        <ImageView
            android:id="@+id/image_point01"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/selector_point" />

        <ImageView
            android:id="@+id/image_point02"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:background="@drawable/selector_point" />

        <ImageView
            android:id="@+id/image_point03"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:background="@drawable/selector_point" />

        <ImageView
            android:id="@+id/image_point04"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="8dp"
            android:background="@drawable/selector_point" />
    </LinearLayout>

</RelativeLayout>

五、创建自定义的ViewPager适配器

首先，我们让其继承PagerAdapter，实现两个抽象方法，并完成构造方法。

这里用到泛型list的概念，不太懂的最好百度一下，是java的知识

list<类型>算是一个集合类

public class GuideViewPagerAdapter extends PagerAdapter {
	private List<View> views;

	public GuideViewPagerAdapter(List<View> views) {
		this.views = views;
	}

	@Override
	public int getCount() {
		// TODO Auto-generated method stub
		return views.size();
	}

	@Override
	public boolean isViewFromObject(View arg0, Object arg1) {
		return (arg0 == arg1);
	}

}

几点说明一下，我们建的list是View类型的集合（其实就是往里面塞图片，这边用View最方便，其实也可以是ImageView的）。getcount返回值是集合的大小，可以通过size（）方法获得。isViewFromObject方法到底干啥的我也不太确定。但是，从参数来看，返回一个boolena的话，判断一下两个变量值相等，应该是判断View是否是根类吧！

接着，我们要往pager里加内容，肯定要有添加和移除的方法

添加的方法———往容器里添加对象item，通过指定position来找到集合里的对象。这里注意一下，这是个带返回参数的。所以我们把添加的那个item返回

@Override
	public Object instantiateItem(ViewGroup container, int position) {
		container.addView(views.get(position));
		return views.get(position);
	}

移除的方法——直接用remove方法就好，这边是void，所以不需要返回值了

@Override
	public void destroyItem(ViewGroup container, int position, Object object) {
		container.removeView(views.get(position));
	}

六、最后的重点写GuideActivity

首先，上oncreate（）里的代码

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_guide);
		init();
		initImageResource();
		initpoint();
	}

这边用到了3个不同的init方法，我一个个讲

还有，补充一下定义

private ViewPager viewPager;
	private List<View> views;
	private GuideViewPagerAdapter adapter;	
	private ImageView[] point;		//放所有的点
	private ImageView start;		//启动主页面的按钮
	private int currentIndex = 0;	//用来判断当前的点
	private int[] guidePics = { R.drawable.pokenmon01, R.drawable.pokenmon02,
			R.drawable.pokenmon03, R.drawable.pokenmon04 };

init（）方法，用来初始化组件，以及设置监听器，比较简单，不多分析了

private void init() {
		viewPager = (ViewPager) findViewById(R.id.viewPager);
		views = new ArrayList<View>();
		adapter = new GuideViewPagerAdapter(views);
		start = (ImageView) findViewById(R.id.image_Start);
		start.setOnClickListener(this);
	}

initImage（）方法，用来将每张图片稍稍处理（设置资源，拉伸）后，放入list中。配置好以后，为viewpager组件绑定监听器。名字一目了然，翻页的监听器。

private void initImageResource() {
		LinearLayout.LayoutParams params = new LayoutParams(
				LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
		for (int i = 0; i < guidePics.length; i++) {
			ImageView imageView = new ImageView(this);
			imageView.setLayoutParams(params);		//设置布局
			imageView.setImageResource(guidePics[i]);	//设置资源
			imageView.setScaleType(ScaleType.FIT_XY);	//设置拉伸变换
			views.add(imageView);
		}
		viewPager.setAdapter(adapter);
		viewPager.setOnPageChangeListener(this);
	}

接着，实现导入对应类后，重写3个方法

@Override
	public void onPageScrollStateChanged(int arg0) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageScrolled(int arg0, float arg1, int arg2) {
		// TODO Auto-generated method stub

	}

	@Override
	public void onPageSelected(int position) {

	}

这边先放着，把initPoint（）说一下。先找到我们给4个点提供的父容器LinearLayout，然后通过getChindAt（）方法，嵌一个循环来给每个点得到实例。然后为当前的点设置为不可激活

private void initpoint() {
		LinearLayout linearLayout = (LinearLayout) findViewById(R.id.linearLayout_point);
		point = new ImageView[guidePics.length];
		for (int i = 0; i < point.length; i++) {
			point[i] = (ImageView) linearLayout.getChildAt(i);
			point[i].setEnabled(true);
		}
		point[currentIndex].setEnabled(false);
	}

关于Enabled，可以设置Selector.xml。具体方法是在drawable文件夹下，新建xml文件，选择selector。

<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/point_unselected" android:state_enabled="true"/>
    <item android:drawable="@drawable/point_selected" android:state_enabled="false"/>

</selector>

通过state来给与不同的背景。当然了，还有其他几种可以判断的状态，比如state_pressed（按下）,state_focused（焦点）

当enable处于flase的时候，是没法响应点击的

还记得我们之前的3个重写的pagerchange的方法么？只要改动其中的onPageSelected就好

@Override
	public void onPageSelected(int position) {
		setCurDot(position);
		isStartShow(position);
	}

用了两个我自定义的方法，一个是用来改变点的显示的（页数不同，红点位置不同），一个是用来判断是否为最后一页（是的话显示按钮）。

private void setCurDot(int position) {
		point[position].setEnabled(false);
		point[currentIndex].setEnabled(true);
		currentIndex = position;
	}

private void isStartShow(int position) {
		if (position == (guidePics.length - 1)) {
			start.setVisibility(View.VISIBLE);
		} else {
			start.setVisibility(View.GONE);
		}
	}

最后别忘了给按钮加响应，启动主页面并finish掉

还有，在Manifest里，别忘了修改Activity主题和Intent-Filter（默认第一个启动的是WelcomeActivity）

 <activity
            android:name="WelcomeActivity"
            android:theme="@android:style/Theme.Holo.NoActionBar.Fullscreen" >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>

完整的代码——百度云链接

http://pan.baidu.com/s/1gdrhmX9

Inori酱

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
鱼鱼Chen之学写自己的apk（一） ViewPager实现第一次使用的引导

恩，这个计划拖了好久。。。。。。终于开始写了，希望能对大家有所帮助准备是一篇篇地把要用到的部分解析清楚，最后上我写好的apk（已经发布了哦）http://apk.hiapk.com/appinfo/com.dota.example.targetapplication/1一、分析一下结构布局就不说了，每个对应一个Activity。MainActivity是主页面，
复制链接

扫一扫