How to make multiple layout for one screen?

Question

I want to make Screen in android with multiple layouts. Fox example On the top of the screen there is the header with image slider (this part is done) below that there will be a list view and below that there will be grid view.

Activitymain.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"
    tools:context="com.example.root.multipleview.MainActivity">

    <!--Header image-->
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:autoStart="true"></android.support.v4.view.ViewPager>

    <!--ListView Below header -->
    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:height="10dp" />

</RelativeLayout>

CustomLayout.xml

    <?xml version="1.0" encoding="utf-8"?>
<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:layout_alignParentTop="true"
    android:background="#f1f3f7"
    android:orientation="vertical">

    <!--Header image with slider-->
    <ImageView
        android:id="@+id/headerimg"
        android:layout_width="fill_parent"
        android:layout_height="180dp"
        android:scaleType="centerCrop"
        android:layout_marginTop="4dp"
        android:layout_marginLeft="4dp"
        android:layout_marginRight="4dp"
        android:layout_marginBottom="4dp"
        android:src="@mipmap/ic_launcher" />

    <!--ListView Below Header-->
    <RelativeLayout
        android:orientation="vertical" android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="1"
        android:layout_marginTop="20dp"
        android:paddingLeft="2dp">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="100dp"
            android:layout_height="90dp"
            android:layout_weight="0.05"
            app:srcCompat="@mipmap/ic_launcher"
            android:paddingTop="10dp"
            android:paddingBottom="10dp"
            android:gravity="center"/>

        <TextView
            android:id="@+id/textName"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_marginLeft="40dp"
            android:layout_marginStart="40dp"
            android:layout_marginTop="11dp"
            android:layout_toEndOf="@+id/imageView"
            android:layout_toRightOf="@+id/imageView"
            android:text="TextView" />

        <TextView
            android:id="@+id/textdesc"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView"
            android:layout_marginBottom="20dp"
            android:layout_alignBottom="@+id/imageView"
            android:layout_alignLeft="@+id/textName"
            android:layout_alignStart="@+id/textName"/>

    </RelativeLayout>
</LinearLayout>

ListView.java

    package com.example.root.multipleview;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;

/**
 * Created by root on 11/18/2017.
 */

public class ListView extends AppCompatActivity {
    int[] Images = {R.drawable.salad,R.drawable.salami,R.drawable.flour,R.drawable.salt,
            R.drawable.sandwich,R.drawable.sausage,R.drawable.seeds,R.drawable.cheese,R.drawable.shrimp,R.drawable.cupcake,R.drawable.cup,R.drawable.spices,R.drawable.cabbage
            ,R.drawable.spoon,R.drawable.apple,R.drawable.asparagus,R.drawable.cupcake,R.drawable.fish,R.drawable.corn,R.drawable.cupcake,R.drawable.spatula,R.drawable.olives
            ,R.drawable.garlic,R.drawable.taco,R.drawable.broccoli,R.drawable.cabbage};

    String[] Names = {"a","B","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"};

    String[] Description = {"VVV","DDD","ddd","dddsa","ddsdsds","zsxx","wwwwq","ddwqK","EQWK","FgggFFF","FFFkklF","FghhFFF","FFhhFF","FFhhFF",
            "FFmmmFF","FgggFFF","FFFFbbb","FFFFfeee","gfffFFFF","FFFFfff","FFFgffF","FFFFfgffg","FFFfgfgfF","FFFgffF","FFFgfggdF","FFFFdssa"};

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

        android.widget.ListView listView= (android.widget.ListView) findViewById(R.id.listView);

        CustomAdapter customAdapter = new CustomAdapter();

        listView.setAdapter(customAdapter);
    }

    public class CustomAdapter extends BaseAdapter {

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

        @Override
        public Object getItem(int i) {

            return null;
        }

        @Override
        public long getItemId(int i) {
            return 0;
        }

        @Override
        public View getView(int i, View view, ViewGroup viewGroup) {
            view = getLayoutInflater().inflate(R.layout.custom_layout,null);

            ImageView imageView = (ImageView)view.findViewById(R.id.imageView);
            TextView textView_N = (TextView)view.findViewById(R.id.textName);
            TextView textView_D = (TextView)view.findViewById(R.id.textdesc);

            imageView.setImageResource(Images[i]);
            textView_N.setText(Names[i]);
            textView_D.setText(Description[i]);

            return view;
        }
    }
}

MainActivity.java

    package com.example.root.multipleview;

import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;

public class MainActivity extends AppCompatActivity {

    ViewPager viewPager;

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

        viewPager = (ViewPager)findViewById(R.id.viewPager);

        ViewPageAdapter viewPageAdapter = new ViewPageAdapter( this);

        viewPager.setAdapter(viewPageAdapter);
    }
}

ViewPageAdapter

    package com.example.root.multipleview;

import android.content.Context;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

/**
 * Created by root on 11/18/2017.
 */

public class ViewPageAdapter extends PagerAdapter{
    private Context context;
    private LayoutInflater layoutInflater;
    private Integer[] images = {R.drawable.b,R.drawable.c,R.drawable.e,R.drawable.j,R.drawable.r,R.drawable.x,R.drawable.y};

    public  ViewPageAdapter(Context context){this.context = context;}
    @Override
    public int getCount() {
        return images.length;
    }

    @Override
    public boolean isViewFromObject(View view, Object object) {
        return view == object;
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {

        layoutInflater =(LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View view = layoutInflater.inflate((R.layout.custom_layout), null);

        ImageView imageView = (ImageView) view.findViewById(R.id.headerimg);
        imageView.setImageResource((images[position]));

        ViewPager vp = (ViewPager) container;

        vp.addView(view, 0);
        return  view;
    }

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        ViewPager vp = (ViewPager) container;
        View view = (View) object;
        vp.removeView(view);
    }
}

When I check this all layout separately it works but after adding in one layout it's not working. output screenshot is added

enter image description here

Answer 1

How to make multiple layout for one screen?

my approach for this goal is using Fragments

how?

i do make a single main_layout and set a FrameLayout in order to put fragments with different layouts.so i have a screen with different layouts.

this is my best answer for your question .