I'm trying to show a DialogFragment full-screen such that the ActionBar is still visible but the tabs in a TabLayout are hidden.
The image on the left is what I've managed to achieve; the image on the right is what I'm aiming for:
There are two issues:
The tabs are still shown, which the user can interact with;
Because of the extra FrameLayout to show the dialog, the ViewPager content is still visible (the FAB button is not part of the dialog). This also means that the user can interact with the content in the pager, which includes the ability to change tabs.
Main Activity Layout (main.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.CoordinatorLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Use ThemeOverlay to make the toolbar and tablayout text
white -->
<android.support.design.widget.AppBarLayout
android:id="#+id/abl_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:fitsSystemWindows="true"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways"/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/CustomTabStyle"/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</FrameLayout>
<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" />
</LinearLayout>
MainActivity.java
package com.example.app;
import android.content.Context;
import android.graphics.drawable.Drawable;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.text.Spannable;
import android.text.SpannableString;
import android.text.style.ImageSpan;
import android.util.Log;
import java.util.ArrayList;
import java.util.List;
public class MainActivity
extends AppCompatActivity
{
private static final String TAG = "MainActivity";
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// Setup AppBar
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
// Setup ViewPager
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
if (viewPager != null) {
setupViewPager(viewPager);
}
// Setup TabLayout
TabLayout tl = (TabLayout) findViewById(R.id.tab_layout);
tl.setupWithViewPager(viewPager);
}
#Override
public void onBackPressed() {
super.onBackPressed();
}
private void setupViewPager(ViewPager viewPager) {
Adapter adapter = new Adapter(
getSupportFragmentManager(), MainActivity.this);
adapter.addFragment(
new Fragment1(),
"Tab 1", R.drawable.numeric_1_box_outline);
adapter.addFragment(
new Fragment2(),
"Tab 2", R.drawable.numeric_2_box_outline);
viewPager.setAdapter(adapter);
}
static class Adapter extends FragmentPagerAdapter {
private final List<Fragment> mFragments = new ArrayList<>();
private final List<Integer> mFragmentIcons = new ArrayList<>();
private final List<String> mFragmentTitles = new ArrayList<>();
private Context context;
public Adapter(FragmentManager fm, Context context) {
super(fm);
this.context = context;
}
public void addFragment(Fragment fragment, String title, int iconId) {
mFragments.add(fragment);
mFragmentTitles.add(title);
mFragmentIcons.add(iconId);
}
#Override
public Fragment getItem(int position) {
return mFragments.get(position);
}
#Override
public int getCount() {
return mFragments.size();
}
#Override
public CharSequence getPageTitle(int position) {
Drawable image = context.getResources().getDrawable(
mFragmentIcons.get(position), null);
image.setBounds(0, 0, image.getIntrinsicWidth(),
image.getIntrinsicHeight());
SpannableString sb = new SpannableString(" " + mFragmentTitles.get(position));
ImageSpan imageSpan = new ImageSpan(image, ImageSpan.ALIGN_BOTTOM);
sb.setSpan(imageSpan, 0, 1, Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
return sb;
}
}
}
If you want the dialog to be full screen, the root view should be a FrameLayout (instead of a LinearLayout). If you want the dialog to contain a Toolbar, you'll also need a second Toolbar since your first one is attached to the TabLayout.
Something like this should work:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
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:id="#+id/container">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<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" />
<!-- Use ThemeOverlay to make the toolbar and tablayout text
white -->
<android.support.design.widget.AppBarLayout
android:id="#+id/abl_top"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:fitsSystemWindows="true"
android:layout_height="wrap_content"
android:layout_width="match_parent"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways"/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="#id/toolbar_layout"
app:layout_anchorGravity="bottom|right|end"
app:borderWidth="0dp"
android:layout_margin="20dp"
android:clickable="true"/>
</android.support.design.widget.CoordinatorLayout>
</FrameLayout>
MainActivity.java
...
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Setup AppBar
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
if (toolbar != null) {
setSupportActionBar(toolbar);
}
// Setup ViewPager
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
if (viewPager != null) {
setupViewPager(viewPager);
}
// Setup TabLayout
TabLayout tl = (TabLayout) findViewById(R.id.tab_layout);
tl.setupWithViewPager(viewPager);
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.add(R.id.container, new DialogFragment());
transaction.addToBackStack("tag");
transaction.commit();
}
...
fragment_dialog.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:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:id="#+id/fragment_toolbar"
android:fitsSystemWindows="true"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:background="?attr/colorPrimaryDark"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#android:color/background_light">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is the dialog"/>
</FrameLayout>
</LinearLayout>
DialogFragment.java
public class DialogFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_dialog, container, false);
final Toolbar toolbar = (Toolbar) view.findViewById(R.id.fragment_toolbar);
toolbar.setTitle("Dialog Title");
toolbar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_arrow_back_white));
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
getActivity().getSupportFragmentManager().popBackStack();
}
});
return view;
}
}
I would recommend using an Activity for the dialog instead of attaching a dialog fragment to the view, especially if you plan to put input text into the dialog. I experienced some odd behavior with animations and the soft keyboard when using a Fragment for the dialog. Creating a new Activity resolved all of these issues.
Related
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.
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.
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);
I am using Android's predefined Scrolling Activity (collapsing toolbar layout), I want to replace the content layout by fragments ( using viewpager ).
I have tried modifying the scrolling activity layout by different ways but i am not be able to achieve the goal.
I have attached an image which is my ultimate goal to achieve.
Can anyone help me in editing the scrolling activity in such a way to achieve the goal ?
Layout To Create
content_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".activity.DetailsActivity"
tools:showIn="#layout/activity_details">
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</android.support.v4.widget.NestedScrollView>
main_activity.xml
<?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"
tools:context=".activity.DetailsActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:toolbarId="#+id/toolbar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true" />
<me.relex.circleindicator.CircleIndicator
android:id="#+id/indicator"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentBottom="true"
android:gravity="top"
android:paddingBottom="25dp" />
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_layout" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
private ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_details);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mViewPager = findViewById(R.id.container);
setupViewPager(mViewPager);
mViewPager.setCurrentItem(0, true);
FloatingActionButton fab = (FloatingActionButton)
findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
Snackbar.make(view, "Replace with your own action",
Snackbar.LENGTH_LONG)
.setAction("Action", null).show();
}
});
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new
ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new Frag1(), "Frag1");
adapter.addFragment(new Frag2(), "Frag2);
adapter.addFragment(new Frag3(), "Frag3");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
You can simply add ViewPager to content_layout with TabLayout. You can simply use this tutorial for tabs and ViewPager.
Also add android:fillViewport="true" in NestedScrollView.
My adapter works fine but my fragment views are not inflated.
My main activity:
package com.example.rishi.flipper;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar= (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
viewPager= (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout= (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter viewpageradapter= new ViewPagerAdapter(getSupportFragmentManager());
viewpageradapter.addFragment(new Fragone(),"One");
viewpageradapter.addFragment(new FragTwo(),"Two");
viewpageradapter.addFragment(FragTwo.newInstance(),"Two");
viewPager.setAdapter(viewpageradapter);
}
}
The resource of the main activity :
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
>
<TextView
android:layout_width="wrap_content"
android:text="Toolbar"
android:height="24sp"
android:gravity="center"
android:textColor="#FFFFFF"
android:layout_height="wrap_content" />
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabs"
app:tabGravity="fill"
app:tabMode="scrollable"
></android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:id="#+id/viewpager"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_height="wrap_content">
</android.support.v4.view.ViewPager>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
And here's my adapter:
package com.example.rishi.flipper;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import java.util.ArrayList;
public class ViewPagerAdapter extends FragmentPagerAdapter {
ArrayList<Fragment> array=new ArrayList<>();
ArrayList<String> title=new ArrayList<>();
public ViewPagerAdapter(FragmentManager supportFragmentManager) {
super(supportFragmentManager);
}
#Override
public Fragment getItem(int position) {
return array.get(position);
}
public void addFragment(Fragment fragment, String text) {
array.add(fragment);
title.add(text);
}
#Override
public int getCount() {
return array.size();
}
#Override
public CharSequence getPageTitle(int position) {
return title.get(position);
}
}
I'm using Layout inflater to inflate a text view in fragment.
ViewPager cannot wrap_content for it's height as it can't know the maximum height of all of its children, as they may not all be instantiated at the same time (ViewPager creates and destroys its children as needed when scrolling between pages). It is possible changing to match_parent will fix this issue.
It is also a very bad idea to hold an ArrayList of Fragments as this will inevitably cause a memory leak, and crashes after process death in production. The intended behaviour for ViewPager is that you instantiate the fragments in getItem as they are needed.
If, after both of these changes, it still isn't inflating anything, it's likely that the issue is in the onCreateView code of your fragments.
Im using a viewpager in a fragment from navigation drawer.
The error is Cannot resolve method 'getSupportFragmentManager()' in viewpager.
In Code :
final PagerAdapter adapter = new PagerAdapter
(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
My whole Code is:
GalleryFragment.java
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.annotation.Nullable;
import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
/**
* A simple {#link Fragment} subclass.
*/
public class GalleryFragment extends Fragment {
private static GalleryFragment instance = null;
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View v = inflater.inflate(R.layout.fragment_gallery,container,false);
return v;
TabLayout tabLayout = (TabLayout) v.findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Image Gallery"));
tabLayout.addTab(tabLayout.newTab().setText("Video Gallery"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
final ViewPager viewPager = (ViewPager) v.findViewById(R.id.pager);
final PagerAdapter adapter = new PagerAdapter
(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
#Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(TabLayout.Tab tab) {
}
#Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
public static GalleryFragment newInstance(String text) {
if (instance == null) {
// new instance
instance = new GalleryFragment();
// sets data to bundle
Bundle bundle = new Bundle();
bundle.putString("msg", text);
// set data to fragment
instance.setArguments(bundle);
return instance;
} else {
return instance;
}
}
fragment_gallery.xml
<FrameLayout 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.root5solutions.mirrealtors.GalleryFragment">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:id="#+id/main_layout"
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.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tab_layout"/>
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
Can Anyone please help me to figure my error..
you have to use getFragmentManager() in a Fragment. If the Fragment is from the support library the returned value of getFragmentManager() is the one from the supported library.
In tab custom layout I set its parent element to match_parent and set its background color. When I run it tabs are shown custom layout wrapping the elements imageview and textview. I want this custom layout will fill the tab without any space between tabs.
Check output here:
private void setupTabLayout(ViewPager viewPager, ViewPagerAdapter viewPagerAdapter) {
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.setupWithViewPager(viewPager);
int length = tabLayout.getTabCount();
for (int i = 0; i < length; i++) {
tabLayout.getTabAt(i).setCustomView(viewPagerAdapter.getTabView(i));
}
}
tab_layout.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/layout"
android:background="#color/grey_accent">
<ImageView
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/icon"
android:src="#drawable/ic_action_home"
android:layout_marginBottom="19dp"
android:layout_above="#+id/title"
android:layout_centerHorizontal="true" />
<TextView
android:layout_gravity="center"
android:textColor="#color/white"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Home"
android:id="#+id/title"
android:layout_marginBottom="259dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
ViewPagerAdapter:
public View getTabView(int position) {
View view = LayoutInflater.from(this.context).inflate(R.layout.tab_layout, null);
TextView title = (TextView) view.findViewById(R.id.title);
ImageView icon = (ImageView) view.findViewById(R.id.icon);
ViewGroup layout = (ViewGroup) view.findViewById(R.id.layout);
layout.setBackgroundResource(this.mColorList.get(position));
icon.setImageResource(this.mIconList.get(position));
title.setText(this.getPageTitle(position));
return view;
}
Try this
<android.support.design.widget.TabLayout
app:tabPaddingStart="-1dp"
app:tabPaddingEnd="-1dp"/>
I found it here
You can use material design tablayout and then give custom view to all the tabs.
For full reference visit: Custom Tablayout Example
Custom view for all the tabs can be something like this:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:id="#+id/ll"
android:orientation="horizontal"
android:layout_weight="1"
android:gravity="center">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="#mipmap/ic_launcher"/>
<TextView
android:id="#+id/tvtab1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="ONE"
android:textColor="#color/colorAccent"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/ll2"
android:orientation="vertical"
android:gravity="center">
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="#mipmap/ic_launcher"/>
<TextView
android:id="#+id/tvtab2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TWO"
android:textColor="#26e9dc"
android:textSize="14sp"
android:textStyle="bold" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:id="#+id/ll3"
android:orientation="vertical"
android:gravity="center">
<TextView
android:id="#+id/tvtab3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="THREE"
android:textColor="#d8ea2b"
android:textSize="14sp"
android:textStyle="bold" />
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:src="#mipmap/ic_launcher"/>
</LinearLayout>
</LinearLayout>
code for xml file of activity (activity_main.xml)
<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabTextColor="#fff"
app:tabSelectedTextColor="#000"
app:tabGravity="fill"
app:tabMode="fixed" />
</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>
Finally code for MainActivity.java
import android.content.Context;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.LinearLayout;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;
public ViewPager viewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
View headerView = ((LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE))
.inflate(R.layout.custom_tab, null, false);
LinearLayout linearLayoutOne = (LinearLayout) headerView.findViewById(R.id.ll);
LinearLayout linearLayout2 = (LinearLayout) headerView.findViewById(R.id.ll2);
LinearLayout linearLayout3 = (LinearLayout) headerView.findViewById(R.id.ll3);
tabLayout.getTabAt(0).setCustomView(linearLayoutOne);
tabLayout.getTabAt(1).setCustomView(linearLayout2);
tabLayout.getTabAt(2).setCustomView(linearLayout3);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new OneFragment(), "ONE");
adapter.addFragment(new TwoFragment(), "TWO");
adapter.addFragment(new ThreeFragment(), "THREE");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
Step 1: Add xml layout code for customtabs
<android.support.design.widget.CoordinatorLayout 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:layout_alignParentBottom="true">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="scrollable"
android:background="#color/white"
app:tabGravity="center" />
</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:layout_marginBottom="50dp"/>
Step 2 : Java code for tabs activity
public class BookingsTabs extends AppCompatActivity {
String url, smobile, snames, semail, sid, stoken, responseServer;
String id, token, did, stsid, processresponse, type, cancelresponse;
TextView tv1;
Button cretedeal;
ViewbookingsAdapter adapter;
ViewbookingsAdapter2 adapter2;
LinearLayout order;
private Tracker mTracker;
ProgressDialog pDialog;
ListView listview;
private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
AnalyticsApplication application1;
SessionManagement session;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.view_bookings);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
if (toolbar != null) {
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowHomeEnabled(true);
actionBar.setDisplayShowTitleEnabled(true);
actionBar.setDisplayUseLogoEnabled(false);
actionBar.setHomeButtonEnabled(true);
}
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().setStatusBarColor(getResources().getColor(R.color.colorPrimaryDark));
}
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
int defaultValue = 0;
int page = getIntent().getIntExtra("TAB", defaultValue);
viewPager.setCurrentItem(page);
application1 = (AnalyticsApplication) getApplication();
mTracker = application1.getDefaultTracker();
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
tabLayout.setSelectedTabIndicatorColor(getResources().getColor(R.color.accentColor));
tabLayout.setTabTextColors(ContextCompat.getColorStateList(this, R.color.aquablue));
tabLayout.getTabAt(0).setCustomView(R.layout.aquablue);
tabLayout.getTabAt(1).setCustomView(R.layout.orangeprocess);
tabLayout.getTabAt(2).setCustomView(R.layout.shipping);
tabLayout.getTabAt(3).setCustomView(R.layout.deliver);
tabLayout.getTabAt(4).setCustomView(R.layout.completedtxt);
tabLayout.getTabAt(5).setCustomView(R.layout.cancelled);
callAsynchronousTask();
viewPager.setCurrentItem(0);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFrag(new OrderplacedFragment(), "Order Placed");
adapter.addFrag(new ProcessingFragment(), "Processing");
adapter.addFrag(new ShippingFragment(), "Shipping");
adapter.addFrag(new DeliveredFragment(), "Delivered");
adapter.addFrag(new CompletedFragment(), "Completed");
adapter.addFrag(new CancelledFragment(), "Cancelled");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
if (position == 0) {
}
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFrag(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
Step 3 :I added below sample tab code fragment for one tab same as other tabs
Take xml code any listview or some data
public class OrderplacedFragment extends Fragment {
View mMainView;
String url, smobile, snames, semail, sid, stoken, responseServer;
Context context;
ViewbookingsAdapter adapter;
ViewbookingsAdapter2 adapter2;
ListView listview;
LinearLayout tv1;
TextView create;
ArrayList<HashMap<String, String>> processlist, hatfilterslist;
SessionManagement session;
private SwipeRefreshLayout mSwipeRefreshLayout = null;
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
mMainView = inflater.inflate(R.layout.listview_orderbookings, container, false);
listview = (ListView) mMainView.findViewById(R.id.listview);
pDialog = new ProgressDialog(getActivity());
pDialog.setMessage("Loading...");
pDialog.setMax(5);
Intent j = getActivity().getIntent();
coupon_code = j.getStringExtra("code");
create = (TextView) mMainView.findViewById(R.id.dealslist);
tv1 = (LinearLayout) mMainView.findViewById(R.id.no_deals_linear);
create = (TextView) mMainView.findViewById(R.id.dealslist);
create.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent i = new Intent(getActivity(), MyDealsActivity.class);
startActivity(i);
}
});
tv1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent i = new Intent(getActivity(), MyDealsActivity.class);
startActivity(i);
}
});
return mMainView;
}
}
In this tabs we can add counts also. If you have any questions about this ask me
When you use inflate(R.layout.tab_layout, null), you are saying there is no parent View at all. This causes all layout_ attributes to be thrown away, as per this pro-tip.
Instead, you should pass in the TabLayout and false (i.e., do not automatically attach the View): this ensures that the attributes are not ignored.
public View getTabView(TabLayout tabLayout, int position) {
View view = LayoutInflater.from(this.context)
.inflate(R.layout.tab_layout, tabLayout, false);
TextView title = (TextView) view.findViewById(R.id.title);
ImageView icon = (ImageView) view.findViewById(R.id.icon);
ViewGroup layout = (ViewGroup) view.findViewById(R.id.layout);
layout.setBackgroundResource(this.mColorList.get(position));
icon.setImageResource(this.mIconList.get(position));
title.setText(this.getPageTitle(position));
return view;
}
use
app:tabMaxWidth="44dp"
app:tabMinWidth="44dp"