英文:
Fragment overlapping tab layout
问题
当我启动我的应用程序时，一切都很正常，除了片段重叠了我的选项卡布局。切换选项卡是正常的，但似乎片段布局覆盖了整个屏幕，而不是在布局下面。有谁知道解决方法吗？
截屏：https://i.stack.imgur.com/YWhmp.jpg
希望我没有忘记添加某些东西，如果有的话，请问我。谢谢。
ActivityMain
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabLayout tabLayout = findViewById(R.id.tabBar);
TabItem tabItem1 = findViewById(R.id.tab1);
TabItem tabItem2 = findViewById(R.id.tab2);
TabItem tabItem3 = findViewById(R.id.tab3);
final ViewPager viewPager = findViewById(R.id.viewPager);
PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(pagerAdapter);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
viewPager.addOnPageChangeListener(new TabLayout
.TabLayoutOnPageChangeListener(tabLayout));
}
}
PagerAdapter类
public class PagerAdapter extends FragmentPagerAdapter {
private int numOfTabs;
public PagerAdapter (FragmentManager fm, int numOfTabs) {
super (fm);
this.numOfTabs = numOfTabs;
}
@NonNull
@Override
public Fragment getItem(int position) {
switch (position){
case 0:
return new FragmentTab1();
case 1:
return new FragmentTab2();
case 2:
return new FragmentTab3();
default:
return null;
}
}
@Override
public int getCount() {
return numOfTabs;
}
}
Activity_Main XML
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<com.google.android.material.tabs.TabLayout
android:id="@+id/tabBar"
android:layout_width="409dp"
android:layout_height="0dp"
android:layout_marginStart="1dp"
android:layout_marginEnd="1dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab1"
android:text="选项卡1" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab2"
android:text="选项卡2" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab3"
android:text="选项卡3" />
</com.google.android.material.tabs.TabLayout>
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewPager"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/tabBar" />
</androidx.constraintlayout.widget.ConstraintLayout>
英文:
When I start my app everything is fine except fragment overlapping my tab layout. Switching tab is fine, but it seems that fragment layout cover whole screen instead being under layout. Does anyone know solution ?
Screenshot: https://i.stack.imgur.com/YWhmp.jpg
Hope I didn't forgot to add something, if so, ask me.
Thanks.
ActivityMain
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabLayout tabLayout = findViewById(R.id.tabBar);
TabItem tabItem1 = findViewById(R.id.tab1);
TabItem tabItem2 = findViewById(R.id.tab2);
TabItem tabItem3 = findViewById(R.id.tab3);
final ViewPager viewPager = findViewById(R.id.viewPager);
PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(pagerAdapter);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
viewPager.addOnPageChangeListener(new TabLayout
.TabLayoutOnPageChangeListener(tabLayout));
}
}
PagerAdapter class
public class PagerAdapter extends FragmentPagerAdapter {
private int numOfTabs;
public PagerAdapter (FragmentManager fm, int numOfTabs) {
super (fm);
this.numOfTabs = numOfTabs;
}
@NonNull
@Override
public Fragment getItem(int position) {
switch (position){
case 0:
return new FragmentTab1();
case 1:
return new FragmentTab2();
case 2:
return new FragmentTab3();
default:
return null;
}
}
@Override
public int getCount() {
return numOfTabs;
}
}
Activity_Main xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<com.google.android.material.tabs.TabLayout
android:id="@+id/tabBar"
android:layout_width="409dp"
android:layout_height="0dp"
android:layout_marginStart="1dp"
android:layout_marginEnd="1dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab1"
android:text="Tab 1" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab2"
android:text="Tab 2" />
<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab3"
android:text="Tab 3" />
</com.google.android.material.tabs.TabLayout>
<androidx.viewpager.widget.ViewPager
android:id="@+id/viewPager"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@id/tabBar" />
</androidx.constraintlayout.widget.ConstraintLayout>
答案1
得分: 3
你正在使用：
app:layout_constraintTop_toTopOf="@id/tabBar"
而不是：
app:layout_constraintTop_toBottomOf="@id/tabBar"
第一个将片段的顶部与选项卡布局的顶部对齐，它们将重叠。片段的顶部应该被约束到选项卡栏的底部。
英文:
You are using
app:layout_constraintTop_toTopOf="@id/tabBar"
Instead of
app:layout_constraintTop_toBottomOf="@id/tabBar"
The first align the top of the fragment to that of the tablayout and they will overlap. The top of the fragment should instead be constrained to the bottom of the tabbar.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论