安卓开发 底部tab的实现

发布于 2019-12-25 15:27:19

1.MainActivity代码:

(也就是TabsFrame)

package com.example.frametabhost;

import com.example.function.WebGo;
import com.example.licaizhuanjia.MainActivity;
import com.example.licaizhuanjia.R;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentTabHost;
import android.view.KeyEvent;
import android.view.Menu;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost.TabSpec;
import android.widget.TextView;

public class TabsFrame extends FragmentActivity {

 private FragmentTabHost fragmentTabHost;
 private String texts[] = { "开始", "好友", "群组", "更多" };
 private int p_w_picpathButton[] = { R.drawable.selector1,
         R.drawable.selector2,
         R.drawable.selector3,
         R.drawable.selector4};
 private Class fragmentArray[] = {Page1.class,
         Page2.class,
         Page3.class,
         Page4.class};  

 protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.tabsframe);

        // 实例化tabhost
        fragmentTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
        fragmentTabHost.setup(this, getSupportFragmentManager(),R.id.maincontent);

         for (int i = 0; i < texts.length; i++) {
            TabSpec spec=fragmentTabHost.newTabSpec(texts[i]).setIndicator(getView(i));
            fragmentTabHost.addTab(spec, fragmentArray[i], null);
             
            //设置背景(必须在addTab之后,由于需要子节点(底部菜单按钮)否则会出现空指针异常)
            fragmentTabHost.getTabWidget().getChildAt(i).setBackgroundResource(R.drawable.bgselector);
        //背景替换

}

  }
private View getView(int i) {
     //取得布局实例
     View view=View.inflate(TabsFrame.this, R.layout.tabcontent, null);
     
     //取得布局对象
     ImageView p_w_picpathView=(ImageView) view.findViewById(R.id.p_w_picpath);
     TextView textView=(TextView) view.findViewById(R.id.text);
     
     //设置图标
     p_w_picpathView.setImageResource(p_w_picpathButton[i]);
     //设置标题
     textView.setText(texts[i]);
     return view;
}
public boolean onKeyDown(int KeyCode,KeyEvent Event){

        if(KeyCode==KeyEvent.KEYCODE_BACK){
           Intent intent=new Intent(TabsFrame.this,MainActivity.class);
       startActivity(intent);
       finish();
        }
    return true;
}

}

  1. 然后是4个Page,代码都一样

public class Page1 extends Fragment{

     @Override
     public View onCreateView(LayoutInflater inflater,ViewGroup container,Bundle savedInstanceState) {
         return inflater.inflate(R.layout.page1, null);
     }

}

主要代码就是这些

然后是xml布局文件

3.在tabsframe里

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

  <!-- 存放主要页面内容 -->

  <FrameLayout
     android:id="@+id/maincontent"
     android:layout_width="fill_parent"
     android:layout_height="0dp"
     android:layout_weight="1" >
</FrameLayout>
 
 <!-- 底层菜单 -->

 <android.support.v4.app.FragmentTabHost
     android:id="@android:id/tabhost"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:background="@drawable/tab_bg" >

     <FrameLayout
        android:id="@android:id/tabcontent"
         android:layout_width="0dp"
         android:layout_height="0dp"
         android:layout_weight="0" >
     </FrameLayout>
</android.support.v4.app.FragmentTabHost>

</LinearLayout>

4.tabcontent.xml里是底部标签栏的图标

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

  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:gravity="center_horizontal"
  android:orientation="vertical" >

  <ImageView
      android:id="@+id/p_w_picpath"
     android:layout_height="wrap_content"
     android:layout_width="wrap_content"
     />
 <TextView
     android:id="@+id/text"
     android:padding="2dp"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content"
     android:textColor="@android:color/white"
     />

</LinearLayout>

5.在selector1,2,3,4里(写在drawable文件夹里)

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"; >

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

</selector>

6.在bgselector.xml里

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"; >

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

</selector>

7.4个page的xml(4个都一样的代码)。

<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:background="@drawable/tabframe1"
  <TextView
      android:id="@+id/text"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_alignParentBottom="true"
      android:layout_centerHorizontal="true"
      android:layout_marginBottom="22dp"
      android:text="正在开发中。。。。。"
      android:textSize="20dp" />

</RelativeLayout>

代码截图:

1.png

需要源码就给我留言。

0 条评论

发布
问题

官网
微信

官方微信