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.