Android开发之TabHost选项卡及相关疑难解决方法

本文实例分析了Android开发之TabHost选项卡及相关疑难解决方法。分享给大家供大家参考,具体如下:

前言:

虽然现在谷歌已经不推荐使用TabHost,但是初学者还是很有必要接触下这一成金的经典的,本文将介绍纤细介绍这一空间的使用,以及大家可能遇到的问题。注:文末给出完整实现代码

三个问题:

1. 无法显示TabHost

2. 添加图片 + 文字 无法同时

3. 说在最后:点击事件

4. 底部导航无法实现

现在

从问题出发:

问题一:无法显示 TabHost

很多人调用TabHost的方法是:

setContentView(R.layout.activity_main);
tabHost = getTabHost();

然后发现啥也没有,一脸蒙圈。。。 在这里建议大家采用遮掩的调用方法:

LayoutInflater.from(this).inflate(R.layout.activity_main,
    tabHost.getTabContentView(), true);

成功后的页面:

Android开发之TabHost选项卡及相关疑难解决方法_第1张图片

注:UI 略丑请忽视

问题二:图片、文字无法同时添加

好了,很多人辛辛苦苦把界面搞出来了,可能想搞个底部菜单 加个图片,结果凉凉 半天搞不出来 ,这里介绍一个方法 ,由于TabHost本身图片、文字冲突 ,无法添加,这是我们就得把目光迁移到自定义view上:本段参考自:https://www.jb51.net/article/157914.htm

首先在/layout下建立自定义view名为:tab_indicator.xml文件



  
  


接着,紧随其后在/drawable下添加:tab_info.xml文件:



  
  


这些都搞定之后,就可以在活动中调用了:

首先在活动中先建立AddTab()方法:

private void AddTab(String label, int drawableId) {
  Intent intent = new Intent(this, TextActivity.class);
  TabHost.TabSpec spec = tabHost.newTabSpec(label);
  View tabIndicator = LayoutInflater.from(this).inflate(R.layout.tab_indicator, getTabWidget(), false);
  TextView title = (TextView) tabIndicator.findViewById(R.id.title);
  title.setText(label);
  ImageView icon = (ImageView) tabIndicator.findViewById(R.id.icon);
  icon.setImageResource(drawableId);
  spec.setIndicator(tabIndicator);
  spec.setContent(intent);
  tabHost.addTab(spec);
}

终于我们。。。:

Android开发之TabHost选项卡及相关疑难解决方法_第2张图片

成功了!!!

问题三:添加监听事件

这个无脑 只要 id 匹配就行了,直接上代码:

tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener(){
  @Override
  // tabId是newTabSpec参数设置的tab页名,并不是layout里面的标识符id
  public void onTabChanged(String tabId) {
    if (tabId.equals("tab1")) {  //第一个标签
      Toast.makeText(MainActivity.this, "点击标签页一", Toast.LENGTH_SHORT).show();
    }else if (tabId.equals("tab2")) {  //第二个标签
      Toast.makeText(MainActivity.this, "点击标签页二", Toast.LENGTH_SHORT).show();
    }else if (tabId.equals("tab3")) {  //第三个标签
      Toast.makeText(MainActivity.this, "点击标签页三", Toast.LENGTH_SHORT).show();
    }
  }
});

暂时能记起来的 疑难就这些了 如果还有请给我留言 我尽力解答。。

附上布局与实现:

布局:



  
    
      
        
        
          
          
        
        
        
          
          
        
        
        
          
          
        
      
    
  


实现:

public class MainActivity extends TabActivity {
  TabHost tabHost;
  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
//    setContentView(R.layout.activity_main);
    tabHost = getTabHost();
    LayoutInflater.from(this).inflate(R.layout.activity_main,
        tabHost.getTabContentView(), true);
    AddTab("tab1", R.drawable.tab_info);
    AddTab("tab2", R.drawable.tab_info);
    AddTab("tab3", R.drawable.tab_info);
//
    //标签切换事件处理,setOnTabChangedListener
    tabHost.setOnTabChangedListener(new TabHost.OnTabChangeListener(){
      @Override
      // tabId是newTabSpec参数设置的tab页名,并不是layout里面的标识符id
      public void onTabChanged(String tabId) {
        if (tabId.equals("tab1")) {  //第一个标签
          Toast.makeText(MainActivity.this, "点击标签页一", Toast.LENGTH_SHORT).show();
        }else if (tabId.equals("tab2")) {  //第二个标签
          Toast.makeText(MainActivity.this, "点击标签页二", Toast.LENGTH_SHORT).show();
        }else if (tabId.equals("tab3")) {  //第三个标签
          Toast.makeText(MainActivity.this, "点击标签页三", Toast.LENGTH_SHORT).show();
        }
      }
    });
  }
  private void AddTab(String label, int drawableId) {
    Intent intent = new Intent(this, TextActivity.class);
    TabHost.TabSpec spec = tabHost.newTabSpec(label);
    View tabIndicator = LayoutInflater.from(this).inflate(R.layout.tab_indicator, getTabWidget(), false);
    TextView title = (TextView) tabIndicator.findViewById(R.id.title);
    title.setText(label);
    ImageView icon = (ImageView) tabIndicator.findViewById(R.id.icon);
    icon.setImageResource(drawableId);
    spec.setIndicator(tabIndicator);
    spec.setContent(intent);
    tabHost.addTab(spec);
  }
}

ps:新建的layout和/drawable里的xml文件在问题给过,这里就不反复给了。

问题四:底部导航效果无法实现

底部导航的参见方法是把TabWidget放在FrameLayout后面,但是啧啧。。。


  
    
      
        中间内容前面给出 这里省略
      
    
    
    
  


你会发现并没有什么 卵用 !!!呕!!,so:

百度了半天找不到问题所在,然后。。。修改下MainActivity

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  //原来
//    tabHost = getTabHost();
//    LayoutInflater.from(this).inflate(R.layout.activity_main,
//        tabHost.getTabContentView(), true);
  //修改后
  setContentView(R.layout.activity_main);
  tabHost = getTabHost();
  tabHost.setup(this.getLocalActivityManager());
  AddTab("tab1", R.drawable.tab_info);
  AddTab("tab2", R.drawable.tab_info);
  AddTab("tab3", R.drawable.tab_info);
  //标签切换事件处理,setOnTabChangedListener
  iniClick();
}

注:此处我已经将点击事件封装到方法中

最后:全剧终

哦,还没有且等我放下最后的图。。

Android开发之TabHost选项卡及相关疑难解决方法_第3张图片

啧啧,搞定

更多关于Android相关内容感兴趣的读者可查看本站专题:《Android开发入门与进阶教程》、《Android调试技巧与常见问题解决方法汇总》、《Android基本组件用法总结》、《Android视图View技巧总结》、《Android布局layout技巧总结》及《Android控件用法总结》

希望本文所述对大家Android程序设计有所帮助。

你可能感兴趣的:(Android开发之TabHost选项卡及相关疑难解决方法)