Android: BOTTOM'daki Sekmeler


148

Bu konuda biraz konuştum, ama kesin bir şey yok. Sekmeleri bir TabWidget'a ekranın altına koymanın bir yolu var mı? Öyleyse nasıl?

Aşağıdaki denedim, ama işe yaramadı:

a) tabwidget'ini çerçeve düzeninin altına
ayarlamak b) tabwidget'ın yerçekimini "alt" olarak ayarlamak

Teşekkürler! llappall


10
Lütfen "işe yaramadı" olarak tanımlayın.
CommonsWare

Aşağıdaki siteden bir tane kullanıyorum. çalışıyor http://kpbird.blogspot.com/2011/05/androidbottom-tabbar-control.html
Juliousraj

3
İPhone'un sekme ana makineleri gibi olmasını istiyorsanız buraya bakın .
Adil Soomro

Yanıtlar:


272

İşte ekranın alt kısmındaki sekmeleri almak için en basit, en sağlam ve ölçeklenebilir çözüm.

  1. Dikey LinearLayout'unuzda FrameLayout'u TabWidget'ın üzerine yerleştirin
  2. Set layout_heightiçin wrap_contentFrameLayout ve TabWidget hem
  3. FrameLayout öğelerini ayarla android:layout_weight="1"
  4. TabWidget öğelerini ayarlayın android:layout_weight="0"(0 varsayılan, ancak vurgulama, okunabilirlik vb. İçin)
  5. TabWidget's'i ayarla android:layout_marginBottom="-4dp"(alt ayırıcıyı kaldırmak için)

Tam kod:

<?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
Bölücü aslında sabit kodlanmış. Sekmeler için kullanılan çekmeceleri değiştirmeye çalışıyordum ve buldum. Toplam serseri.
Jeremy Logan

6
Bunu (veya bir şeyi) kabul edilen cevap olarak seçmelisiniz.
JediPotPie

4
Burada Google'ın standart TabWidget örneğinden gereken tek sapma FrameLayout'ta ayar layout_weight=1yapmaktır. Bu, sekme denetiminin yüksekliğini önce LinearLayout'tan "talep etmesine" olanak tanır.
Nick Farina

19
TabWidget'ın altındaki ayırıcıdan kurtulmak için TabWidget'a eklemeniz android:layout_marginBottom="-5px"yeterlidir. Bu, TabWidget'ı ekranın altından 5 piksel taşıyacak, bu da bölücüyü görmemeniz için yeterli. FrameLayout boyutu telafi edecek ve böylece mükemmel bir şekilde çalışacaktır. Bölücünün boyutunun daha büyük cihazlarda değişip değişmediğinden emin değilim. Bunun dpyerine kullanmak zorunda kalabilirsiniz px.
Jake Wilson

1
Kaldır-bölücü yorumunu yanıta ekledim.
Arne Evertsson

38

Deneyin;) Sadece FrameLayout (@ id / tabcontent) içeriğini izleyin, çünkü kaydırma durumunda nasıl işleyeceğini bilmiyorum ... Benim durumumda çalışır çünkü ListView sekmelerimin içeriği olarak kullandım . :) Umarım yardımcı olur.

<?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 Ama ekranın üstündeki siyah / gri çubuğu fark ettiniz mi? Nasıl kaldırdın?
ahmet emrah

Sekme widget'ı formun sol tarafına göndermek için bunu kullanıyorum.
mr.j05hua

12

Çizgiyi kaldırmanın bir yolu var.

1) Bu öğreticiyi izleyin: android-sekmeleri-parçalarla

2) Daha sonra Leaudro'nun yukarıda önerdiği RelativeLayout değişikliğini uygulayın (tüm sahne düzenlerini sahne çerçevelerine uygulayın).

Ayrıca # 1 öğesinde tab.xml dosyasına bir ImageView ekleyebilir ve sekmelere çok benzer bir iPhone görünümü elde edebilirsiniz.

İşte şu anda üzerinde çalıştığım şeyin ekran görüntüsü. Hala yapmam gereken işler var, çoğunlukla ikonlar için bir seçici yapıyorum ve eşit yatay dağılım sağlıyorum, ama fikri anlıyorsunuz. Benim durumumda, parçaları kullanıyorum, ancak aynı prensipler standart sekme görünümü için geçerli olmalıdır.

resim açıklamasını buraya girin


Bunu yayınlamanızdan bu yana bir süre geçti, ancak bağlantınız şimdi nginx'e hoş geldiniz diyor ! ve sayfada başka hiçbir şey yok.
DroidDev

1
Sitem değildi, sop ne yazık ki üzerinde kontrolüm yok. Ancak bu süre geçtikten sonra, sistemler muhtemelen Android kullanıcılarınız için bu tür bir arabirimi uygulamamalısınız, şeylerin biraz farklı çalışmasını beklerler.
Brill Pappin

3

Android'in tüm sürümleri için çalışıp çalışmayacağından emin değilim (özellikle özel UI içerikli olanlar), ancak ekleyerek alt kısımdaki gri çubuğu kaldırabildim

 android:layout_marginBottom="-3dp"

TabWidget XML dosyasına ...


3

TabWidget'ın ayırma çizgisini kaldırmaya çalışan herkes için, burada sekmeleri özelleştirmek ve böylece sekmeler en altta olduğunda sorunları kaldırmak için harika çalışan bir örnek proje (ve ilgili öğreticisi). Tutulma Projesi: android-custom-tabs ; Orijinal açıklama: blog ; Umarım bu yardımcı olmuştur.



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

Bu tam olarak aradığınız şey olmayabilir (Sekmelerinizi ekranın altına göndermek için "kolay" bir çözüm değildir), ancak yine de size işaretlemek istediğim ilginç bir alternatif çözümdür:

ScrollableTabHost TabHost gibi davranmaya tasarlanmıştır ancak ek bir Scrollview ile daha fazla öğe sığdırmak için ...

belki de bu açık kaynaklı projeyi araştırırken sorunuzun yanıtını bulacaksınız. Daha kolay bir şey görürsem sana geri döneceğim.


1

Onları ekranın altına yerleştirmeye çalışırken android sekmeleri ile aynı sorunu yaşıyordum. Benim senaryom bir düzen dosyası kullanmak ve kod sekmeleri oluşturmak için, ben de diğer yaklaşımları kullanarak biraz çok karmaşık görünüyordu her sekme faaliyetleri ateş etmek arıyordum, İşte sorunun üstesinden gelmek için örnek kod:

ilave-sekme-in-robot-ve-yerleştirme-onları


1

Evet, bkz: bağlantı , ancak yeni sekme oluşturmak için etkinlikler değil, xml düzenleri kullandı, bu yüzden xml kodunu koy (FrameLayout için set paddingTop - 0px) ve kodu yazın:

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);      


}

}


Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.