TabLayout：如何添加滑動和onClick切換標籤

我的標籤佈局工作正常，標籤正在左右切換並正確顯示內容。TabLayout：如何添加滑動和onClick切換標籤

但是當在標籤上點擊「」時，不會發生任何操作。

問題：如何才能切換標籤與onClick？我試圖在每個標籤上添加一個onClickListener，但它不起作用。

這裏是我的XML代碼：

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 
    android:id="@+id/main_layout" 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context=".MainActivity"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_alignParentTop="true" 
     android:background="?attr/colorPrimary" 
     android:elevation="6dp" 
     android:minHeight="?attr/actionBarSize" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" 
     app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/> 

    <android.support.design.widget.TabLayout 
     android:id="@+id/tab_layout" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/toolbar" 
     android:background="?attr/colorPrimary" 
     android:elevation="6dp" 
     android:minHeight="?attr/actionBarSize" 
     android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/> 

    <android.support.v4.view.ViewPager 
     android:id="@+id/pager" 
     android:layout_width="match_parent" 
     android:layout_height="fill_parent" 
     android:layout_below="@id/tab_layout"/> 

</RelativeLayout>

這裏是我的Java

package com.example.alexis.tablayout; 
import android.os.Bundle; 
import android.support.design.widget.TabLayout; 
import android.support.v4.view.ViewPager; 
import android.support.v7.app.AppCompatActivity; 
import android.support.v7.widget.Toolbar; 
import android.view.Menu; 
import android.view.MenuItem; 
import android.view.View; 

public class MainActivity extends AppCompatActivity { 

@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    setTitle(getResources().getText(R.string.MOD)); 

    final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); 
    setSupportActionBar(toolbar); 

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout); 
    final TabLayout.Tab Manof = tabLayout.newTab(); 
    final TabLayout.Tab Catalogue = tabLayout.newTab(); 
    final TabLayout.Tab Lidory = tabLayout.newTab(); 

    Manof.setIcon(R.drawable.flamepink); 
    Catalogue.setIcon(R.drawable.modwhite); 
    Lidory.setIcon(R.drawable.pantywhite); 

    tabLayout.addTab(Manof, 0); 
    tabLayout.addTab(Catalogue, 1); 
    tabLayout.addTab(Lidory, 2); 
    tabLayout.setTabGravity(TabLayout.GRAVITY_FILL); 

    final ViewPager viewPager = (ViewPager) findViewById(R.id.pager); 
    final PagerAdapter adapter = new PagerAdapter 
      (getSupportFragmentManager(), tabLayout.getTabCount()); 
    viewPager.setAdapter(adapter); 

    viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout)); 
    viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { 

     @Override 
     public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { 

     } 

     @Override 
     public void onPageSelected(int position) { 

      switch (position){ 
       case 0: 
        Manof.setIcon(R.drawable.flamepink); 
        Catalogue.setIcon(R.drawable.modwhite); 
        Lidory.setIcon(R.drawable.pantywhite); 
        setTitle("Man Of The Day"); 
        break; 

       case 1: 
        Manof.setIcon(R.drawable.flamewhite); 
        Catalogue.setIcon(R.drawable.modpink); 
        Lidory.setIcon(R.drawable.pantywhite); 
        setTitle("Catalogue"); 
        break; 
       case 2: 
        Manof.setIcon(R.drawable.flamewhite); 
        Catalogue.setIcon(R.drawable.modwhite); 
        Lidory.setIcon(R.drawable.pantypink); 
        setTitle("Lidory"); 
        break; 
      } 
     } 

     @Override 
     public void onPageScrollStateChanged(int state) { 
     } 
    }); 
} 

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    getMenuInflater().inflate(R.menu.menu_main, menu); 
    return true; 
} 

@Override 
public boolean onOptionsItemSelected(MenuItem item) { 
    int id = item.getItemId(); 
    if (id == R.id.Menu) { 
     return true; 
    } 

    return super.onOptionsItemSelected(item); 
}}

來源

2017-02-22 Astrid

你應該嘗試的TabLayout與ViewPager結合;

tabLayout.setupWithViewPager(yourViewPager);

此外，請確保ViewPager不覆蓋TabLayout。

來源

2017-02-22 23:07:37 gkanellis

感謝您的回覆，你可以給我的地方和更多的細節我該怎麼辦呢？ ...我被困在這裏：/ – Astrid

我有完全相同的問題。這工作對我來說：

首先，創建一個監聽器類來接收選項卡上的點擊事件（源代碼是在Kotlin，但你可以很容易地轉換爲Java）。這個類擴展了TabLayout.OnTabSelectedListener，並且在其構造函數上需要一個viewPager。

import android.support.design.widget.TabLayout 
import android.support.v4.view.ViewPager 


class MyTabLayoutListener(viewPager: ViewPager): 
TabLayout.OnTabSelectedListener { 

val viewer = viewPager 

override fun onTabReselected(tab: TabLayout.Tab?) { 
//Empty but needed 
} 

override fun onTabUnselected(tab: TabLayout.Tab?) { 
//Empty but needed 
} 

override fun onTabSelected(tab: TabLayout.Tab?) { 
    viewer.setCurrentItem(tab!!.position) //When a tab is clicked, the item on viewPager is changed. 
} 
}

現在，創建這個監聽器的實例，並把它添加到您的標籤：

var listener : MyTabLayoutListener = MyTabLayoutListener(viewPager) 
tabLayout.addOnTabSelectedListener(listener)

來源

2017-10-06 08:57:50

TabLayout：如何添加滑動和onClick切換標籤

回答

相關問題