-1

我試圖用ViewPagerTabLayout實現標籤視圖, 我能夠做到這一點,但標籤不包括位於頂部的工具欄的屏幕。 我已經包含了我所擁有的截圖。 有人可以告訴我如何將標籤移動到工具欄,並且標籤在觸摸時不會改變 ,只有在向左或向右滑動時纔會改變。如何在<code>fragment</code>包括在工具欄上TabLayout在片段

我已經試過在tabslayout.xml文件 的android.support.design.widget.AppBarLayout中加入android.support.design.widget.TabLayout它在它上面添加一個藍色背景並且觸摸工作但仍然沒有包含在工具欄中。

這裏是代碼。

1.Tabs.java

import android.os.Bundle; 
import android.support.design.widget.TabLayout; 
import android.support.v4.app.Fragment; 
import android.support.v4.app.FragmentManager; 
import android.support.v4.app.FragmentPagerAdapter; 
import android.support.v4.view.ViewPager; 
import android.view.LayoutInflater; 
import android.view.View; 
import android.view.ViewGroup; 


import java.util.ArrayList; 
import java.util.List; 


public class Tabs extends Fragment { 

    public Tabs() { 
     // Required empty public constructor 
    } 

    private TabLayout tabLayout; 
    private ViewPager viewPager; 



    @Override 
    public View onCreateView(LayoutInflater inflater, ViewGroup container, 
          Bundle savedInstanceState) { 

     View mekeleLayout = inflater.inflate(R.layout.tabs_layout,container,false); 



     viewPager = (ViewPager) mekeleLayout.findViewById(R.id.viewpager); 
     setupViewPager(viewPager); 

     tabLayout = (TabLayout) mekeleLayout.findViewById(R.id.tabs); 
     tabLayout.setupWithViewPager(viewPager); 

     return mekeleLayout; 
    } 
    private void setupViewPager(ViewPager viewPager) { 
     ViewPagerAdapter adapter = new ViewPagerAdapter(getFragmentManager()); 
     adapter.addFrag(new OneFragment(), "RESTAURANTS"); 
     adapter.addFrag(new TwoFragment(), "CAFES"); 
     adapter.addFrag(new ThreeFragment(), "HOTELS"); 
     viewPager.setAdapter(adapter); 
    } 

    class ViewPagerAdapter extends FragmentPagerAdapter { 
     private final List<Fragment> mFragmentList = new ArrayList<>(); 
     private final List<String> mFragmentTitleList = new ArrayList<>(); 

     public ViewPagerAdapter(FragmentManager manager) { 
      super(manager); 
     } 

     @Override 
     public Fragment getItem(int position) { 
      return mFragmentList.get(position); 
     } 

     @Override 
     public int getCount() { 
      return mFragmentList.size(); 
     } 

     public void addFrag(Fragment fragment, String title) { 
      mFragmentList.add(fragment); 
      mFragmentTitleList.add(title); 
     } 

     @Override 
     public CharSequence getPageTitle(int position) { 
      return mFragmentTitleList.get(position); 
     } 
    } 

} 

2.tabslayout.xml

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      app:tabGravity="fill" 
      /> 



    <android.support.v4.view.ViewPager 
     android:id="@+id/viewpager" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
</android.support.design.widget.CoordinatorLayout> 

3.activity_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:fitsSystemWindows="true" 
    tools:openDrawer="start"> 

    <include 
     layout="@layout/app_bar_main" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" /> 

    <android.support.design.widget.NavigationView 
     android:id="@+id/nav_view" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_gravity="start" 
     android:fitsSystemWindows="true" 
     app:headerLayout="@layout/nav_header_main" 
     app:menu="@menu/activity_main_drawer" /> 

</android.support.v4.widget.DrawerLayout> 

