diff options
Diffstat (limited to 'docs/html/guide/tutorials/views/hello-tabwidget.jd')
| -rw-r--r-- | docs/html/guide/tutorials/views/hello-tabwidget.jd | 124 |
1 files changed, 0 insertions, 124 deletions
diff --git a/docs/html/guide/tutorials/views/hello-tabwidget.jd b/docs/html/guide/tutorials/views/hello-tabwidget.jd deleted file mode 100644 index 98dddf5..0000000 --- a/docs/html/guide/tutorials/views/hello-tabwidget.jd +++ /dev/null @@ -1,124 +0,0 @@ -page.title=Hello, TabWidget -parent.title=Hello, Views -parent.link=index.html -@jd:body - -<p>A {@link android.widget.TabWidget} offers the ability to easily draw an interface that uses -tabs to navigate between different views.</p> - -<ol> - <li>Start a new project/Activity called HelloTabWidget.</li> - <li>Open the layout file and make it like so:</li> - <pre> -<?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"> - <TabWidget - android:id="@android:id/tabs" - android:layout_width="fill_parent" - android:layout_height="wrap_content" /> - <FrameLayout - android:id="@android:id/tabcontent" - android:layout_width="fill_parent" - android:layout_height="fill_parent"> - <TextView - android:id="@+id/textview1" - android:layout_width="fill_parent" - android:layout_height="fill_parent" - android:text="this is a tab" /> - <TextView - android:id="@+id/textview2" - android:layout_width="fill_parent" - android:layout_height="fill_parent" - android:text="this is another tab" /> - <TextView - android:id="@+id/textview3" - android:layout_width="fill_parent" - android:layout_height="fill_parent" - android:text="this is a third tab" /> - </FrameLayout> - </LinearLayout> -</TabHost> -</pre> - <p>Here, we've created a {@link android.widget.TabHost} that contains the entire layout of the Activity. - A TabHost requires two descendant elements: a {@link android.widget.TabWidget} and a {@link android.widget.FrameLayout}. - In order to properly layout these elements, we've put them inside a vertical {@link android.widget.LinearLayout}. - The FrameLayout is where we keep the content that will change with each tab. Each child in the FrameLayout will - be associated with a different tab. - In this case, each tab simply shows a different {@link android.widget.TextView} with some text. </p> - <p>Notice that the TabWidget and the FrameLayout elements have specific <code>android</code> namespace IDs. These are necessary - so that the TabHost can automatically retrieve references to them, populate the TabWidget with the tabs that we'll define - in our code, and swap the views in the FrameLayout. We've also defined our own IDs for each TextView, which we'll use to - associate each tab with the view that it should reveal.</p> - <p>Of course, you can - make these child views as large as complex as you'd like — instead of the TextView elements, - you could start with other layout views and build a unique layout hierarchy for each tab.</p> - </li> - <li>Now we'll add our code. Open HelloTabWidget.java and make it a <code>TabActivity</code>. - <p>By default, Eclipse creates a class that extends <code>Activity</code>. Change it to - extend <code>TabActivity</code>:</p> - <pre> -public class HelloTabWidget extends TabActivity { -</pre> - </li> - <li>Now fill in the the <code>onCreate</code> method like this: - <pre> -public void onCreate(Bundle savedInstanceState) { - super.onCreate(savedInstanceState); - setContentView(R.layout.main); - - mTabHost = getTabHost(); - - mTabHost.addTab(mTabHost.newTabSpec("tab_test1").setIndicator("TAB 1").setContent(R.id.textview1)); - mTabHost.addTab(mTabHost.newTabSpec("tab_test2").setIndicator("TAB 2").setContent(R.id.textview2)); - mTabHost.addTab(mTabHost.newTabSpec("tab_test3").setIndicator("TAB 3").setContent(R.id.textview3)); - - mTabHost.setCurrentTab(0); -} -</pre> - <p>As usual, we start by setting our layout.</p> - <p>We then call the TabActivity method <code>getTabHost()</code>, - which returns us a reference to the TabHost we created in our layout. Upon our TabHost, we call <code>addTab()</code> - for each of the tabs that we want to add to the TabWidget. Each time we call this, we pass a - {@link android.widget.TabHost.TabSpec} that we build on the fly, and with it, chain together two necessary methods: - <code>setIndicator()</code> to set the text for the tab button, and <code>setContent()</code> to define - which View we want to associate with the tab and reveal when pressed. Our indicator is just a text string and - our content is an ID reference to the TextView elements we inserted in the FrameLayout.</p> - <p>At the end, we call <code>setCurrentTab()</code> to define which tab should be opened by default. The tabs - are saved like a zero-based array, so to open the first tab, we pass zero (<var>0</var>).</p> - </li> - <li>To clean-up the presentation a bit more, let's remove the window title that appears at the top of the layout. - Android includes a theme that removes that title for us. To add it, open the Android Manifest file and add - the <var>NoTitleBar</var> theme to the <code><application></code> tag. It should end up like this: - <pre> -<application android:icon="@drawable/icon" android:theme="@android:style/Theme.NoTitleBar"> -</pre> - </li> - <li>That's it. Run your application.</li> - -</ol> - - -<p>Your application should look like this:</p> -<img src="images/hello-tabwidget.png" width="150px" /> - -<div class="special"><p>You can include icons in your tabs by passing a -{@link android.graphics.drawable.Drawable} when you call <code>setIndicator()</code>. Here's an example -that uses a Drawable created from an image in the project resources:</p> -<pre>setIndicator("TAB 1", getResources().getDrawable(R.drawable.tab_icon))</pre> -</div> - -<h3>References</h3> -<ul> -<li>{@link android.widget.TabWidget}</li> -<li>{@link android.widget.TabHost}</li> -<li>{@link android.widget.TabHost.TabSpec}</li> -<li>{@link android.widget.FrameLayout}</li> -</ul> - |