|
Tabs can be a difficult component when you first start building Android applications. To do something as simple as change the height of the tabs you need to build a view and pass it to setIndicator in the TabSpec. It might sound confusing but hopefully this code sample helps. It uses custom tab backgrounds, tab height, and programmatic tab creation.
Image Files:
Custom Tab Images
MyActivity.java
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.view.View;
import android.widget.FrameLayout;
import android.widget.LinearLayout;
import android.widget.TabHost;
import android.widget.TabWidget;
import android.widget.TextView;
import android.widget.LinearLayout.LayoutParams;
import android.widget.TabHost.TabContentFactory;
import android.widget.TabHost.TabSpec;
//Custom Tabs
public class MyActivity extends Activity {
int tabHeight = 40;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
LinearLayout main = new LinearLayout(this);
main.setOrientation(LinearLayout.VERTICAL);
setContentView(main);
TabHost tabs = new TabHost(this);
tabs.setId(android.R.id.tabhost);
main.addView(tabs);
TabWidget tabWidget = new TabWidget(this);
tabWidget.setId(android.R.id.tabs);
tabs.addView(tabWidget);
FrameLayout tabContent = new FrameLayout(this);
tabContent.setId(android.R.id.tabcontent);
tabContent.setPadding(0, tabHeight, 0, 0);
tabs.addView(tabContent);
TextView content = new TextView(this);
content.setText("This is the Frame Content");
content.setId(100);
tabs.setup();
TabSpec tspec1 = tabs.newTabSpec("Tab1");
tspec1.setIndicator(makeTabIndicator("One"));
tspec1.setContent(new PreExistingViewFactory(content));
tabs.addTab(tspec1);
TabSpec tspec2 = tabs.newTabSpec("Tab2");
tspec2.setIndicator(makeTabIndicator("Two"));
tspec2.setContent(new PreExistingViewFactory(content));
tabs.addTab(tspec2);
TabSpec tspec3 = tabs.newTabSpec("Tab3");
tspec3.setIndicator(makeTabIndicator("Three"));
tspec3.setContent(new PreExistingViewFactory(content));
tabs.addTab(tspec3);
}
private TextView makeTabIndicator(String text){
TextView tabView = new TextView(this);
LayoutParams lp3 = new LayoutParams(LayoutParams.WRAP_CONTENT, tabHeight, 1);
lp3.setMargins(1, 0, 1, 0);
tabView.setLayoutParams(lp3);
tabView.setText(text);
tabView.setTextColor(Color.WHITE);
tabView.setGravity(Gravity.CENTER_HORIZONTAL|Gravity.CENTER_VERTICAL);
tabView.setBackgroundDrawable( getResources().getDrawable(R.drawable.tab_indicator));
tabView.setPadding(13, 0, 13, 0);
return tabView;
}
class PreExistingViewFactory implements TabContentFactory{
private final View preExisting;
protected PreExistingViewFactory(View view){
preExisting = view;
}
public View createTabContent(String tag) {
return preExisting;
}
}
}
res/drawable/tab_indicator.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- Non focused states -->
<item android:state_focused="false"
android:state_selected="false"
android:state_pressed="false"
android:drawable="@drawable/tab_deselect" />
<item android:state_focused="false"
android:state_selected="true"
android:state_pressed="false"
android:drawable="@drawable/tab_select" />
<!-- Focused states -->
<item android:state_focused="true"
android:state_selected="false"
android:state_pressed="false"
android:drawable="@drawable/tab_deselect" />
<item android:state_focused="true"
android:state_selected="true"
android:state_pressed="false"
android:drawable="@drawable/tab_select" />
<!-- Pressed -->
<item android:state_pressed="true"
android:drawable="@drawable/tab_focus" />
</selector>
|