Android: вкладки в BOTTOM


148

Я бачив якусь балаканину з цього приводу, але нічого певного. Чи є спосіб розмістити вкладки в TabWidget в нижній частині екрана? Якщо так, то як?

Я спробував таке, але не вийшло:

a) встановлення віджету табла під рамкою кадрування
b) встановлення сили тяжіння табвіджета на "знизу"

Дякую! llappall


10
Будь ласка, визначте "не працювало".
— CommonsWare

Я використовую один із наведеного нижче сайту. це працює http://kpbird.blogspot.com/2011/05/androidbottom-tabbar-control.html
— Juliousraj

3
Подивіться тут, якщо хочете iPhone, як хости вкладок.
— Аділ Соомро

Відповіді:


272

Ось найпростіше, надійне і масштабоване рішення, щоб отримати вкладки в нижній частині екрана.

  1. У вертикальному LinearLayout поставте FrameLayout над TabWidget
  2. Встановіть layout_heightі wrap_contentна FrameLayout, і на TabWidget
  3. Встановіть FrameLayout's android:layout_weight="1"
  4. Встановити TabWidget's android:layout_weight="0"(0 за замовчуванням, але для наголосу, читабельності тощо)
  5. Встановіть TabWidget's android:layout_marginBottom="-4dp"(для видалення нижнього дільника)

Повний код:

<?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="5dp">

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:padding="5dp"
            android:layout_weight="1"/>

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:layout_marginBottom="-4dp"/>

    </LinearLayout>

</TabHost>

3
Дільник насправді важко закодований. Я намагався змінити чернетки, використані для вкладок, і знайшов його. Загальний об’єм.
— Джеремі Логан

6
Ви повинні вибрати це (або щось таке) як прийняту відповідь.
— JediPotPie

4
Єдине необхідне тут відхилення від стандартного прикладу TabWidget від Google - це налаштування layout_weight=1на FrameLayout. Це дозволяє керувати вкладками спочатку "вимагати" його висоту поза LinearLayout.
— Нік Фаріна

19
Щоб позбутися від дільника внизу TabWidget, просто додайте android:layout_marginBottom="-5px"його до TabWidget. Це перемістить TabWidget в нижній частині екрана на 5 пікселів, достатньо, щоб ви не бачили дільника. FrameLayout компенсує розмір, тому він відмінно працює. Я не впевнений, чи змінюється розмір дільника на більших пристроях чи ні. Можливо, вам доведеться використовувати dpзамість цього px.
— Джейк Вілсон

1
Я включив коментар видалити-роздільник у відповідь.
— Арне Евертссон

38

Спробуйте;) Просто дивіться вміст FrameLayout (@ id / tabcontent), тому що я не знаю, як він буде працювати в разі прокрутки ... У моєму випадку він працює, тому що я використовував ListView як вміст моїх вкладок . :) Сподіваюся, це допомагає.

<?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">
    <RelativeLayout 
        android:layout_width="fill_parent" 
        android:layout_height="fill_parent">
        <FrameLayout android:id="@android:id/tabcontent"
             android:layout_width="fill_parent" 
             android:layout_height="fill_parent"
             android:layout_alignParentTop="true" 
             android:layout_above="@android:id/tabs" />
    <TabWidget android:id="@android:id/tabs"
             android:layout_width="fill_parent" 
             android:layout_height="wrap_content"
             android:layout_alignParentBottom="true" />
    </RelativeLayout>
</TabHost>

4
+1 Але ви помітили чорну / сіру смугу вгорі екрана? Як ви її видалили?
— ahmet emrah

Я використовую це для розміщення віджета на вкладці в лівій частині форми.
— mr.j05hua

12

Існує спосіб видалити рядок.

1) Дотримуйтесь цього підручника: андроїд-вкладки з фрагментами

2) Потім застосуйте зміну RelativeLayout, яку запропонував Леодро вище (застосуйте реквізит макета до всіх FrameLayouts).

Ви також можете додати ImageView до tab.xml у пункті №1 та отримати на iPhone вкладки, схожі на iPhone.

