Android软件怎么加一个引导界面

Android软件怎么加一个引导界面,第1张

首先,打开eclipse,建立一个空的项目。

我们需要的资源:

1. 找几张图片(以4张为例,这个可以自己决定),分别命名:guide_page1.png、guide_page2.png、guide_page3.png、guide_page4.png。

2. 再找一个button的按钮,类似百度地图上的最后一个“进入地图”按钮。命名为:start_btn.png。

3. 两种dot:     。分别命名:guide_dot_focus.png、guide_dot_normal.png。

将以上资源放到res/drawable-hdpi文件夹下(以上资源均在下方源码下载中):

在res/drawable文件夹下添加文件guide_dot_style.xml,用于创建导航小点的样式。

guide_dot_style.xml

[cpp] view plaincopy

<?xml version="1.0" encoding="utf-8"?>

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

<item android:drawable="@drawable/guide_dot_focus" android:state_selected="true"/>

<item android:drawable="@drawable/guide_dot_normal"/>

</selector>

在res/layout文件夹下建立一个guide_view.xml,创建我们的页面来显示导航图片。

guide_view.xml

[java] view plaincopy

<?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:layout_width="match_parent"

android:layout_height="match_parent"

android:id="@+id/guide_view_pager">

</android.support.v4.view.ViewPager>

<LinearLayout

android:layout_alignParentBottom="true"

android:layout_marginBottom="10dip"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_centerHorizontal="true"

android:orientation="horizontal"

android:id="@+id/guide_dots">

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:clickable="true"

android:padding="15dip"

android:src="@drawable/guide_dot_style"/>

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:clickable="true"

android:padding="15dip"

android:src="@drawable/guide_dot_style"/>

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:clickable="true"

android:padding="15dip"

android:src="@drawable/guide_dot_style"/>

<ImageView

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_gravity="center_vertical"

android:clickable="true"

android:padding="15dip"

android:src="@drawable/guide_dot_style"/>

</LinearLayout>

</RelativeLayout>

LinearLayout布局是为了放置4个导航小点。

我们还需要单独为最后一张图片做一个布局,因为这里面有一个button,我们需要给这个button添加点击事件,所以得单独为它写个布局。在res/layout中添加guide_content_view.xml。

guide_content_view.xml

[java] view plaincopy

<?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" >

<ImageView

android:layout_width="match_parent"

android:layout_height="match_parent"

android:scaleType="fitXY"

android:src="@drawable/guide_page4"/>

<Button

android:layout_alignParentBottom="true"

android:layout_marginBottom="35dip"

android:layout_centerHorizontal="true"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:background="@drawable/start_btn"

android:id="@+id/start_btn"/>

</RelativeLayout>

布局文件完成了,我们来看我们的java代码。

我们需要一个页面适配器来显示我们的viewpager中的图片,在src目录中添加一个ViewPagerAdapter.java文件。

ViewPagerAdapter.java

[java] view plaincopy

package cn.staray.guidetest

import android.support.v4.view.PagerAdapter

import android.support.v4.view.ViewPager

import android.view.View

import java.util.ArrayList

/**

* @Filename ViewPagerAdapter.java

* @Package cn.staray.guidetest

* @Project Guidetest

* @Create 2014-6-12 下午2:57:31

* @author Staray

* @Description 界面适配器

*/

public class ViewPagerAdapter extends PagerAdapter {

private final ArrayList<View> mViews

public ViewPagerAdapter(ArrayList<View> views) {

mViews = views

}

// 返回页面数目

@Override

public int getCount() {

if (mViews != null) {

return mViews.size()

}

return 0

}

@Override

public int getItemPosition(Object object) {

return super.getItemPosition(object)

}

// 初始化position位置的页面

@Override

public Object instantiateItem(View view, int position) {

((ViewPager)view).addView(mViews.get(position), 0)

return mViews.get(position)

}

// 判断是否由对象生成界面

@Override

public boolean isViewFromObject(View arg0, Object arg1) {

return (arg0 == arg1)

}

// 销毁position位置的界面

@Override

public void destroyItem(View view, int position, Object arg2) {

((ViewPager)view).removeView(mViews.get(position))

}

}

接着我们完成我们的主文件,在src目录中添加一个GuideActivity.java文件。

GuideActivity.java

[java] view plaincopy

package cn.staray.guidetest

import android.app.Activity

import android.content.Intent

import android.os.Bundle

import android.support.v4.view.ViewPager

import android.support.v4.view.ViewPager.OnPageChangeListener

import android.view.LayoutInflater

import android.view.View

import android.view.View.OnClickListener

import android.widget.Button

import android.widget.ImageView

import android.widget.LinearLayout

import java.util.ArrayList

/**

* @Filename GuideActivity.java

* @Package cn.staray.guidetest

* @Project Guidetest

* @Create 2014-6-12 下午2:44:23

* @author Staray

* @Description 引导界面

*/

