一步一步写News App(一)

一、 新建一个安卓工程,安卓版本全部选2.3.3

二、第一步,添加一个tabhost控件

      在MainActivity中声明TabHost tabHost; 然后新建一个private void initViews()函数,在函数中新建tabHost = getTabHost();提示出错,没有getTabHost()方法,将MainActivity extends Activity 修改成MainActivity extends TabActivity 就可以了。

      然后在initViews()中添加每个标签页的内容。代码如下:

private void initViews(){

        tabHost = getTabHost();

        tabHost.addTab(tabHost.newTabSpec("news").setIndicator("News").setContent(new Intent(this, TabNewsActivity.class)));

        tabHost.addTab(tabHost.newTabSpec("mood").setIndicator("Mood").setContent(new Intent(this, TabMoodActivity.class)));

        tabHost.addTab(tabHost.newTabSpec("user").setIndicator("User").setContent(new Intent(this, TabUserActivity.class)));

        tabHost.addTab(tabHost.newTabSpec("find").setIndicator("Find").setContent(new Intent(this, TabFindActivity.class)));

        tabHost.addTab(tabHost.newTabSpec("setting").setIndicator("Setting").setContent(new Intent(this, TabSettingActivity.class)));

    }

    Intent用来实现Activity之间的跳转,new Intent(this, XXActivity.class)表示从当前(this)Activity跳转到XXActivity.class。

    这样写完会提示后面5个参数页面不存在,然后就开始先把这5个Activity的框架写好,分别新建5个类,名称跟上面设计的一样。如图:

 

 一步一步写News App(一)

每个Activity文件先弄个最简单的,继承自Activity类,像这样:

package com.yhy.news;



import android.app.Activity;

import android.os.Bundle;



public class TabFindActivity extends Activity{



    @Override

    protected void onCreate(Bundle savedInstanceState) {

        // TODO Auto-generated method stub

        super.onCreate(savedInstanceState);

        setContentView(R.layout.find);

    }

}

注意就是一要extends Activity, 二要重写onCreate函数,三要在onCreate函数里加上setContentView(R.layout.find)。其他的分别setContentView如下:

R.layout.mood, R.layout.setting, R.layout.user, R.layout.news。当然这些layout文件都需要我们自己新建,内容可以就放一下LinearLayout,以后再扩展,

新建好后的layout如下图:

一步一步写News App(一)

MainActivity的布局文件activity_main.xml文件中填入以下内容:

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

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="fill_parent"

    android:layout_height="fill_parent"

    android:orientation="vertical">



    <TabHost

        android:id="@android:id/tabhost"

        android:layout_width="fill_parent"

        android:layout_height="fill_parent" >

        <LinearLayout

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

            android:orientation="vertical" >

            

            <FrameLayout

                android:id="@android:id/tabcontent"

                android:layout_width="fill_parent"

                android:layout_height="0.0dip"

                android:layout_weight="1.0" >

            </FrameLayout>

        

            <TabWidget

                android:id="@android:id/tabs"

                android:layout_width="fill_parent"

                android:layout_height="wrap_content"

                android:visibility="gone" />

            

                <RelativeLayout

                    android:id="@+id/layout_bottom"

                    android:layout_width="fill_parent"

                    android:layout_height="wrap_content" >

    

                    <RadioGroup

                        android:id="@+id/radiogroup"

                        android:layout_width="fill_parent"

                        android:layout_height="wrap_content"

                        android:layout_gravity="bottom"

                        android:background="@drawable/bottombg"

                        android:gravity="center_vertical"

                        android:orientation="horizontal" >

    

                        <RadioButton

                            android:id="@+id/radio_news"

                            android:layout_height="wrap_content"

                            android:layout_width="wrap_content"

                            android:background="@drawable/tab_selector_news"

                            android:button="@null"

                            android:layout_weight="1"

                            android:checked="true" />

    

                        <RadioButton

                            android:id="@+id/radio_mood"

                            android:layout_width="wrap_content"

                            android:layout_height="wrap_content"

                            android:background="@drawable/tab_selector_mood"

                            android:layout_weight="1"

                            android:button="@null" />

    

                        <RadioButton

                            android:id="@+id/radio_user"

                            android:layout_width="wrap_content"

                            android:layout_height="wrap_content"

                            android:background="@drawable/tab_selector_user"

                            android:layout_weight="1"

                            android:button="@null" />

    

                        <RadioButton

                            android:id="@+id/radio_find"

                            android:layout_width="wrap_content"

                            android:layout_height="wrap_content"

                            android:background="@drawable/tab_selector_find"

                            android:layout_weight="1"

                            android:button="@null" />

    

                        <RadioButton

                            android:id="@+id/radio_setting"

                            android:layout_width="wrap_content"

                            android:layout_height="wrap_content"

                            android:background="@drawable/tab_selector_setting"

                            android:layout_weight="1"

                            android:button="@null" />

                </RadioGroup>

            </RelativeLayout>

        </LinearLayout>

    </TabHost>



</RelativeLayout>

该布局文件是一个标准的tabhost的布局文件,tabwidget标签中定义下方的几个选项卡,用5个radiobutton定义,每个按钮的背景设置为不同的xml文件,每个xml文件里定义着选中和未选中时的图片文件, 如 tab_selector_setting.xml:

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

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



    <item android:drawable="@drawable/current_setting_tab" android:state_checked="true"/>

    <item android:drawable="@drawable/back_setting_tab" android:state_checked="false"/>



</selector>

其中, current_setting_tab图片如下:

back_setting_tab图片如下:

其他图片资源:

都是png格式的。这样就可以在选中和未选中时显示不同的样子。

资源文件结构如下:

一步一步写News App(一)

(drawable文件夹是自己新建的)。

    准备好以上内容后,运行程序,会报错,看logcat中会有错误提示,说manifest中没有注册Activity。

    于是在AndroidManifest.xml文件中将上面添加的5个Activity注册一下,在与MainActivity平行的地方添加如下内容:

<activity

            android:name="com.yhy.news.TabNewsActivity"

            android:screenOrientation="portrait"

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

        </activity>

        

        <activity

            android:name="com.yhy.news.TabFindActivity"

            android:screenOrientation="portrait"

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

        </activity>

        

        <activity

            android:name="com.yhy.news.TabMoodActivity"

            android:screenOrientation="portrait"

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

        </activity>

        

        <activity

            android:name="com.yhy.news.TabSettingActivity"

            android:screenOrientation="portrait"

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

        </activity>

        

        <activity

            android:name="com.yhy.news.TabUserActivity"

            android:screenOrientation="portrait"

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

        </activity>

    其中,name里面的是Activity完整包路径名。

    经过上面的准备后终于可以运行起来了!效果如图:

一步一步写News App(一)

 

你可能感兴趣的:(APP)