Android: как создавать вкладки, подобные тем, которые отображаются на странице пользовательского интерфейса Android - PullRequest
6 голосов
/ 03 апреля 2012

Итак, android делает все возможное, чтобы создать это прекрасное руководство по интерфейсу для всех пользователей. Но я не вижу нигде, где он показывает примеры кода, как создавать эти элементы.

Руководство по пользовательскому интерфейсу для вкладок можно найти здесь. http://developer.android.com/design/building-blocks/tabs.html.

Кто-нибудь знает, как создавать вкладки, как эта? enter image description here

Любая помощь будет оценена, спасибо.

РАЗМЕЩЕННОЕ РЕШЕНИЕ
Итак, вот что я в итоге сделал после того, как, вероятно, потратил около 10 часов, пытаясь сделать несколько красивых вкладок.
enter image description here

Сначала я отказался от идеи использования вкладок в Android. По одной причине виджет хоста вкладок считается устаревшим для панели действий, но панель действий работает только с Android 3 на.

Я наконец-то понял, что если я использовал линейный макет и в качестве фона для линейного макета я поместил изображение, которое я хотел использовать (используя изображение с 9 патчами). Затем создайте еще один линейный макет и текстовое представление, чтобы поместить текст поверх этого линейного макета. Затем сделайте линейный макет кликабельным. Затем, когда вы станете более продвинутым, вы можете сделать фон линейного макета селектором XML, и вы готовы к работе. Если вы не получили всего этого, вот мой код.

LinearLayout

    <LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:background="@color/main_screen_bg_color"
    android:orientation="horizontal"
    android:padding="2dp" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/selector_not_current"
        android:clickable="true"
        android:onClick="onClickSub"
        android:orientation="horizontal" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:text="Example 1"
                android:textColor="@color/black"
                android:textSize="18sp"
                android:textStyle="bold" />
        </LinearLayout>
    </LinearLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:background="@drawable/selector_current"
        android:clickable="true"
        android:onClick="onClickFoodDetails"
        android:orientation="horizontal" >

        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1"
            android:gravity="center"
            android:orientation="vertical" >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:text="Example 2"
                android:textColor="@color/black"
                android:textSize="18sp"
                android:textStyle="bold" />
        </LinearLayout>
    </LinearLayout>
</LinearLayout>

Пример выбора

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
      android:drawable="@drawable/selected_pressed_tab" /> <!-- pressed -->
<item android:state_focused="true"
      android:drawable="@drawable/selected_pressed_tab" /> <!-- focused -->
<item android:drawable="@drawable/selected_tab" /> <!-- default -->

Надеюсь, это поможет всем. Вкладки для Android были слишком трудными и раздражающими, чтобы работать с ними было проще, чем просто создавать свои собственные с нуля. Удачи!

Ответы [ 2 ]

5 голосов
/ 03 апреля 2012

сделай что-нибудь подобное.

это полный рабочий код. наслаждаться

где-то в существующем методе расширения деятельности Табака

  tabHost = getTabHost();
  Intent intent;
  intent = new Intent().setClass(this, FirstActvity.class);
  setupTab("NearBy", intent, R.drawable.firsttabdrawable);
  intent = new Intent().setClass(this, SecondActivity.class);
  setupTab("History", intent, R.drawable.secondtabdrawable);
  intent = new Intent().setClass(this, ThirdActivity.class);
  setupTab("Setting", intent, R.drawable.thirdtabdrawable);

определить методы setupTab как

  private void setupTab(String tag, Intent intent, int selectorId) {
  View tabView = LayoutInflater.from(tabHost.getContext()).inflate(R.layout.view, null);
  tabView.setBackgroundResource(selectorId);
  TabSpec setContent = tabHost.newTabSpec(tag).setIndicator(tabView).setContent(intent);
  tabHost.addTab(setContent);
  }

view.xml as

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="fill_parent"
>
</LinearLayout>

и firsttabdrawable.xml в папке drawable как

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
   <!-- When selected, use grey -->
   <item android:drawable="@drawable/selectedfirsttabimage"
      android:state_selected="true" />
   <!-- When not selected, use white-->
   <item android:drawable="@drawable/notselectedfirsttabimage" />
</selector>

одинаково определите secondtabdrawable.xml и thirddrawable.xml

2 голосов
/ 03 апреля 2012

Вкладки, которые вам нужны, являются частью ActionBar.В частности, они отображаются, когда панель действий находится в режиме вкладки навигации.

http://developer.android.com/guide/topics/ui/actionbar.html (см. Раздел «Добавление вкладок навигации»)

Возможно, вы захотите использовать www.ActionbarSherlock.comэто библиотека, которая предоставит вам ActionBar практически на всех версиях Android.Он работает так же, как и официальный, и включает вкладки.

Больше не используйте TabActivity, он устарел и устарел.ActionBar - это будущее.

...