Ось скріншот того, над чим я працюю зараз. Мені ще належить виконати певну роботу, в основному зробити перемикач для піктограм та забезпечити рівний горизонтальний розподіл, але ви зрозумієте, що це ідея. У моєму випадку я використовую фрагменти, але ті ж принципи повинні застосовуватися до стандартного подання вкладок.

введіть тут опис зображення


Минув час, коли ви опублікували це, але ваше посилання тепер говорить про те, що ласкаво просимо до nginx! і більше нічого немає на сторінці.
— DroidDev

1
Це був не мій сайт, так, на жаль, я не маю на ньому контроль. Після цього часу системи змінилися настільки, що ви, ймовірно, не повинні реалізовувати такий інтерфейс для своїх користувачів Android, вони очікують, що зараз буде працювати трохи інакше.
— Брілл Паппін

3

Не впевнений, чи буде це працювати для всіх версій Android (особливо тих, які мають користувальницькі користувальницькі інтерфейси), але мені вдалося видалити сіру смугу внизу, додавши

 android:layout_marginBottom="-3dp"

до XML TabWidget ...


3

Для всіх із вас, хто намагається видалити роздільну лінію в tabWidget, ось приклад проекту (та його відповідного підручника), який чудово підходить для налаштування вкладок і тим самим усунення проблем, коли вкладки знаходяться внизу. Eclipse Project: android-custom-tabs ; Оригінальне пояснення: блог ; Сподіваюся, що це допомогло.



3
<?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:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1" />

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0"
            android:background="#252a31"
            android:tabStripEnabled="false" >
        </TabWidget>
    </LinearLayout>

</TabHost>

1

Це може бути не саме те, що ви шукаєте (це не просте рішення для надсилання ваших вкладок в нижній частині екрана), але все-таки цікаве альтернативне рішення, яке я хотів би позначити вам:

ScrollableTabHost розроблений так, щоб він поводився як TabHost, але з додатковим переглядом прокрутки, щоб підходити до більшої кількості елементів ...

можливо, поглибившись у цей проект з відкритим кодом, ви знайдете відповідь на своє запитання. Якщо я побачу щось легше, я повернусь до вас.


1

У мене були ті ж проблеми з андроїдними вкладками, коли я намагався розмістити їх у нижній частині екрана. Мій сценарій полягав у тому, щоб не використовувати файл макета та створювати вкладки в коді, я також шукав запускати дії з кожної вкладки, що здавалося трохи надто складним, використовуючи інші підходи, ось ось зразок коду для подолання проблеми:

додавання-вкладки-в-android-і-розміщення-них


1

Так, дивіться: посилання , але він використовував макети xml, а не діяльність для створення нової вкладки, тому поставте свій xml-код (встановіть paddingTop для FrameLayout - 0px), а потім напишіть код:

public class SomeActivity extends ActivityGroup {

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

    TabHost tab_host = (TabHost) findViewById(R.id.edit_item_tab_host); 

    tab_host.setup(this.getLocalActivityManager());

    TabSpec ts1 = tab_host.newTabSpec("TAB_DATE"); 
    ts1.setIndicator("tab1"); 
    ts1.setContent(new Intent(this, Registration.class)); 
    tab_host.addTab(ts1); 

    TabSpec ts2 = tab_host.newTabSpec("TAB_GEO"); 
    ts2.setIndicator("tab2"); 
    ts2.setContent(new Intent(this, Login.class)); 
    tab_host.addTab(ts2); 

    TabSpec ts3 = tab_host.newTabSpec("TAB_TEXT"); 
    ts3.setIndicator("tab3"); 
    ts3.setContent(new Intent(this, Registration.class)); 
    tab_host.addTab(ts3); 

    tab_host.setCurrentTab(0);      


}

}


0

Я рекомендую використовувати цей код для стабільної роботи, він оптимізований для вкладених фрагментів у вкладці (наприклад, вкладений MapFragment) і перевірений на "не тримати діяльність": https://stackoverflow.com/a/23150258/2765497

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.