ANDROID 开发一个新闻阅读器 2章 启动页

1．          功能描述

这一讲中我们将先实现一个开启页，通常我们在许多应用中都会看到开启页，当你点击一个应用后会先出现应用的 LOGO和一些开发团队的信息，当然同时后台可能正在运行一些启动逻辑。一个开启页面一般显示3秒左右的时间，太长会让用户产生应用是不是无法启动这样的疑惑。

例如像下面这款软件的启动页：

 

页面中介绍了应用的名字，显示了应用的图标来加深使用者的印象，下方的loading 提醒用户应用正在运行中。

现在我们就开发一个启动页，并让其顺利进入到下一个页面：

 

2．          界面布局

在layout 目录下创建 news_open.xml 用来作为页面对应的布局文件

 

 

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" //xml 描述文件的命名空间
    android:orientation="vertical" //页面走向 垂直
    android:layout_width="fill_parent" //宽 填满整个上层界面组件
    android:layout_height="fill_parent" //高 填满整个上层界面组件
    android:background="@drawable/open_bg"> //背景 显示一张图片
 </LinearLayout>   

 

首先定义一个LinearLayout, 将其背景设置为一张图片 open_bg，该图片会存放在 drawable目录下。

这里我们要再次说明下drawable目录，由于Android作为开源的系统被广大的手机商所使用，也造成了搭载硬件规格的不同，其突出的一点就是各个手机屏幕的大小和分辨率不一样，为了解决这个问题，google　把原先的drawable目录改成了支持

drawable-hdpi，drawable-ldpi，drawable-mdpi 这三种目录。 三个目录下分别对应高，中，低三种分辨率，当然这只是针对一些对图像要求特别高的应用，例如游戏。我们可以把图片都放置在 drawable-hdpi 这个目录下，当然你也可以继续沿用 drawable 目录。

 

考虑到一些开发者可能第一次接触Android，这里我们也介绍一下上面涉及到的几个属性

l  android:orientation

页面走向属性: vertical 垂直,

             horizontal 横向

l  android:layout_width

宽度设置: fill_parent 宽度填满整个上层界面组件

         wrap_content 自适应改变这个界面组件的宽度

l  android:layout_height

高度设置: fill_parent 高度填满整个上层界面组件

         wrap_content 自适应改变这个界面组件的高度

 

l  android:backaround

组件背景:@color/red 显示定义在color资源文件中的颜色作为背景

         @drawable/pic 显示定义在 drawable 目录中的图片作为背景

 

 

layout 文件创建完后，就要开始把控件一个一个塞进去了。

²  ImageView ：显示这个应用的图标

²  TextView：显示应用的名字

²  ProgressBar：loading 动画显示

²  TextView: loading提示信息

 

 

 

下面是将控件全部加进去后的 news_open.xml 文件代码：

 

 

<?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@drawable/open_bg">
      
    <RelativeLayout android:layout_width="fill_parent"
                    android:layout_height="fill_parent" > //相对位置页面布局，并且充满整个上层界面组件
    <LinearLayout android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:orientation="vertical"
                  android:paddingTop="50dip" //和上方间距50dip的距离
                  android:gravity="top|center_horizontal"> //在上层界面的布局中处在上方的位置并且横向居中
    <ImageView android:id="@+id/open_app_img" //声明一个ImageView 的控件, id为open_app_img
               android:layout_width="wrap_content" //宽 自适应
               android:layout_height="wrap_content" //高 自适应
               android:layout_gravity="center_horizontal" //位置布局 横向居中
               android:src="@drawable/open_app_img" /> //图片资源显示的内容为存放在 drawable 下的的 open_app_img
    <TextView android:layout_width="wrap_content" //声明一个TextView 的控件
              android:layout_height="wrap_content"
              android:text="@string/app_name" //该TextView显示的内容为string文件下的 app_name 字段
              android:textStyle="bold" //字体样式
              android:textSize="20dip" //字体大小
              android:textColor="@color/black" /> //字体颜色                      
    </LinearLayout>   
                        
    <LinearLayout android:layout_width="fill_parent"
                  android:layout_height="fill_parent"
                  android:paddingBottom="20dip"
                  android:gravity="bottom|center_horizontal">
    <ProgressBar android:id="@+id/openProgressBar" //进度条控件，声明ID
                 android:layout_width="28dip" //定义该进度动画的宽和高都为28dip
                 android:layout_height="28dip"
                 android:indeterminateDrawable="@drawable/progress_spin" //定义在drawable 下的文件 progress_spin.xml 里面描述了整个进度条的样式
                 android:indeterminateOnly="true"
                 android:indeterminateBehavior="repeat" //动画不断重复
                 android:indeterminateDuration="3500" /> //动画运作时间
    <TextView android:id="@+id/progressText"
              android:layout_width="wrap_content"
              android:layout_height="wrap_content"
              android:text="loading..."
              android:textStyle="bold"
              android:textColor="@color/black" />
    </LinearLayout>         
   </RelativeLayout>
 </LinearLayout>   
 

 

