如何使用没有列表视图的选项卡实现折叠布局？

Question

我工作的一个Android项目，其中我要实现折叠式工具与标签。选项卡应该包含一个具有4个textview的正常相对布局。

我能够成功地实现折叠式工具，但问题是当过我尝试向上滚动抱着我已经实现了崩溃的工具栏不正常的标签。在相同的选项卡上，如果我使用列表视图或网格布局，它可以在我滚动时正常工作。如果我尝试使用“正常”布局，例如“线性”或“相对”布局，我无法滚动。有没有什么办法可以解决这个没有列表或网格布局？

下面

是我的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:id="@+id/main_content" 
 
    android:layout_width="match_parent" 
 
    android:layout_height="match_parent" 
 
    android:fitsSystemWindows="true"> 
 

 
    <android.support.design.widget.TabLayout 
 
     android:id="@+id/tabs" 
 
     style="@style/MyStyle" 
 
     android:layout_width="match_parent" 
 
     app:tabIndicatorColor="#F21757" 
 
     app:tabSelectedTextColor="#F21757" 
 
     android:layout_height="?actionBarSize" 
 
     app:tabTextColor="@android:color/white" 
 
     app:layout_anchor="@+id/MyAppbar" 
 
     app:layout_anchorGravity="bottom" 
 
     android:layout_gravity="bottom" 
 
     app:tabGravity="fill" 
 
     app:tabMode="scrollable" 
 
     android:background="#171C20" /> 
 

 

 
    <android.support.design.widget.AppBarLayout 
 
    android:id="@+id/MyAppbar" 
 
    android:layout_width="match_parent" 
 
    android:layout_height="256dp" 
 
    android:fitsSystemWindows="true" 
 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 
 
    > 
 

 
    <android.support.design.widget.CollapsingToolbarLayout 
 
     android:id="@+id/collapse_toolbar" 
 
     android:layout_width="match_parent" 
 
     android:layout_height="match_parent" 
 
     app:layout_scrollFlags="scroll|exitUntilCollapsed" 
 
     app:contentScrim="#000000" 
 

 
     android:fitsSystemWindows="true"> 
 

 
     <ImageView 
 
      android:id="@+id/bgheader" 
 
      android:layout_width="match_parent" 
 
      android:layout_height="match_parent" 
 
      android:scaleType="centerCrop" 
 
      android:src="@drawable/load" 
 
      android:fitsSystemWindows="true" 
 
      app:layout_collapseMode="parallax" 
 
      /> 
 

 
     <android.support.v7.widget.Toolbar 
 
      android:id="@+id/toolbar" 
 
      android:layout_width="match_parent" 
 
      android:layout_height="?actionBarSize" 
 
      app:layout_collapseMode="pin" 
 

 
      /> 
 

 

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

 
</android.support.design.widget.AppBarLayout> 
 
    
 
    <android.support.v4.view.ViewPager 
 
     android:id="@+id/viewPager" 
 
     android:paddingBottom="20dp" 
 
     android:layout_width="match_parent" 
 
     android:layout_height="match_parent" 
 
     android:layout_marginTop="?attr/actionBarSize" 
 
     app:layout_behavior="@string/appbar_scrolling_view_behavior" /> 
 

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

Answer 1

试试这个

第1步：main_activity.xml

<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:id="@+id/activity_main" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:fitsSystemWindows="true" 
tools:context="com.ncrypted.demoapplications.MainActivity"> 

<android.support.design.widget.AppBarLayout 
    android:id="@+id/app_bar_layout" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:fitsSystemWindows="true" 
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"> 

    <android.support.design.widget.CollapsingToolbarLayout 
     android:id="@+id/collapsingToolBar_hotel_details" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:fitsSystemWindows="true" 
     app:contentScrim="?attr/colorPrimary" 
     app:expandedTitleMarginEnd="64dp" 
     app:expandedTitleMarginStart="48dp" 
     app:layout_scrollFlags="scroll|exitUntilCollapsed"> 

     <ImageView 
      android:id="@+id/img_hotel_details" 
      android:layout_width="match_parent" 
      android:layout_height="300dp" 
      android:contentDescription="@string/strong_image_of_andorid" 
      android:fitsSystemWindows="true" 
      android:scaleType="centerCrop" 
      android:src="@mipmap/ic_launcher" 
      app:layout_collapseMode="parallax" /> 

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

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


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

    <android.support.design.widget.TabLayout 
     android:id="@+id/tabs" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:layout_collapseMode="pin" 
     app:tabGravity="fill" 
     app:tabMode="fixed" /> 
</android.support.design.widget.AppBarLayout> 
<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.v4.view.ViewPager> 

步骤：2创建片段活性

- FragmentActivity1

• fragment1.xml

  <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" 
  xmlns:tools="http://schemas.android.com/tools" 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" 
  xmlns:app="http://schemas.android.com/apk/res-auto" 
  tools:context="com.ncrypted.demoapplications.FragmentActivity1"> 
  
  <!-- TODO: Update blank fragment layout --> 
  <TextView 
  android:layout_width="match_parent" 
  android:layout_height="match_parent" 
  android:text="@string/hello_blank_fragment1" /> 
  

• FragmentActivity.java

  public class FragmentActivity1 extends Fragment {  
  public FragmentActivity1() 
  { 
      // Required empty public constructor 
  } 
  @Override 
  public View onCreateView(LayoutInflater inflater, ViewGroup container, 
           Bundle savedInstanceState) 
  { 
      // Inflate the layout for this fragment 
      return inflater.inflate(R.layout.fragment_fragment_activity1, container, false); 
  } 
  } 
  

步骤：3取另外两个片段2,3和编写代码如上

步骤：4MainActivity。 java的

public class MainActivity extends AppCompatActivity { 
private ViewPager pager; 
private TabLayout tabLayout; 
@Override 
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_main); 
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar_hotel_detail); 
    setSupportActionBar(toolbar); 
    ViewCompat.setTransitionName(findViewById(R.id.app_bar_layout), "Extra Image"); 
    CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) 
      findViewById(R.id.collapsingToolBar_hotel_details);  collapsingToolbarLayout.setContentScrimColor(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary)); 
    collapsingToolbarLayout.setTitle("Collaps"); 
    pager = (ViewPager) findViewById(R.id.viewPager); 
    ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager()); 
    adapter.addFragment(new FragmentActivity1()); 
    adapter.addFragment(new FragmentActivity2()); 
    adapter.addFragment(new FragmentActivity3()); 
    pager.setAdapter(adapter); 
    tabLayout = (TabLayout) findViewById(R.id.tabs); 
    tabLayout.setupWithViewPager(pager); 
    tabLayout.getTabAt(0).setText("Tab1"); 
    tabLayout.getTabAt(1).setText("Tab2"); 
    tabLayout.getTabAt(2).setText("Tab3"); 
} 
class ViewPagerAdapter extends FragmentPagerAdapter { 
    private final List<Fragment> mFragmentList = 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 addFragment(Fragment fragment) { 
     mFragmentList.add(fragment); 
    } 
    } 
}