Recycler view inside Tab layout giving null point exception - android

I have this activity_category having a tabLayout. Inside Others tab I have a recyclerView which displays items from firebase like blog post example but I do not have Images, it is having only text views. It throws a null point exception even if I am initializing recyclerView inside OnCreate method
This is my activity_category
<RelativeLayout
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/main_content"
tools:context="com.solution.engineering.docket_ereceipt.CategoryActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_weight="1"
app:title="Categories">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
<android.support.design.widget.TabItem
android:id="#+id/tabItemHardware"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hardware" />
<android.support.design.widget.TabItem
android:id="#+id/tabItemStationary"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Stationary" />
<android.support.design.widget.TabItem
android:id="#+id/tabItemOthers"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Others" />
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
Inside one of the tab item (i.e others) I have the RecyclerView which looks like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
android:id="#+id/relativeOthers">
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/othersRecycler"
app:layoutManager="android.support.v7.widget.LinearLayoutManager">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
Java file of activity_catagory uses switch cases to switch between tabs. This is small piece of code how its calling layouts from switch case
public class SectionsPagerAdapter extends FragmentPagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position){
case 0:
viewOthers tab6 = new viewOthers();
return tab6;
default:
return null;
}
}
The java file viewOthers() looks like this
public class viewOthers extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.others_layout, container, false);
return rootView;
}
}
I initialize recyclerView here in CategoryActivity.java
public class CategoryActivity extends AppCompatActivity {
public SectionsPagerAdapter mSectionsPagerAdapter;
private RecyclerView mReceipt;
private DatabaseReference mRef;
public ViewPager mViewPager;
public int extrasPosition;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_category);
//NOW HERE IT SHOWS NULL POINT EXCEPTION
mReceipt = (RecyclerView)findViewById(R.id.othersRecycler);
mReceipt.setHasFixedSize(true);
mReceipt.setLayoutManager(new LinearLayoutManager(this));
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
// Create the adapter that will return a fragment for each of the three
// primary sections of the activity.
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter.
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(mViewPager));
//display the desired fragment
mViewPager.setCurrentItem(extrasPosition);
}
I don't understand why? Any help is appreciated. Thanks in advance.

Related

Fragment components are invisible in actual running app

I wanna create an activity that consist of 3 fragments. Problem is after adding views to fragment, in xml design section it shows normally but after running in actual device or emulator, views go invisible.I can click on (for example) EditText and keyboard shows itself, but i can not see that EditText!
fragment.xml code:
<?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 code:
<?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 code:
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 code: // java says that FragmentPagerAapter is deprecetad
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";
.
.
.
}
}
}
I try fragment.xml root layout with RelativeLayout or disable actionbar replacement with toolbar or change theme of tablayout and toolbar but problem is exist.
How can i solve the problem?
change these lines in XML activity layout
<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" />
and also in AppBarLayout set layout height to:
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">

The ViewPager doesn't work to swipe the fragments

The ViewPager doesn't work to swipe the fragment. I'm using Drawer activity then added a BottomNavigationView, and in the main content i added a FrameLayout to be a fragment container and positioned below the TabLayout and above the BottomNaigationView. Then I made a class named PagerAdapter extends FragmnetPagerAdapter.
I made a constructor and implement the getItem() and getCount() methods, then in the MainActivity I initialized all the views by its id but when I run the app all works except the the swipe among the fragment with the Viewpager. What should I do more to make it work.
This is my PagerAdapter class:
public class PageAdapter extends FragmentPagerAdapter {
private int numberOfTabs;
public PageAdapter(FragmentManager fm, int numberOfTabs) {
super(fm);
this.numberOfTabs = numberOfTabs;
}
#Override
public Fragment getItem(int position) {
switch (position){
case(0) : return new HomeFragment();
case(1) : return new CouponFragment();
default : return null;
}
}
#Override
public int getCount() {
return numberOfTabs;
}
}
Here is my xml file:
<android.support.design.widget.CoordinatorLayout 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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
Tool Bar with TextView to set the title
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" >
<TextView
android:id="#+id/my_title"
android:text="Title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:layout_gravity="center"
android:textColor="#color/white"
/>
</android.support.v7.widget.Toolbar>
Here the TabLayout is added with three tabs Home,Coupons and Notifications. I want the ViewPager to swipe among the three tabs
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:tabGravity="fill"
app:tabIndicatorColor="#color/color"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/color"
app:tabTextColor="#color/fadeWhite">
<android.support.design.widget.TabItem
android:id="#+id/tab_home"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Home"
style="#style/MyCustomTabLayout"
/>
<android.support.design.widget.TabItem
android:id="#+id/tab_coupons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Coupons"
style="#style/MyCustomTabLayout"
/>
<android.support.design.widget.TabItem
android:id="#+id/tab_notifiactions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Notifiactions"
style="#style/MyCustomTabLayout"
/>
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toTopOf="#id/navBar"
app:layout_constraintTop_toTopOf="parent"/>
<include layout="#layout/content_main" />
Here is the MainActivity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
appBarLayout = (AppBarLayout) findViewById(R.id.app_bar);
tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tab_home = (TabItem) findViewById(R.id.tab_home);
tab_coupons = (TabItem) findViewById(R.id.tab_coupons);
tab_noti = (TabItem) findViewById(R.id.tab_notifiactions);
viewPager = (ViewPager) findViewById(R.id.view_pager);
adapter = new PageAdapter(getSupportFragmentManager(),tabLayout.getTabGravity());
viewPager.setAdapter(adapter);
//setupToolBar
toolbar = (Toolbar) findViewById(R.id.toolbar);
my_title = (TextView) findViewById(R.id.my_title);
setSupportActionBar(toolbar);
my_title.setText(toolbar.getTitle());
getSupportActionBar().setDisplayShowTitleEnabled(false);
This line is wrong:
adapter = new PageAdapter(getSupportFragmentManager(),tabLayout.getTabGravity());
You should pass to your adapter the tabs count. tabLayout.getTabGravity() https://developer.android.com/reference/android/support/design/widget/TabLayout.html#getTabGravity() returns the current gravity used for laying out tabs.