public class GuideActivity extends Activity {

// 显示导航页面的viewpager

private ViewPager guideViewPager

// 页面适配器

private ViewPagerAdapter guideViewAdapter

// 页面图片列表

private ArrayList<View> mViews

// 图片资源,这里我们放入了3张图片,因为第四张图片,我们已经在guide_content_view.xml中加载好了

// 一会直接添加这个文件就可以了。

private final int images[] = {

R.drawable.guide_page1, R.drawable.guide_page2, R.drawable.guide_page3

}

// 底部导航的小点

private ImageView[] guideDots

// 记录当前选中的图片

private int currentIndex

// 还记得我们的开始按钮吗?

private Button startBtn

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState)

setContentView(R.layout.guide_view)

initView()

initDot()

// 添加页面更换监听事件,来更新导航小点的状态。

guideViewPager.setOnPageChangeListener(new OnPageChangeListener() {

@Override

public void onPageSelected(int arg0) {

setCurrentDot(arg0)

}

@Override

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

}

@Override

public void onPageScrollStateChanged(int arg0) {

}

})

// 开始按钮的点击事件监听

startBtn.setOnClickListener(new OnClickListener() {

@Override

public void onClick(View v) {

// 我们随便跳转一个页面

Intent intent = new Intent(GuideActivity.this, MainActivity.class)

startActivity(intent)

GuideActivity.this.finish()

}

})

}

// 初始化页面

private void initView() {

guideViewPager = (ViewPager)findViewById(R.id.guide_view_pager)

mViews = new ArrayList<View>()

for (int i = 0 i < images.length i++) {

// 新建一个ImageView容器来放置我们的图片。

ImageView iv = new ImageView(GuideActivity.this)

iv.setBackgroundResource(images[i])

// 将容器添加到图片列表中

mViews.add(iv)

}

// 上面添加了三张图片了,还有一张放在guide_content_view.xml中,我们把这个页面也添加进来。

View view = LayoutInflater.from(GuideActivity.this).inflate(R.layout.guide_content_view,

null)

mViews.add(view)

// 现在为我们的开始按钮找到对应的控件

startBtn = (Button)view.findViewById(R.id.start_btn)

// 现在用到我们的页面适配器了

guideViewAdapter = new ViewPagerAdapter(mViews)

guideViewPager.setAdapter(guideViewAdapter)

}

// 初始化导航小点

private void initDot() {

// 找到放置小点的布局

LinearLayout layout = (LinearLayout)findViewById(R.id.guide_dots)

// 初始化小点数组

guideDots = new ImageView[mViews.size()]

// 循环取得小点图片,让每个小点都处于正常状态

for (int i = 0 i < mViews.size() i++) {

guideDots[i] = (ImageView)layout.getChildAt(i)

guideDots[i].setSelected(false)

}

// 初始化第一个小点为选中状态

currentIndex = 0

guideDots[currentIndex].setSelected(true)

}

// 页面更换时,更新小点状态

private void setCurrentDot(int position) {

if (position < 0 || position > mViews.size() - 1 || currentIndex == position) {

return

}

guideDots[position].setSelected(true)

guideDots[currentIndex].setSelected(false)

currentIndex = position

}

}

最终文件结构:

运行,就能出现开始的效果了。

安卓开发软件欢迎界面的代码如下:

1、制作一张启动图片splash.png,放置在res->drawable-hdpi文件夹中。

2、新建布局文件splash.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:background="@drawable/splash" >

<TextView

android:id="@+id/versionNumber"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_alignParentBottom="true"

android:layout_alignParentRight="true"

android:layout_marginBottom="26dp"

android:layout_marginRight="52dp"

android:text="version 1.0"

android:textColor="" />

</RelativeLayout>

这里我们把上一步制作的图片作为启动界面的背景图,然后在界面底部显示当前程序的版本号。

3、新建SplashActivity,在Oncreate中添加以下代码:

PackageManager pm = getPackageManager()

try {

PackageInfo pi = pm.getPackageInfo("com.lyt.android", 0)

TextView versionNumber = (TextView) findViewById(R.id.versionNumber)

versionNumber.setText("Version " + pi.versionName)

} catch (NameNotFoundException e) {

e.printStackTrace()

}

new Handler().postDelayed(new Runnable(){

@Override

public void run() {

Intent intent = new Intent(SplashActivity.this,SplashScreenActivity.class)

startActivity(intent)

SplashActivity.this.finish()

}

}, 2500)

4、 修改Manifest文件,将启动界面Activity改为默认启动,并且设置标题栏不可见。

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

package="com.example.sinaweibo"

android:versionCode="1"

android:versionName="1.0" >

<uses-sdk

android:minSdkVersion="8"

android:targetSdkVersion="15" />

<application

android:icon="@drawable/ic_launcher"

android:label="@string/app_name"

android:theme="@android:style/Theme.NoTitleBar">

<activity

android:name=".MainActivity"

android:label="@string/title_activity_main" >

<intent-filter>

<action android:name="android.intent.action.MAIN" />

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

</intent-filter>

</activity>

<activity

android:name=".MainActivity1"

android:label="@string/title_activity_main_activity1" >

<intent-filter>

<action android:name="android.intent.action.MAIN" />

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

</intent-filter>

</activity>

</application>

</manifest>

这样打开应用后等待2.5秒就进入第二个activity MainActivity了。


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/bake/11538277.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-16
下一篇 2023-05-16

发表评论

登录后才能评论

评论列表(0条)

保存