Android ActionBar通过Tab进行不同的Fragment之间的交换

 ActionBar的使用常见于4.0系统,其Tab的使用挺广泛的。

       在ActionBar中添加标签(Tabs),每个标签对应的是一个Fragment,点击不同的Tab时,就会切换到对应的Fragment。

   大致的步骤如下:

1、如同TabHost控件,每个tab下需要添加内容,这个内容需要结合fragment来显示,因此需创建fragment类,有几个tab就需要几个继承Fragment的类;

2、将fragment添加至ActionBar Tab上,并添加tab监听;

3、监听内部类需要实现ActionBar.Listener接口,当点击Tab的时候触发其事件,需要重写的方法有:

(1)onTabSelected();

(2)onTabReselected();

(3)onTabUnselected();

接下来我们就一起看一个简单的例子吧:

(1)Fragment1.java类

 

package com.example.l0909_3_actionbartab; 
import android.app.Fragment; 
import android.os.Bundle; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
public class MyFragment1 extends Fragment{ 
    @Override
    //Fragment要通过重写onCreateView方法加载视图 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
            Bundle savedInstanceState) { 
        return inflater.inflate(R.layout.fragment1, container,false); 
    } 
}

 

(2)对应的fragment1.xml文件

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" > 
    <ImageView 
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/b24" /> 
</LinearLayout>

(3)MyFragment2.java类

package com.example.l0909_3_actionbartab; 
import android.app.Fragment; 
import android.os.Bundle; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 
public class MyFragment2 extends Fragment{ 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
            Bundle savedInstanceState) { 
        return inflater.inflate(R.layout.fragment2, container,false); 
    } 
}

(4)对应的fragment2.xml文件

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" > 
    <ImageView 
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/b25" /> 
</LinearLayout>

(3)MainActivity.java文件

package com.example.l0909_3_actionbartab; 
import android.app.ActionBar; 
import android.app.ActionBar.Tab; 
import android.app.ActionBar.TabListener; 
import android.app.Activity; 
import android.app.Fragment; 
import android.app.FragmentTransaction; 
import android.os.Bundle; 
public class MainActivity extends Activity { 
    //声明ActionBar 
private ActionBar bar; 
    @Override 
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.activity_main); 
        //创建对应的Fragment对象 
        Fragment fragment1=new MyFragment1(); 
        Fragment fragment2=new MyFragment2(); 
        //创建ActionBar,方法得到Activity中的ActionBar 
        bar=getActionBar(); 
        //创建TableHost的效果(有三个属性值) 
        bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
        //创建对应的Tab及对其的设置 
        Tab tab1=bar.newTab().setText("朋友").setIcon(R.drawable.p1).setTabListener(new TestListener(fragment1)); 
        Tab tab2=bar.newTab().setText("亲人").setIcon(R.drawable.p2).setTabListener(new TestListener(fragment2)); 
        //tab1.setText("朋友"); 
        //tab1.setIcon(R.drawable.ic_launcher); 
        //tab1.setTabListener(arg0); 
        //添加Tab到ActionBar中 
        bar.addTab(tab1); 
        bar.addTab(tab2); 
    } 
    //通过内部类的方式创建Tab的监听类,实现ActionBar.TabListener的接口 
    class TestListener implements TabListener{ 
        //声明Fragment 
        private Fragment fragment; 
        //通过构造引用对应的Fragment 
        public TestListener(Fragment fragment){ 
            this.fragment=fragment; 
        } 
        //实现ActionBar.TabListener接口所要实现的方法 
        @Override 
        public void onTabReselected(Tab tab, FragmentTransaction ft) { 
        } 
        @Override 
        public void onTabSelected(Tab tab, FragmentTransaction ft) { 
            ft.add(R.id.mainActivity, fragment, null); 
        } 
        @Override 
        public void onTabUnselected(Tab tab, FragmentTransaction ft) { 
        } 
    } 
}

注:在onTabUnselected()方法中添加ft.remove(fragment);

(6)运行效果图:

咳咳。。。其实ActionBar还不仅仅是这些用处,我们接下来在接触一些ActionBar的用法,来完善一下上面的例子,使它具有4.0的风格。

1.第一点要补充的是:ActionBar图标的点击事件

   bar.setDisplayHomeAsUpEnabled(true);这样就使得ActionBar的图标可点击了,进而可以通过 onOptionsItemSelected()监听方法来处理点击事件的内容,下面的例子中我们实现的是点击ActionBar的图标返回到主界面。

2.第二点要补充的是:

   onTouchEvent()这个点击事件,我们可以在这里实现点击屏幕——全屏显示,再点击屏幕——退出全屏的效果。

3.第三点要补充的是:

   onCreateOptionsMenu()重写的方法中实现添加ActionBar的子菜单项的功能,并且添加的子选项会根据屏幕的大小决定显示几个,一般显示两个,其他的将隐式与Menu中,手动点击Menu才会出现。

 好吧,我们可以看这个完整的例子了:

(1)主入口Activity