我们再看下progressbar的样式文件 progress_spin.xml

 

<?xml version="1.0" encoding="utf-8" ?>
//声明是个旋转的loading 样式
 <rotate xmlns:android="http://schemas.android.com/apk/res/android"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fromDegrees="0"
        android:toDegrees="360">
    <shape                  // 样式定义成不断旋转的圆形
        android:shape="ring"
        android:innerRadiusRatio="4"
        android:thicknessRatio="5.333"
        android:useLevel="false">
        <size               // 大小
            android:width="18dip"
            android:height="18dip" />
        <gradient          // 动画过程
            android:type="sweep"
            android:useLevel="false"
            android:startColor="#006688cc"
            android:centerColor="#886688cc"
            android:endColor="#ff6688cc"
            android:centerY="0.50" />
    </shape>
 </rotate>

 

这样表现层的代码基本完成了，下面就让我们看看后台的代码

 

 

3．          后台逻辑层

我们先来看 openActivity.java 文件

 

 

 

import android.app.Activity;
 import android.os.Bundle;
 
 public class openActivity extends Activity{
   
   
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_open);
    }
 
}
 

基本上没太多多余的代码，只要注意 setContentView 中set的是 news_open.xml 的 View。

 

需要注意的是，创建项目的时候 默认的入口Activity 是我们创建时定义的 mainActivity.java。

所以 AndroidManifest.xml 要修改成:

 

 

 <?xml version="1.0" encoding="utf-8"?>
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
      package="com.thinkland.demo.mnr"
      android:versionCode="1"
      android:versionName="1.0">
    <application android:icon="@drawable/icon" android:label="@string/app_name">
        <activity android:name=".openActivity" //这里改成 openActivity
                  android:label="@string/app_name">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
 <activity android:name=".mainActivity" /> //原先的 mainActivity可以另外定义成一个Activity
    </application>
    <uses-sdk android:minSdkVersion="3" />
 
 </manifest>

 

运行模拟器可以看到如下的效果：

 

这样一个开启页面已经基本完成，不过可能你会问，那如何跳转去下一个页面呢？

接下来让我们对 openActivity.java 做些许改动，使其能跳转去下一个页面。

 

openActivity.java 定义如下：

 

 

import com.thinkland.demo.mnr.common.MyNewsReaderConstant;
 
 import android.app.Activity;
 import android.content.Intent;
 import android.os.Bundle;
 import android.os.Handler;
 import android.os.Message;
 
 public class openActivity extends Activity{
   
    protected static final int thread1 = 0x2211;
   
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_open);
       
 //开启一个子线程
         Thread t1 = new Thread(new initialOpen());
        t1.start();
    }
   
    public class initialOpen implements Runnable{
 
 //运行子线程，每次都等待2秒，然后调用gotoNextActivity（）方法
        public void run() {
           try {
              Thread.sleep(2000);
           } catch (InterruptedException e) {
              // TODO Auto-generated catch block
               e.printStackTrace();
           }
           gotoNextActivity();        
          
       }
       //发送消息 thread1，通知 Handler 消息接收器 messageListener
        public void gotoNextActivity(){
          
           Message m1 = new Message();
           m1.what = thread1;
          
           messageListener.sendMessage(m1);
       }
    }
   
 //声明一个消息接受器 messageListener, 接受到消息后判断，如果是thread1的话开始新的Acticity mainActivity.
     private Handler messageListener = new Handler(){
      
       public void handleMessage(Message msg){
           switch(msg.what){
           case thread1:
              Intent aitent = new Intent(openActivity.this, mainActivity.class);
              Bundle b1 = new Bundle();
              b1.putString(MyNewsReaderConstant.OPEN_GOTO_VALUE, "This message is form openActivity");
              aitent.putExtras(b1);
             
              startActivity(aitent);
                        break;
           }
       }
    };
 
}

 

