Tabs are not coming in layout of android studio

Question

I am trying to create tabs in my layout. But instead of showing tab it is showing the below screen in design:

Below is the code:

**activity_mail.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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="200dp"
        android:id="@+id/appBarLayout2">
    <com.google.android.material.tabs.TabLayout
        android:id="@+id/sliding_tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabMode="fixed"/>
    </android.support.design.widget.AppBarLayout>
    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@android:color/white"/>
</LinearLayout>

MainActivity.java

import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;

import com.google.android.material.tabs.TabLayout;


public class MainActivity extends AppCompatActivity {

   /* private TabAdapter adapter;
    private TabLayout tabLayout;
    private ViewPager viewPager;*/
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
        viewPager.setAdapter(new TabAdapter(getSupportFragmentManager(),
                MainActivity.this));
        TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
        tabLayout.setupWithViewPager(viewPager);
}
}

Tab1Fragment.java

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import androidx.fragment.app.Fragment;

public class Tab1Fragment extends Fragment {
    public static final String ARG_PAGE = "ARG_PAGE";

    private int mPage;
    public static Tab1Fragment newInstance(int page) {
        Bundle args = new Bundle();
        args.putInt(ARG_PAGE, page);
        Tab1Fragment fragment = new Tab1Fragment();
        fragment.setArguments(args);
        return fragment;
    }

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        mPage = getArguments().getInt(ARG_PAGE);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_main, container, false);
        TextView textView = (TextView) view;
        textView.setText("Fragment #" + mPage);
        return view;
    }
}

TabAdapter.Java

import android.content.Context;

import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentStatePagerAdapter;

public class TabAdapter extends FragmentStatePagerAdapter {
    final int PAGE_COUNT = 3;
    private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" };
    private Context context;
    public TabAdapter(FragmentManager fm, Context context) {
        super(fm);
        this.context = context;
    }
    @Override
    public int getCount() {
        return PAGE_COUNT;
    }
    @Override
    public Fragment getItem(int position) {
        return Tab1Fragment.newInstance(position + 1);
    }
    @Override
    public CharSequence getPageTitle(int position) {
        // Generate title based on item position
        return tabTitles[position];
    }
}

fragment_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:id="@+id/mainLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ui.main.PlaceholderFragment">

    <TextView
        android:id="@+id/section_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/activity_horizontal_margin"
        android:layout_marginTop="@dimen/activity_vertical_margin"
        android:layout_marginEnd="@dimen/activity_horizontal_margin"
        android:layout_marginBottom="@dimen/activity_vertical_margin"
        android:text="@string/sparta"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintTop_creator="1" />

</androidx.constraintlayout.widget.ConstraintLayout>

Also when trying to run it in my mobile, it is showing error something like:

android.widget.RelativeLayout cannot be cast to android.widget.TextView

Please suggest the way to solve this issue.

https://stackoverflow.com/a/54527513/13600868 – Javad Dehban Jul 02 '20 at 03:28 — Javad Dehban, Jul 02 '20 at 03:28

Zain · Answer 1 · 2020-07-02T18:21:08.890

You're using deprecated design support AppBarLayout, You need to replace it with androidx library , so replace android.support.design.widget.AppBarLayout with com.google.android.material.appbar.AppBarLayout in your layout.

<?xml version="1.0" encoding="utf-8"?><?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout2"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="200dp">
        <com.google.android.material.tabs.TabLayout
            android:id="@+id/sliding_tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed" />

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


    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="@android:color/white" />
</LinearLayout>

For the android.widget.RelativeLayout cannot be cast to android.widget.TextView, please post the entire stack trace.

UPDATE

tab names are not coming. only green background of the tablayout is shown.

this is odd behavior, as I you already override getPageTitle in the adapter.. I just suggest not to use a hard-coded array of Strings in the adapter, instead add the tab titles in the strings.xml

Strings.xml

<resources>
    <string name="tab1">Tab1</string>
    <string name="tab2">Tab2</string>
    <string name="tab3">Tab3</string>
</resources>

Adapter

public class TabAdapter extends FragmentStatePagerAdapter {
    final int PAGE_COUNT = 3;
  //  private String tabTitles[] = new String[] { "Tab1", "Tab2", "Tab3" };
    private int[] tabTitles = new int[]{R.string.tab1, R.string.tab2, R.string.tab3};

    private Context context;
    public TabAdapter(FragmentManager fm, Context context) {
        super(fm);
        this.context = context;
    }
    @Override
    public int getCount() {
        return PAGE_COUNT;
    }
    @Override
    public Fragment getItem(int position) {
        return Tab1Fragment.newInstance(position + 1);
    }
    @Override
    public CharSequence getPageTitle(int position) {
        // Generate title based on item position
       // return tabTitles[position];
        
       return context.getString(tabTitles[position]);

    }
}

Please have a look at this question that might be relevant.

UPDATE 2

Try to add those listeners

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    ViewPager viewPager = (ViewPager) findViewById(R.id.viewPager);
    viewPager.setAdapter(new TabAdapter(getSupportFragmentManager(),
            MainActivity.this));
    TabLayout tabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
    tabLayout.setupWithViewPager(viewPager);

    // listeners
    viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(viewPager));


}

if not working , try to set the current item of the ViewPager

viewPager.setCurrentItem(itemPosition);

thanks zain, as commented, tab names are not coming. only green background of the tablayout is shown. pls suggest. — shCoder, Jul 02 '20 at 15:07
@shCoder thanks for comment, I updated the answer with that .. wish it works — Zain, Jul 02 '20 at 15:42
tried, but issue is still there. Nothing showing in tab layout. — shCoder, Jul 02 '20 at 17:57
@shCoder please check again, I am doubt that could fix it, but just give it a try — Zain, Jul 02 '20 at 18:21
hi zain, listener did not worked. where to set the current item of the ViewPager? — shCoder, Jul 03 '20 at 14:54
Hi shCoder, you can call it after `tabLayout.setupWithViewPager()` but I think it's not the problem .. also add a break point at `return context.getString(tabTitles[position]);` and debug your app to check if the `getPageTitle` really get called or not — Zain, Jul 03 '20 at 15:14

score 1 · Answer 2 · answered Jul 02 '20 at 03:22

1

After androidX, support library are removed, so you need to use material design which help you.

Replace your appbar with below code

    <com.google.android.material.appbar.AppBarLayout
     android:layout_width="match_parent"
     android:layout_height="50dp"
     android:layout_marginTop="200dp"
     android:id="@+id/appBarLayout2">

this will help you.

answered Jul 02 '20 at 03:22

webaddicted

1,071
10
23

thanks @webaddicted, however still the tab name is not coming. Only green background is there.pls suggest – shCoder Jul 02 '20 at 15:05

Tabs are not coming in layout of android studio

2 Answers2