how to change imageview in CollapsingToolbarLayout depending on each Fragment?

I'm making app using CollapsingToolbarLayout first time.
I want change Imageview(in ToolbarLayout) when I clicked each tab.
I thought two solution. One is using addOnTabSelectedListener(but it is hard to find any example), two In each fragment, set each Imageview. does it make sense?
How should I change code?
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:theme="#style/Theme.AppCompat.Light.NoActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:titleEnabled="false">
<ImageView
android:id="#+id/HeaderImg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/yeouido0"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax"
/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
app:tabContentStart="72dp"
app:tabTextColor="#android:color/tab_indicator_text"
app:tabSelectedTextColor="#android:color/white"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Fragment
public class YeoidoFragment extends Fragment {
public YeoidoFragment() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView= inflater.inflate(R.layout.ganglist, container, false);
final ArrayList<Gang> gangs = new ArrayList<>();
gangs.add(new Gang(R.drawable.yeouido1, getString(R.string.chimek),getString(R.string.chimek_ex)));
gangs.add(new Gang(R.drawable.yeouido2, getString(R.string.mulbit),getString(R.string.mulbit_ex)));
gangs.add(new Gang(R.drawable.yeouido3, getString(R.string.flower),getString(R.string.flower_ex)));
GangAdapter adapter = new GangAdapter(getActivity(), gangs);
ListView listView= rootView.findViewById(R.id.list);
listView.setAdapter(adapter);
return rootView;
}
MainActivity
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Find the view pager that will allow the user to swipe between fragments
final ViewPager viewPager = findViewById(R.id.viewpager);
// Create an adapter that knows which fragment should be shown on each page
CategoryAdapter adapter = new CategoryAdapter(this,getSupportFragmentManager());
// Set the adapter onto the view pager
viewPager.setAdapter(adapter);
TabLayout tabLayout= findViewById(R.id.tabs);
// Connect the tab layout with the view pager. This will
// 1. Update the tab layout when the view pager is swiped
// 2. Update the view pager when a tab is selected
// 3. Set the tab layout's tab names with the view pager's adapter's titles
// by calling onPageTitle()
tabLayout.setupWithViewPager(viewPager);
tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
#Override
public void onTabSelected(TabLayout.Tab tab) {
int position= tab.getPosition();
}
#Override
public void onTabUnselected(TabLayout.Tab tab) {
}
#Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}

Android UI Elements in tabbed view not loading

