Question

I have a ViewPager layout like the one below. However, the LinearLayout within the ViewPager disappears and is replaced by the content I'm loading into the ViewPager.

activity_main.xml

<LinearLayout
    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:orientation="vertical"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        app:pstsTabTextAlpha="150"
        app:pstsIndicatorHeight="3dp"
        app:pstsShouldExpand="true"
        app:pstsUnderlineHeight="0dp"
        app:pstsTabTextSize="14dp"
        />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tabs">

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

            <ImageView
                android:layout_width="120dp"
                android:layout_height="120dp"
                android:id="@+id/image"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:background="@drawable/ic_image"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop" />

        </LinearLayout>

    </android.support.v4.view.ViewPager>

</LinearLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity
        implements FirstFragment.OnFragmentInteractionListener,
        SecondFragment.OnFragmentInteractionListener,
        ThirdFragment.OnFragmentInteractionListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Initialize the ViewPager and set an adapter
        ViewPager pager = (ViewPager) findViewById(R.id.pager);
        pager.setAdapter(new PagerAdapter(getSupportFragmentManager()));

        // Bind the tabs to the ViewPager
        PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);
        tabs.setViewPager(pager);
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_group, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    public void onFragmentInteraction(Uri uri){
        //
    }

    private class PagerAdapter extends FragmentPagerAdapter {

        private final String[] TITLES = {"First", "Second", "Third"};

        public PagerAdapter(FragmentManager fm) {
            super(fm);
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return TITLES[position];
        }

        @Override
        public int getCount() {
            return TITLES.length;
        }

        @Override
        public Fragment getItem(int position) {
            switch (position) {
                case 0:
                    return new FirstFragment();
                case 1:
                    return new SecondFragment();
                case 2:
                    return new ThirdFragment();
            }

            return null;
        }
    }
}

FirstFragment.java

public class FirstFragment extends Fragment {
    // TODO: Rename parameter arguments, choose names that match
    // the fragment initialization parameters, e.g. ARG_ITEM_NUMBER
    private static final String ARG_PARAM1 = "param1";
    private static final String ARG_PARAM2 = "param2";

    // TODO: Rename and change types of parameters
    private String mParam1;
    private String mParam2;

    String BASE_URL = "http://www.example.com/api";

    private OnFragmentInteractionListener mListener;

    /**
     * Use this factory method to create a new instance of
     * this fragment using the provided parameters.
     *
     * @param param1 Parameter 1.
     * @param param2 Parameter 2.
     * @return A new instance of fragment FirstFragment.
     */
    // TODO: Rename and change types and number of parameters
    public static FirstFragment newInstance(String param1, String param2) {
        FirstFragment fragment = new FirstFragment();
        Bundle args = new Bundle();
        args.putString(ARG_PARAM1, param1);
        args.putString(ARG_PARAM2, param2);
        fragment.setArguments(args);
        return fragment;
    }

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

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        if (getArguments() != null) {
            mParam1 = getArguments().getString(ARG_PARAM1);
            mParam2 = getArguments().getString(ARG_PARAM2);
        }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_first, container, false);
        final ListView listView = (ListView) view.findViewById(R.id.listview_posts);

        final ArrayList<Post> postArray = new ArrayList<Post>();

        // REST API
        final RestAdapter restAdapter = new RestAdapter.Builder()
                .setEndpoint(BASE_URL)
                .build();

        final ApiEndpointInterface apiService = restAdapter.create(ApiEndpointInterface.class);

        apiService.getData(1, new Callback<PostData>() {

            @Override
            public void success(PostData postData, Response response) {
                final PostAdapter adapter = new PostAdapter(getActivity(), postArray);
                postArray.addAll(postData.getData());
                listView.setAdapter(adapter);

                adapter.notifyDataSetChanged();
            }

            @Override
            public void failure(RetrofitError retrofitError) {
                retrofitError.printStackTrace();
            }
        });

        return view;
    }

    class Deserializer implements JsonDeserializer<Post> {
        @Override
        public Post deserialize(JsonElement je, Type type, JsonDeserializationContext jdc)
                throws JsonParseException {
            // Get the "content" element from the parsed JSON
            JsonElement content = je.getAsJsonObject().get("data");

            // Deserialize it. You use a new instance of Gson to avoid infinite recursion
            // to this deserializer
            return new Gson().fromJson(content, Post.class);

        }
    }

    // TODO: Rename method, update argument and hook method into UI event
    public void onButtonPressed(Uri uri) {
        if (mListener != null) {
            mListener.onFragmentInteraction(uri);
        }
    }

    @Override
    public void onAttach(Activity activity) {
        super.onAttach(activity);
        try {
            mListener = (OnFragmentInteractionListener) activity;
        } catch (ClassCastException e) {
            throw new ClassCastException(activity.toString()
                    + " must implement OnFragmentInteractionListener");
        }
    }

    @Override
    public void onDetach() {
        super.onDetach();
        mListener = null;
    }

    /**
     * This interface must be implemented by activities that contain this
     * fragment to allow an interaction in this fragment to be communicated
     * to the activity and potentially other fragments contained in that
     * activity.
     * <p/>
     * See the Android Training lesson <a href=
     * "http://developer.android.com/training/basics/fragments/communicating.html"
     * >Communicating with Other Fragments</a> for more information.
     */
    public interface OnFragmentInteractionListener {
        // TODO: Update argument type and name
        public void onFragmentInteraction(Uri uri);
    }

}

fragment_first.xml

<LinearLayout
    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"
    tools:context="com.project.app.FirstFragment">

    <ListView
        android:id="@+id/listview_posts"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:dividerHeight="0dp"
        android:divider="@null" />

</LinearLayout>

Why is it replacing everything in the ViewPager? How can I instead append the data to the ViewPager, such that the data goes below the layout in the ViewPager?

Answer 1

you should include this components in Fragment layout

<LinearLayout
    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"
    android:orientation="vertical"
    tools:context="com.project.app.FirstFragment">
<LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal">

            <ImageView
                android:layout_width="120dp"
                android:layout_height="120dp"
                android:id="@+id/image"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:background="@drawable/ic_image"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop" />

        </LinearLayout>
    <ListView
        android:id="@+id/listview_posts"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:dividerHeight="0dp"
        android:divider="@null" />

</LinearLayout>

or place them under ViewPager like this

<LinearLayout
    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:orientation="vertical"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <com.astuetz.PagerSlidingTabStrip
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        app:pstsTabTextAlpha="150"
        app:pstsIndicatorHeight="3dp"
        app:pstsShouldExpand="true"
        app:pstsUnderlineHeight="0dp"
        app:pstsTabTextSize="14dp"
        />

    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/tabs">



    </android.support.v4.view.ViewPager>
 <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal">

            <ImageView
                android:layout_width="120dp"
                android:layout_height="120dp"
                android:id="@+id/image"
                android:layout_gravity="center_horizontal"
                android:layout_marginTop="5dp"
                android:background="@drawable/ic_image"
                android:adjustViewBounds="true"
                android:scaleType="centerCrop" />

        </LinearLayout>
</LinearLayout>

Answer 2

You can't do that... The viewpager will always do this.. yiu may need to put the layouts outside the viewpager.. in a way the makes user feel they are inside...

Layout in ViewPager being replaced

2 个答案: