Search code examples
androidandroid-tabhostandroid-tabs

How to set TabHost title name in two lines


I need to set the Title of the tabhost in two lines. I am getting the full text being viewable as a auto scrollable thing when i select the tab but i need it to show in two lines so that it is viewable always fully. Can anybody please help!

public class Tabs extends Activity implements OnClickListener {
TabHost th;


@Override
protected void onCreate(Bundle savedInstanceState) {
    // TODO Auto-generated method stub
    super.onCreate(savedInstanceState);
    setContentView(R.layout.tabs);
    th = (TabHost) findViewById(R.id.tabhost);



    th.setup();
    TabSpec specs = th.newTabSpec("tag1");
    specs.setContent(R.id.tab1);
    specs.setIndicator("Large Text");

//That is i need to put "Large" in one line and "Text" in next line in the title of the tabhost     

    th.addTab(specs);

    specs = th.newTabSpec("tag2");
    specs.setContent(R.id.tab2);
    specs.setIndicator("Small");
    th.addTab(specs);

    specs = th.newTabSpec("tag3");
    specs.setContent(R.id.tab3);
    specs.setIndicator("TEXT");
    th.addTab(specs);

    specs = th.newTabSpec("tag4");
    specs.setContent(R.id.tab4);
    specs.setIndicator("TXET");
    th.addTab(specs);

}

@Override
public void onClick(View v) {
    // TODO Auto-generated method stub

}

}


Solution

  • Firstly, I'll tell you that I discourage setting long texts to tab names. Tab titles are intended to give a short and easily understandable descriptions, setting your names to long texts might complicate your users.

    Said that, one approach would be defining a new layout where you would implement two separate TextViews, or just one setting its maxLines attribute to 2. This way, you could simply inflate your tab by doing something like:

    final View view = LayoutInflater.from(context).inflate(R.layout.your_new_tab_layout, null);
    TextView tv1 = view.findViewById(R.id.your_first_line_textview);
    TextView tv2 = view.findViewById(R.id.your_second_line_textview);
    tv1.setText("My first line");
    tv2.setText("My second line");
    

    Or, using the second approach:

    final View view = LayoutInflater.from(context).inflate(R.layout.your_new_tab_layout, null);
    TextView tv = view.findViewById(R.id.your_double_line_textview);
    tv.setText("First line\nSecond line);