如上面代码中的注释，首先开启了一个线程，作用就是等待2秒然后发送1个消息给消息接收器，然后接受器再接受到这个消息后开启一个新的 Activity。

这里我们首先要介绍下 消息接受器 Handler 和 消息类 Message。由于Android 的子线程是不允许修改主线程的 View。这样就限制了很多的逻辑的实现，为了解决这个问题，google提供了Message 这种方式，我们可以声明一个Message 对象，然后通过Message来发送信息，在主线程中再定义一个接受器 Handler 用来接受这些消息，并判断内容，具体实现如下。

 

消息接受器:

 

private Handler messageListener = new Handler(){
      
       public void handleMessage(Message msg){
           switch(msg.what){
           case thread1:
            //一些操作
             break;
}
}
};

 

消息发送：

Message m1 = new Message();
m1.what = 标示符; //通常采用 类似int thread1 = 0x2211 保证唯一性
 messageListener.sendMessage(m1); //发送出去

 

当然，消息也可以存放一个对象并发送，具体如下：

Message m2 = messageListener.obtainMessage(0, 存放的对象);
m2.what =标示符;
messageListener.sendMessage(m2);

 

而接受的时候则可以通过如下方法获取该对象

private Handler messageListener = new Handler(){
      
       public void handleMessage(Message msg){
实例化该对象 = (声明对象) msg.obj; //例如传了个List 那就是 List alist = (List)msg.obj
            switch(msg.what){
           case thread1:
            //一些操作
             break;
}
}
};

 

 

而开启一个新的Activity则执行如下的逻辑:

 

Intent aitent = new Intent(openActivity.this, mainActivity.class);
Bundle b1 = new Bundle();
b1.putString(MyNewsReaderConstant.OPEN_GOTO_VALUE, "This message is form openActivity");
aitent.putExtras(b1);
startActivity(aitent);

 

我们首先声明一个 Intent 对象

同时也声明了一个Bundle 对象，并且往中的KEY MyNewsReaderConstant.OPEN_GOTO_VALUE 中放入了值 “This message is form openActivity”， 而这就是 2个Activity 之间传递值的方式。最后将该Bundle对象put进Intent， 调用方法 startActivity(Intent对象).

需要说明的是，MyNewsReaderConstant 这个类是笔者用来专门存放一些常量的的，这样做会比较方便后期的维护。这个class放在 COMMON\这个目录下，其内容如下：

public class MyNewsReaderConstant {
      
    public static String OPEN_GOTO_VALUE = "openGotoValue";
 
}

然后我们再在 mainActivity.java 做些改动，具体如下：

import com.thinkland.demo.mnr.common.MyNewsReaderConstant;
 
 import android.app.Activity;
 import android.content.Intent;
 import android.os.Bundle;
 import android.widget.Toast;
 
 public class mainActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
       
        Intent mainIntent = getIntent(); //获取Intent 对象
         Bundle mainBundle = mainIntent.getExtras(); //获取Intent中的Bundle
         if(mainBundle != null){
         String testStr = mainBundle.getString(MyNewsReaderConstant.OPEN_GOTO_VALUE);
 //如果该Bundle不为空，查看MyNewsReaderConstant.OPEN_GOTO_VALUE里是否有值，如果有，通过Toast 的方式显示出来
         Toast.makeText(this, testStr, Toast.LENGTH_SHORT).show();
        }
    }
}
 

Toast 类似与一个弹出的提示消息，其具体写法

Toast.makeText(Context 对象, 显示的内容, 显示时间长短).show();

显示时间长短: Toast.LENGTH_SHORT 或者 Toast.LENGTH_LONG

 

 

好了现在再让我们运行一下程序

界面1：                                

    

 

界面2:   

 

 

可以看到 界面2上出现里一个小框，这个就是Toast框，而里面的值就是我们在2个Activity 之前传递的。

不过现在我们又发现了一个新的问题，但我点击模拟器上的BACK键，画面会到了启动页，然后就一直在启动页了，所以我们还在在启动页的逻辑里加上一小段代码来避免这种情况，具体如下：

在openActivity.java 最后重写onPause方法

@Override
    public void onPause() {
       super.onPause();
       this.finish();
    }

每次当一个新的Activity开启的时候就将开启页的 Activity 关掉，也就是调用 finish()方法。这时候页面就不会回到开启页面，而是直接回到了手机home页。

 

 

现在一个完整的开启页就完成了。

程序包地址：http://u.115.com/file/f5a50dbe54#MyNewsReader_L5.zip