在Titanium开发Android应用时实现底部tabbar

在Android应用中,默认是把Tabbar放在顶部的,但是我们经常看到有些应用模范iPhone应用将Tabbar实现到底部去,那么在Titanium中我们是否也能实现将Tabbar放到底部呢?答案当然是能。在Titanium中TabGroup就是Android的Tabbar。

首先我们先创建一个Titanium项目,默认就是一个带了TabGroup的demo项目了。接下来要实现以上效果,其实也很简单,只需在你的项目根目录里添加一个android的xml布局文件就可以了,但是这个xml文件必须命名为:

titanium_tabgroup.xml

Java代码 复制代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>   
  2. <TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:id="@android:id/tabhost"  
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent">   
  6.     
  7.     <LinearLayout   
  8.         android:orientation="vertical"  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="fill_parent"  
  11.         android:padding="0dp">   
  12.     
  13.         <FrameLayout   
  14.             android:id="@android:id/tabcontent"  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="wrap_content"  
  17.             android:padding="0dp"  
  18.             android:layout_weight="1"/>   
  19.     
  20.         <TabWidget   
  21.             android:id="@android:id/tabs"  
  22.             android:layout_width="fill_parent"  
  23.             android:layout_height="wrap_content"  
  24.             android:layout_weight="0"/>   
  25.     
  26.     </LinearLayout>   
  27.     
  28. </TabHost>  
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
 
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="0dp">
 
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="0dp"
            android:layout_weight="1"/>
 
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"/>
 
    </LinearLayout>
 
</TabHost>

接下来就是要在你的项目根目录下创建以下路径和目录:
/platform/android/res/layout/


创建完的项目结构如下:
在Titanium开发Android应用时实现底部tabbar_第1张图片

然后再重新clean后再次运行,效果如下:
在Titanium开发Android应用时实现底部tabbar_第2张图片

其实这中间的道理很简单,就是用我们的布局文件覆盖了Titanium既存的布局文件,让应用使用我们的布局文件来运行代码。

关于这里为什么一定要命名为titanium_tabgroup.xml,可以参看源代码的
TiTabActivity.java74行-77行


Java代码 复制代码  收藏代码
  1. int layoutResId = getResources().getIdentifier("titanium_tabgroup""layout", getPackageName());   
  2. if (layoutResId == 0) {   
  3.     throw new IllegalStateException("titanium_tabgroup layout resource not found.  TabGroup cannot be created.");   
  4. }  
int layoutResId = getResources().getIdentifier("titanium_tabgroup", "layout", getPackageName());
if (layoutResId == 0) {
	throw new IllegalStateException("titanium_tabgroup layout resource not found.  TabGroup cannot be created.");
}


补充:

可以延伸一下,有很多朋友在做应用的时候不想显示Tabbar,将titanium_tabgroup.xml变通一下就可以实现。将 TabWidget设置为android:layout_height="0dp"。


Xml代码 复制代码  收藏代码
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:id="@android:id/tabhost"  
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent">  
  6.     
  7.     <LinearLayout  
  8.         android:orientation="vertical"  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="fill_parent"  
  11.         android:padding="0dp">  
  12.     
  13.         <FrameLayout  
  14.             android:id="@android:id/tabcontent"  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="wrap_content"  
  17.             android:padding="0dp"  
  18.             android:layout_weight="1"/>  
  19.     
  20.         <TabWidget  
  21.             android:id="@android:id/tabs"  
  22.             android:layout_width="fill_parent"  
  23.             android:layout_height="0dp"  
  24.             android:layout_weight="0"/>  
  25.     
  26.     </LinearLayout>  
  27.     
  28. </TabHost>  
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
 
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="0dp">
 
        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="0dp"
            android:layout_weight="1"/>
 
        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_weight="0"/>
 
    </LinearLayout>
 
</TabHost>


再重新clean后再次运行,效果如下:
在Titanium开发Android应用时实现底部tabbar_第3张图片
  • 在Titanium开发Android应用时实现底部tabbar_第4张图片
  • 大小: 13.2 KB
  • 在Titanium开发Android应用时实现底部tabbar_第5张图片
  • 大小: 61.2 KB
  • 在Titanium开发Android应用时实现底部tabbar_第6张图片
  • 大小: 57.8 KB

你可能感兴趣的:(Titanium)