I'm using a FragmentStatePagerAdapter to manage three tabbed Fragments that each have a ListView and a button. When the parent Fragment loads the via the ViewPager and PagerAdapter, the Button is missing but the ListView still shows. Switching to another tab in the Fragment causes the buttons to show up as they were supposed to.
Why isn't the button showing on the first view load?
public class DetailsPagerAdapter extends FragmentStatePagerAdapter {
private Creature creature;
public DetailsPagerAdapter(FragmentManager fm, Creature creature) {
super(fm);
this.creature = creature;
}
#Override
public Fragment getItem(int position) {
switch(position) {
case 0:
return StatFragment.newInstance(creature);
case 1:
return ModFragment.newInstance(creature);
case 2:
return ResourceFragment.newInstance(creature);
}
return new Fragment();
}
#Override
public int getCount() {
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
switch(position) {
case 0:
return "Stats";
case 1:
return "Mods";
case 2:
return "Resources";
}
return "";
}
}
Details Fragment - Contains the tabs
public class CreatureDetailFragment extends Fragment {
private Creature creature;
private DetailsPagerAdapter detailsPagerAdapter;
private ViewPager viewPager;
private TabLayout tabs;
public CreatureDetailFragment() {
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments().containsKey(Creature.ID_INTENT_MESSAGE)) {
this.creature = Creature.get(this.getContext(), getArguments().getLong(Creature.ID_INTENT_MESSAGE, 0l));
Activity activity = this.getActivity();
CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) activity.findViewById(R.id.toolbar_layout);
if (collapsingToolbarLayout != null) {
collapsingToolbarLayout.setTitle(this.creature.name);
}
this.detailsPagerAdapter = new DetailsPagerAdapter(this.getActivity().getSupportFragmentManager(), creature);
}
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
super.onCreateView(inflater, container, savedInstanceState);
View view = inflater.inflate(R.layout.fragment_creature_details_tabbed, container, false);
this.viewPager = (ViewPager) view.findViewById(R.id.viewPager);
this.viewPager.setAdapter(this.detailsPagerAdapter);
this.tabs = (TabLayout) view.findViewById(R.id.tabLayout);
this.tabs.setupWithViewPager(this.viewPager);
return view;
}
}
Parent layout that contains tabs
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto" android:id="#+id/main_content"
android:layout_width="match_parent" android:layout_height="match_parent"
android:fitsSystemWindows="true" tools:context=".DetailActivity">
<android.support.design.widget.AppBarLayout android:id="#+id/appbar"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar android:id="#+id/detail_toolbar"
android:layout_width="match_parent" android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary" app:popupTheme="#style/AppTheme.PopupOverlay"
/>
<android.support.design.widget.TabLayout android:id="#+id/tabLayout"
android:layout_width="match_parent" android:layout_height="wrap_content"
android:fillViewport="false" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager android:id="#+id/viewPager"
android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Tab Layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabListView"
android:layout_alignParentTop="true"
android:layout_above="#+id/btnAddItem" />
<ImageButton
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/btnAddItem"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:textColor="#d5d5d5"
android:background="#000"
android:textSize="24dp"
android:alpha=".7"
android:src="#drawable/ic_action_add" />
</RelativeLayout>
It seems that CoordinatorLayout wasn't the best layout to use for my tab fragment. The ListView was pushing the button out of the viewable space on first load and, for some reason, was only being rendered when redrawing the view.
I switched it to RelativeLayout and added some attributes to the ViewPager:
<android.support.v4.view.ViewPager android:id="#+id/viewPager"
android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentBottom="true"
android:layout_below="#+id/appbar" />

Trouble with Tab Layout in Navigation Drawer

I use android.support:design library for NavigationDrawer and Tabs.
I have a trouble in fragment with tabs, it's shadow beetwen Toolbar and Tabs.
Tabs fragment screenshot
MainActivity layout:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
android:id="#+id/coordinate"
tools:context="tabs.com.tabs.com.fragments.items">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main" />
</android.support.design.widget.CoordinatorLayout>
Fragment tabs 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="tabs.com.tabs.com.fragments.items"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:duplicateParentState="true">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
app:tabGravity="fill"
app:tabMode="fixed"
android:background="#color/colorPrimary"
app:tabIndicatorColor="#color/white"
app:tabSelectedTextColor="#color/white"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:elevation="6dp">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
</LinearLayout>
Tabs code:
public class Items extends Fragment {
public static TabLayout tabLayout;
public static ViewPager viewPager;
public static int int_items = 2;
public Items() {
}
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View x = inflater.inflate(R.layout.fragment_news,null);
tabLayout = (TabLayout) x.findViewById(R.id.tabs);
viewPager = (ViewPager) x.findViewById(R.id.viewpager);
viewPager.setAdapter(new MyAdapter(getChildFragmentManager()));
tabLayout.post(new Runnable() {
#Override
public void run() {
tabLayout.setupWithViewPager(viewPager);
}
});
return x;
}
class MyAdapter extends FragmentPagerAdapter{
public MyAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position)
{
switch (position){
case 0 : return new PrimaryFragment();
case 1 : return new SocialFragment();
}
return null;
}
#Override
public int getCount() {
return int_items;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position){
case 0 :
return "ONE";
case 1 :
return "TWO";
}
return null;
}
}
}
How i can solve this trouble?
You can try setting same value for Elevation to both the TabLayout and ActionBar, as the ToolBar is 6dp elevated so it is casting its shadow over Tabs.
Set android:elevation="6dp" to ToolBar as it is in TabLayout.
For those who are using AppCompatActivity it is easy too, just set elevation like,
getSupportActionBar().setElevation(0);
=============================Update================================
1)
Another approach is that u make a layout having shadow part inside drawable and use it below your Tabs in XML designing.
In res/drawable/shadow.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#android:color/transparent"
android:endColor="#33000000"
android:angle="90">
</gradient>
Now use it as
<View
android:layout_width="match_parent"
android:layout_height="8dp"
android:layout_below="#id/TabLayoutID"
android:background="#drawable/shadow" />
In your main XML containing TabLayout.
2)
Or just Add this line in your style(s): if above way doesn't work.
<item name="android:windowContentOverlay">#drawable/shadow</item>
Hope, i have helped..!
To remove the shadow of toolbar add this to your app theme:
<item name="android:windowContentOverlay">#null</item>
And You use design-support library so you have to also add below line code.
getSupportActionBar().setElevation(0);

Categories

Resources