Viewpager 未显示在约束布局中

帕梅拉·西拉

我在 ConstraintLayout 中放置了一个 ViewPager,但它根本没有显示。任何其他视图都不会出现问题。这是我的布局代码:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:fillViewport="true">
        
        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            
            <LinearLayout
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent">
                
                <ImageView
                    android:layout_width="40dp"
                    android:layout_height="40dp"
                    android:id="@+id/close_login_screen"
                    android:layout_gravity="left"
                    android:src="@drawable/icondelete"/>
                
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_launcher_background"
                    android:layout_marginTop="60dp"
                    android:layout_marginBottom="40dp"/>
                
                <androidx.viewpager.widget.ViewPager
                    android:id="@+id/login_view_pager"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <com.google.android.material.tabs.TabLayout
                        android:id="@+id/tab_layout"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:tabIndicatorColor="@color/colorPrimaryDark"
                        app:tabTextColor="@android:color/darker_gray"
                        app:tabSelectedTextColor="@color/colorPrimaryDark"
                        app:tabIndicatorFullWidth="false"
                        app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"/>
                
                </androidx.viewpager.widget.ViewPager>
                
            </LinearLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>
        
    </ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

例如,如果我使用 LinearLayout,ViewPager 确实会显示,但它不会滚动以显示额外的内容。不确定这是否有帮助,但我想要实现的最终布局如下所示:

在此处输入图片说明

但相反,我有这个:

在此处输入图片说明

DEX7RA

我为你安排了一切。你需要有一个BaseFragment可以保存ViewPager. Viewpager调用2个的其它片段。在这里FirstFragment(电话)和SecondFragment(电子邮件)。所以首先定义你BaseFragment.java这样的:

public class BaseFragment extends Fragment {

    public BaseFragment(){
    }

    public static FirstFragment firstFragment;
    public static SecondFragment secondFragment;

    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_base, container, false);


        TabLayout tabLayout = view.findViewById(R.id.tab_layout);
        ViewPager viewPager = view.findViewById(R.id.login_view_pager);
        firstFragment = new FirstFragment();
        secondFragment = new SecondFragment();
        tabLayout.setupWithViewPager(viewPager);

        ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(getChildFragmentManager(), 0);
        viewPagerAdapter.addFragment(firstFragment,"Phone");
        viewPagerAdapter.addFragment(secondFragment,"Email");
        viewPager.setAdapter(viewPagerAdapter);

        return view;
    }

    private class ViewPagerAdapter extends FragmentPagerAdapter {

        private List<Fragment> fragments = new ArrayList<>();
        private List<String> fragmentTitle = new ArrayList<>();

        public ViewPagerAdapter(@NonNull FragmentManager fm, int behavior) {
            super(fm, behavior);
        }

        public void addFragment(Fragment fragment, String title) {
            fragments.add(fragment);
            fragmentTitle.add(title);
        }

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

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

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


    }
}

并且还fragment_base.xml用你给我们的东西来定义它

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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=".BaseFragment">


    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true"
        tools:ignore="MissingConstraints">

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <LinearLayout
                android:orientation="vertical"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent">

                <ImageView
                    android:layout_width="40dp"
                    android:layout_height="40dp"
                    android:id="@+id/close_login_screen"
                    android:layout_gravity="left"
                    android:src="@drawable/icondelete"/>

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:src="@drawable/ic_launcher_background"
                    android:layout_marginTop="60dp"
                    android:layout_marginBottom="40dp"/>

                <androidx.viewpager.widget.ViewPager
                    android:id="@+id/login_view_pager"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

                    <com.google.android.material.tabs.TabLayout
                        android:id="@+id/tab_layout"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        app:tabIndicatorColor="#121212"
                        app:tabTextColor="@android:color/darker_gray"
                        app:tabSelectedTextColor="#121212"
                        app:tabIndicatorFullWidth="false"
                        app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"/>

                </androidx.viewpager.widget.ViewPager>

            </LinearLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>

    </ScrollView>

</RelativeLayout>

现在是更不吸引人的部分。定义FirstFragmentSecondFragment使用它的视图。这将从ViewPageras TabLayout、您的电话和电子邮件页面保留

FirstFragment.java

public class FirstFragment extends Fragment {



    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_first, container, false);


        TextView textView = view.findViewById(R.id.textView_phone);

        return view;
    }
}

fragment_first.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".FirstFragment">
    
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Phone"
        android:textSize="28sp"
        android:id="@+id/textView_phone"
        android:layout_centerInParent="true"/>

</ScrollView>

SecondFragment.java

public class SecondFragment extends Fragment {


    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_second, container, false);


        TextView textView = view.findViewById(R.id.textView_email);

        return view;
    }
}

fragment_second.xml

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:tools="http://schemas.android.com/tools"
    tools:context=".SecondFragment">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Email"
        android:textSize="28sp"
        android:id="@+id/textView_email"
        android:layout_centerInParent="true"/>

</ScrollView>

结果

可滚动浏览器

现在你看到Viewpager它工作正常。如果你想片段滚动您需要添加ScrollViewfragment_first.xmlfragment_second.xml干杯!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章