4.app_bar_main.xml

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 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" 
    android:fitsSystemWindows="true" 
    tools:context="com.example.surafel.information.MainActivity"> 

    <android.support.design.widget.AppBarLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:theme="@style/AppTheme.AppBarOverlay"> 

     <android.support.v7.widget.Toolbar 
      android:id="@+id/toolbar" 
      android:layout_width="match_parent" 
      android:layout_height="?attr/actionBarSize" 
      android:background="?attr/colorPrimary" 
      app:popupTheme="@style/AppTheme.PopupOverlay" /> 

    </android.support.design.widget.AppBarLayout> 

    <include layout="@layout/content_main" /> 


</android.support.design.widget.CoordinatorLayout> 

回答

1

這是爲我工作。

<?xml version="1.0" encoding="utf-8"?> 
<android.support.design.widget.CoordinatorLayout 
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"> 

<android.support.design.widget.AppBarLayout 
    android:id="@+id/app_bar" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:theme="@style/AppTheme.AppBarOverlay"> 

    <android.support.v7.widget.Toolbar 
     android:id="@+id/toolbar" 
     android:layout_width="match_parent" 
     android:layout_height="?attr/actionBarSize" 
     app:layout_collapseMode="pin" 
     app:popupTheme="@style/AppTheme.PopupOverlay" 
     android:background="@color/colorPrimary" 
     android:layout_weight="1"> 
     <android.support.design.widget.TabLayout 
      android:id="@+id/tabs" 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_gravity="top" 
      app:tabIndicatorColor="@color/colorAccent" 
      app:tabMaxWidth="0dp" 
      app:tabGravity="fill" 
      app:tabMode="scrollable" 
      android:background="@color/colorPrimary" /> 
    </android.support.v7.widget.Toolbar> 
</android.support.design.widget.AppBarLayout> 

<android.support.v4.view.ViewPager 
    android:id="@+id/tabanim_viewpager" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 

</android.support.design.widget.CoordinatorLayout> 
+0

是的這個似乎是非常感謝答覆 – surafel

0

應該使用一個主題,其不具有操作欄的活動。

+0

我很抱歉,我是新到Android,你可以描述你的答案一點在detail.thanks – surafel

+0

在清單中添加該代碼「<活動機器人:主題=」的主要活動的活動標籤@機器人: style/Theme.NoTitleBar「...>」 –

+0

我不使用使用片段的活動 – surafel

0

試試下面一個

<RelativeLayout 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="fill_parent" 
> 

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:orientation="vertical"> 

     <android.support.design.widget.AppBarLayout 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content"> 

      <android.support.v7.widget.Toolbar 
        android:id="@+id/app_bar" 
        android:layout_width="match_parent" 
        android:layout_height="?attr/actionBarSize" 
        android:minHeight="?android:attr/actionBarSize" 
        app:layout_scrollFlags="scroll|enterAlways" 
        app:theme="@style/appBar"> 

      </android.support.v7.widget.Toolbar> 

      <android.support.design.widget.TabLayout 
       android:layout_width="match_parent" 
       android:layout_height="wrap_content" 
       app:layout_scrollFlags="scroll|enterAlways" 
       app:tabBackground="@color/app_bar_color" 
       app:tabGravity="center" 
       app:tabMode="scrollable" /> 
     </android.support.design.widget.AppBarLayout> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewpager" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:theme="@style/viewPagerTheme" 
      app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
    </LinearLayout> 
</android.support.design.widget.CoordinatorLayout> 

在styles.xml添加appbar主題

<style name="appBar" parent="Theme.AppCompat.Light.NoActionBar"> 
    <item name="colorPrimary">@color/colorPrimary</item> 
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item> 
    <item name="colorAccent">@color/colorAccent</item> 
    <item name="android:textColorPrimary">@android:color/black</item> 
    <item name="android:textColorSecondary">@android:color/white</item> 

</style> 
+0

這樣可以解決觸摸問題,它也添加了與工具欄相同的背景,但不包括在內。 – surafel

+0

查看我編輯的帖子,我編輯了appBar主題,只需在styles.xml中添加 –

+0

如果它的工作符合我的答案,謝謝! –