package com.example.l0909_3_actionbartab; 
import android.app.ActionBar; 
import android.app.Activity; 
import android.content.Intent; 
import android.os.Bundle; 
import android.view.Menu; 
import android.view.MenuItem; 
import android.view.View; 
import android.view.View.OnClickListener; 
import android.widget.Toast; 
public class ActOpen extends Activity{ 
    private ActionBar bar; 
    @Override
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.act_open); 
        bar=getActionBar(); 
        findViewById(R.id.btn_open).setOnClickListener(new OnClickListener() { 
                                                                                    
            @Override
            public void onClick(View arg0) { 
                Intent intent=new Intent(ActOpen.this,MainActivity.class); 
                startActivity(intent); 
                finish(); 
            } 
        }); 
                                                                                
    } 
    @Override
    public boolean onCreateOptionsMenu(Menu menu) { 
        // Inflate the menu; this adds items to the action bar if it is present. 
        MenuItem open=menu.add(0,1,0,"打开"); 
        MenuItem add=menu.add(0,2,0,"添加"); 
        //只能添加两项,其余的在Menu中隐藏存在,而若是横屏则会显示更多 
        MenuItem delete=menu.add(0,3,0,"删除"); 
        MenuItem close=menu.add(0,4,0,"关闭"); 
        //设置ActionBar每个Item的显示方式(如果有地方则显示) 
        open.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        add.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        delete.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        close.setShowAsAction(MenuItem.SHOW_AS_ACTION_IF_ROOM); 
        getMenuInflater().inflate(R.menu.main, menu); 
        return true; 
    } 
    @Override
    public boolean onOptionsItemSelected(MenuItem item) { 
        switch (item.getItemId()) { 
        case 1: 
            Toast.makeText(this, "open", Toast.LENGTH_SHORT).show(); 
            break; 
        case 2: 
            Toast.makeText(this, "add", Toast.LENGTH_SHORT).show(); 
            break; 
        case 3: 
            Toast.makeText(this, "delete", Toast.LENGTH_SHORT).show(); 
            break; 
        case 4: 
            Toast.makeText(this, "close", Toast.LENGTH_SHORT).show(); 
            break; 
        } 
        return super.onOptionsItemSelected(item); 
    } 
}

(2)内容Activity中:

package com.example.l0909_3_actionbartab; 
import android.app.ActionBar; 
import android.app.ActionBar.Tab; 
import android.app.ActionBar.TabListener; 
import android.app.Activity; 
import android.app.Fragment; 
import android.app.FragmentTransaction; 
import android.content.Intent; 
import android.os.Bundle; 
import android.view.MenuItem; 
import android.view.MotionEvent; 
public class MainActivity extends Activity { 
    //声明ActionBar 
private ActionBar bar; 
    @Override
    protected void onCreate(Bundle savedInstanceState) { 
        super.onCreate(savedInstanceState); 
        setContentView(R.layout.activity_main); 
        //创建对应的Fragment对象 
        Fragment fragment1=new MyFragment1(); 
        Fragment fragment2=new MyFragment2(); 
        //创建ActionBar,方法得到Activity中的ActionBar 
        bar=getActionBar(); 
        //创建TableHost的效果(有三个属性值) 
        bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); 
        //设置ActionBar的图标是可点击的 
        bar.setDisplayHomeAsUpEnabled(true); 
        //创建对应的Tab及对其的设置 
        Tab tab1=bar.newTab().setText("朋友").setIcon(R.drawable.p1).setTabListener(new TestListener(fragment1)); 
        Tab tab2=bar.newTab().setText("亲人").setIcon(R.drawable.p2).setTabListener(new TestListener(fragment2)); 
        //tab1.setText("朋友"); 
        //tab1.setIcon(R.drawable.ic_launcher); 
        //tab1.setTabListener(arg0); 
        //添加Tab到ActionBar中 
        bar.addTab(tab1); 
        bar.addTab(tab2); 
    } 
    /** 
     * 这个监听是给ActionBar的可点图标用的,即点击ActionBar的可点图标时要做的事 
     */
    @Override
        public boolean onOptionsItemSelected(MenuItem item) { 
        switch (item.getItemId()) { 
        case android.R.id.home: 
            Intent intent=new Intent(MainActivity.this,ActOpen.class); 
            startActivity(intent); 
            finish(); 
            break; 
        } 
            return super.onOptionsItemSelected(item); 
        } 
    /** 
     * 点击屏幕使得显示的内容在全屏与退出全屏之间切换 
     */
    @Override
        public boolean onTouchEvent(MotionEvent event) { 
        switch (event.getAction()) { 
        case MotionEvent.ACTION_UP: 
            if(bar.isShowing()){ 
                bar.hide(); 
            }else{ 
                bar.show(); 
            } 
            break; 
        } 
            return super.onTouchEvent(event); 
        } 
    //通过内部类的方式创建Tab的监听类,实现ActionBar.TabListener的接口 
    class TestListener implements TabListener{ 
        //声明Fragment 
        private Fragment fragment; 
        //通过构造引用对应的Fragment 
        public TestListener(Fragment fragment){ 
            this.fragment=fragment; 
        } 
        //实现ActionBar.TabListener接口所要实现的方法 
        @Override
        public void onTabReselected(Tab tab, FragmentTransaction ft) { 
        } 
        @Override
        public void onTabSelected(Tab tab, FragmentTransaction ft) { 
            ft.add(R.id.mainActivity, fragment, null); 
        } 
        @Override
        public void onTabUnselected(Tab tab, FragmentTransaction ft) { 
            ft.remove(fragment); 
        } 
    } 
}

(3)两个继承Fragment的类同上;

(4)运行效果如下:

   初始界面:

 点击ActionBar中的一个Item的效果:

   点击Menu菜单显示出其他的ActionBar的Item:

点击“点击进入”时跳入的内容界面:可以看到ActionBar中的图标已经是可点的了,

此时点击它会跳回主界面:

随意点击屏幕的一个位置——全屏显示,再次点击屏幕——退出全屏显示:

 

posted @ 2015-02-05 17:50  星辰之力  阅读(468)  评论(0编辑  收藏  举报