Fragment 组件在实际运行的应用程序中是不可见的

Question

我想创建一个包含 3 个片段的活动。问题是在将视图添加到片段后，在 xml 设计部分它正常显示，但在实际设备或模拟器中运行后，视图变得不可见。我可以单击（例如）EditText 和键盘显示本身，但我看不到 EditText！

fragment.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=".ProfileTab">


<EditText
    android:id="@+id/edtProfileName"
    android:layout_width="0dp"
    android:layout_height="50dp"
    android:layout_marginStart="20dp"
    android:layout_marginTop="65dp"
    android:layout_marginEnd="20dp"
    android:background="@drawable/et_profiletab_custom"
    android:ems="10"
    android:hint="Profile Name"
    android:inputType="textPersonName"
    android:padding="15dp"
    android:textSize="15sp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
    .
    .
    .

activity.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"
android:id="@+id/fragment_holder"
tools:context=".SocialMediaActivity">

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/appBarLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff">

    <include
        android:id="@+id/myToolbar"
        layout="@layout/my_toolbar" />

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/purple_500"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:tabSelectedTextColor="#AEA0A0"
        app:tabTextColor="#fff" />

</com.google.android.material.appbar.AppBarLayout>

<androidx.viewpager.widget.ViewPager
    android:id="@+id/viewPager"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/appBarLayout"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />
   </androidx.constraintlayout.widget.ConstraintLayout>

fragment.java 代码：

public class ProfileTab extends Fragment {
private EditText edtProfileName;

public ProfileTab() {
    // Required empty public constructor
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    View view = inflater.inflate(R.layout.fragment_profile_tab, container, false);
    edtProfileName = view.findViewById(R.id.edtProfileName);
//....
return view;

activity.java

public class SocialMediaActivity extends AppCompatActivity {

private Toolbar toolbar;
private ViewPager viewPager;
private TabLayout tabLayout;
private TabAdapter tabAdapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_social_media);

    setTitle("Social Media App!!!");
    toolbar = findViewById(R.id.myToolbar);
    setSupportActionBar(toolbar);

    viewPager = findViewById(R.id.viewPager);
    tabAdapter = new TabAdapter(getSupportFragmentManager());
    //get the data from tab that we have created from fragments and put it to viewPager
    viewPager.setAdapter(tabAdapter);

    tabLayout = findViewById(R.id.tabLayout);
    tabLayout.setupWithViewPager(viewPager, false);
}

TabAdapter.java 代码：//java 说 FragmentPagerAapter 已弃用

public class TabAdapter extends FragmentPagerAdapter {

public TabAdapter(@NonNull FragmentManager fm) {
    super(fm);
}

@NonNull
@Override
public Fragment getItem(int tabPosition) {
    switch (tabPosition){
        case 0:
            return new ProfileTab();
        .
        .
        .
    }

}

@Override
public int getCount() {
    return 3;
}

@Nullable
@Override
public CharSequence getPageTitle(int position) {
    switch (position){
        case 0:
            return "Profile";
        .
        .
        .
    }
}

}

我尝试使用RelativeLayout 的fragment.xml 根布局或禁用工具栏替换操作栏或更改tablayout 和工具栏的主题，但存在问题。 我该如何解决这个问题？

Answer 1

在 XML 活动布局中更改这些行

<androidx.viewpager.widget.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/appBarLayout" />

并且还在 AppBarLayout 中将布局高度设置为：

<com.google.android.material.appbar.AppBarLayout
    android:id="@+id/appBarLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">