Adding tabs to Android 5.0 toolbar? - android

I am in the process of creating my first app and learning java for the first time as well, and am stuck on creating tabs on the toolbar..
I took a look at this post. However I was still confused on how to properly implement them. Should I be downloading the SlidingTabsColors file, and then adding it as a dependency in gradle.build?
In this section: fragment_sample.xml:
<?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:orientation="vertical" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<com.example.android.common.view.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#android:color/white" />
</LinearLayout>
I can not add com.example.android.common.view.SlidingTabLayout to the layout.
Thank you

Try 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:orientation="vertical" >
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
app:theme="#style/ThemeOverlay.AppCompat.ActionBar">
</android.support.v7.widget.Toolbar>
<com.example.android.common.view.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1"
android:background="#android:color/white" />
</LinearLayout>
For a better implementation try:
add this to your gradle dependences
compile 'com.astuetz:pagerslidingtabstrip:1.0.1'
Then instead of the SlidingTabLayout use
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dip" />
In your activity where you want to call the ViewPager You have to
// Initialize the ViewPager and set an adapter
ViewPager pager = (ViewPager) findViewById(R.id.viewpager);
pager.setAdapter(new YourCustomAdapter(getSupportFragmentManager()));
// Bind the tabs to the ViewPager
PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);
tabs.setViewPager(pager);
You might want to implement your adapter like this:
public class YourCustomAdapter extends FragmentStatePagerAdapter {
private String[] titles = { "Item 1", "Item 2", "Item 3" };
public YourCustomAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch(position){
case 0:{
return new YourFragment();
}
case 1:{
return new YourFragment();
}
case 2:{
return new YourFragment();
}
}
return null;
}
#Override
public int getCount() {
return titles.length;
}
#Override
public CharSequence getPageTitle(int position) {
return titles[position];
}
}
Hope it helps!!!

Related

TabLayout tab can't click in Android

I can't click tab in TabLayout. I have two tabs(Genel and Ozel). When I open the app genel open I slither Ozel layout open in genel tab. I can't click in Ozel Tab. The codes are in below.
XML Codes:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/fotogpsbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
/>
<android.support.design.widget.TabLayout
android:id="#+id/fotogpslayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed"
>
<android.support.design.widget.TabItem
android:id="#+id/fotogpsgenel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Genel"
/>
<android.support.design.widget.TabItem
android:id="#+id/fotogpsozel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Özel"
/>
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/ogesayfa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</android.support.v4.view.ViewPager>
</RelativeLayout>
Java Codes (MainActivity):
Toolbar fototoolbar;
TabLayout fototabl;
TabItem genelit, ozelit;
ViewPager fotogpspager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
fototoolbar = findViewById(R.id.fotogpsbar);
fototabl = findViewById(R.id.fotogpslayout);
genelit = findViewById(R.id.fotogpsgenel);
ozelit = findViewById(R.id.fotogpsozel);
fotogpspager = findViewById(R.id.ogesayfa);
sayfaadapter sayfaada = new sayfaadapter(getSupportFragmentManager(), fototabl.getTabCount());
fotogpspager.setAdapter(sayfaada);
}
Java codes (sayfaadapter - Adapter):
public class sayfaadapter extends FragmentPagerAdapter {
private int tabsayi;
sayfaadapter(FragmentManager fm, int tabsayi){
super(fm);
this.tabsayi = tabsayi;
}
#Override
public Fragment getItem(int i) {
switch(i){
case 0:
return new genel();
case 1:
return new ozel();
default:
return null;
}
}
#Override
public int getCount() {
return tabsayi;
}
}
How I can resolve this problem?
I need your help.
Not: I hope you can understand. I doesn't have a good English. You can ask where you doesn't understand.
you forgot to add layout_below into your views so viewpager overlay on tab because of this you cant click on tab,
replace code as below in your xml.
<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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/fotogpsbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme" />
<android.support.design.widget.TabLayout
android:id="#+id/fotogpslayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fotogpsbar"
app:tabGravity="fill"
app:tabMode="fixed">
<android.support.design.widget.TabItem
android:id="#+id/fotogpsgenel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Genel" />
<android.support.design.widget.TabItem
android:id="#+id/fotogpsozel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Özel" />
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/ogesayfa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fotogpslayout" />
</RelativeLayout>

ViewPager not working with match_parent

I have a base activity which has AppBarLayout with a toolbar and tablayout. There is a bottombar with contentframe to load the fragment. Now there is a fragment with which has a viewpager which will load the fragments of the selected tab.
Now the problem is that whenever I am loading the fragment in theviewpager, the height of the viewpager is 0. I am not able to see the loaded fragment.
If I specify height like 400dp or so to the viewpager then it is visible and works properly.
Toolbar xml:
<?xml version="1.0" encoding="utf-8"?>
<merge 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="wrap_content">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbarlayout"
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"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.AppBarLayout>
</merge>
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:id="#+id/activity_job_landing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".xxx.xxxx.xxxx">
<include
layout="#layout/layout_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<android.support.v4.widget.NestedScrollView
android:id="#+id/myScrollingContent"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/framelayout_joblanding_contentframe"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
<com.roughike.bottombar.BottomBar
android:id="#+id/bottom_bar_job_landing"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="bottom"
android:background="#color/indigo900"
app:bb_activeTabAlpha="1"
app:bb_activeTabColor="#color/white"
app:bb_behavior="shy"
app:bb_inActiveTabAlpha="0.8"
app:bb_inActiveTabColor="#B6BDBF"
app:bb_tabXmlResource="#xml/job_landing_bottom_bar_tabs" />
</android.support.design.widget.CoordinatorLayout>
Fragment xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.xxx.xxxx.xxx"
android:background="#color/bluegrey50">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager_job_applicant"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
Fragment Java:
public class ApplicantFragment extends Fragment {
#BindView(R.id.viewpager_job_applicant)
ViewPager mViewPager;
//#BindView(R.id.tab_layout_job_applicant)
TabLayout mTabLayout;
public ApplicantFragment() {
// 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_applicant, container, false);
ButterKnife.bind(this, view);
mTabLayout = (TabLayout) getActivity().findViewById(R.id.tab_layout_job_applicant);
mViewPager.setAdapter(new ApplicantFragmentPagerAdapter(getChildFragmentManager()));
mTabLayout.setupWithViewPager(mViewPager);
return view;
}
class ApplicantFragmentPagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 7;
private final String tabTitles[] =
new String[]{"Fresher", "Next Round", "Hold",
"Reject", "TCFI", "CFI", "Hired"};
public ApplicantFragmentPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
CandidateListFragment candidateListFragment;
candidateListFragment = CandidateListFragment.newInstance();
return candidateListFragment;
}
#Override
public int getCount() {
return tabTitles.length;
}
#Override
public CharSequence getPageTitle(int position) {
// Generate title based on item position
return tabTitles[position];
}
}
}
Fragment that is loaded:
<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="xxx.xxxx.xxxx">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/hello_blank_fragment" />
</FrameLayout>

Could not set the tab titles into the top

I created tabs with ViewPager. But the titles of the tabs are appearing in the center of the screen. I would like to keep the titles on the top of the screen. Please check my following xml codes and java files. Kindly let me know how to fix this issue.
This is the xml file for MainActivity:
<?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:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="com.example.bright.myapplication.MainActivity">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:id="#+id/tablayout"
android:layout_below="#+id/toolbar">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Center" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right" />
</android.support.design.widget.TabLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_below="#+id/toolbar" />
</RelativeLayout>
The following is the xml file for the first fragment:
fragment_blank_fragment1.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.bright.myapplication.BlankFragment1">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 1" />
</FrameLayout>
The following is the xml file for the second fragment:
fragment_blank_fragment2.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.bright.myapplication.BlankFragment2">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="hello_blank_fragment 2" />
</FrameLayout>
and one more xml file for a fragment
The following is the Activity file:
MainActivity.java
public class MainActivity extends AppCompatActivity {
TabLayout tabLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = (TabLayout)findViewById(R.id.tablayout);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
MyAdapter myAdapter = new MyAdapter(getSupportFragmentManager(),3);
ViewPager viewPager = (ViewPager)findViewById(R.id.viewpager);
viewPager.setAdapter(myAdapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
}
}
The following is the place where I am returning the fragments to the main activity through ViewPager:
MyAdapter.java
public class MyAdapter extends FragmentStatePagerAdapter {
int tabcount;
public MyAdapter(FragmentManager fm, int count) {
super(fm);
tabcount = count;
}
#Override
public Fragment getItem(int position) {
switch (position){
case 0:
BlankFragment1 fragment1 = new BlankFragment1();
return fragment1;
case 1:
BlankFragment2 fragment2 = new BlankFragment2();
return fragment2;
case 2:
BlankFragment3 fragment3 = new BlankFragment3();
return fragment3;
default:
return null;
}
}
#Override
public int getCount() {
return tabcount;
}
}
The reason your TabLayout is appearing in the center of the screen is because you have the layout_height set to match_parent. The default gravity of the items within a TabLayout is center_vertical.
I am assuming you want the standard look and feel of tabs as per the Material Design Guidelines, in which case the layout file for your MainActivity should look more like this:
<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="wrap_content">
<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">
<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.TabLayout android:id="#+id/tab_layout"
android:layout_width="match_parent" android:layout_height="wrap_content"
app:tabIndicatorColor="?attr/colorAccent">
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="#string/tab_left"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="#string/tab_center"/>
<android.support.design.widget.TabItem
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:text="#string/tab_right"/>
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.ViewPager android:id="#+id/pager"
android:layout_width="match_parent" android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
Also, there is a convenience method for setting up tabs with a ViewPager, instead of calling viewPager.setOnPageChangeListener():
tabLayout.setupWithViewPager(viewPager);

How do I make my Fragment layout fit under the tabs created in main Activity?

I have a problem which seems to have a different solution everytime it is asked, and causing me great distress. I have tried to use the solutions in other SO questions, but none worked.
I have an Activity from which initializes a ViewPager, a toolbar and a TabLayout. There are two tabs, both of which are implemented using fragments. The problem is
that my fragment is layed out with a spinner, a recycler view, a button and a textfield. Of these widgets, only the recyclerView shows up with the first two items missing,
forcing me to believe the Spinner is hidden just behind my AppLayoutBar, and the textField and buttons are below the screen. My question is, how do I get the layout
of my fragment to appear in the visible part of the screen below the tabs? Below are the Layout files for both fragment and main activity
Fragment:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/header"
>
<Spinner
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/spinner"
android:entries="#array/status"
>
</Spinner>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/list"
android:paddingTop="20dp"
android:layout_below="#+id/spinner"
android:layout_above="#+id/editText"
/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.75"
android:inputType="textMultiLine"
android:id="#+id/editText"
android:hint="#string/goal_edit_text_hint"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:maxLines="5"
android:minLines="1"
android:scrollHorizontally="false"
android:layout_alignParentStart="true"
android:layout_toLeftOf="#+id/addButton"
android:layout_toStartOf="#+id/addButton" />
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/add_button_text"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textAppearance="?android:textAppearanceLarge"
android:layout_alignParentEnd="true"
android:drawableLeft="#drawable/math"
android:id="#+id/addButton" />
</RelativeLayout>
Main Activity
<?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"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="612dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="center" />
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/header"
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"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"
/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
For a Detail Tutorial Have a look At
Dear I can understand your problem and I have a solution for you that will work perfectly. I'm giving complete piece of code that will solve your issue.
Step - 1: Paste this XML in your Main Activity 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"
tools:context="com.broadpeakit.hmehmood.company.HomeActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.CustonActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:titleTextColor="#color/white"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_home" />
</android.support.design.widget.CoordinatorLayout>
Step 2 - Crate another layout with named content_home. and paste this code there.
<?xml version="1.0" encoding="utf-8"?>
<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:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.broadpeakit.hmehmood.company.HomeActivity"
tools:showIn="#layout/app_bar_home">
<FrameLayout
android:id="#+id/fl_testing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"></FrameLayout>
</RelativeLayout>
Step 3 - Now Create another layout with name viewPager_fragment that will contain your view pager with tabs and we'll inflate this layout later.
<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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:paddingLeft="0dp"
android:paddingRight="0dp"
android:paddingTop="0dp"
android:paddingBottom="0dp">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/blue"
app:tabTextColor="#color/white"
app:tabSelectedTextColor="#color/gray"
app:tabIndicatorColor="#color/red"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tabs"/>
</RelativeLayout>
Step 4 - Now create a class with name viewPagerFragment and extends it with Fragment. we'll inflate this Fragment later in your Main Activity.
public class viewPagerFragment extends Fragment {
private TabLayout tabLayout;
private ViewPager viewPager;
TabsTestFragment1 tabsTestFragment1;
TabsTestFragment2 tabsTestFragment2;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
// Inflate the layout for this fragment
setHasOptionsMenu(true);
return inflater.inflate(R.layout.viewPager_fragment, container, false);
}
#Override
public void onViewCreated(View view, Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
((HomeActivity)getActivity()).updateDrawerIcon();
tabsTestFragment1 = new TabsTestFragment1();
tabsTestFragment2 = new TabsTestFragment1();
viewPager = (ViewPager) view.findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout)view.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
public void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getChildFragmentManager());
adapter.addFragment(tabsTestFragment1, "Tab 1");
adapter.addFragment(tabsTestFragment2, "Tab 2");
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 5 - Now place this code in onCreate of your Main Activity.
getSupportFragmentManager().beginTransaction().setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN).replace(R.id.fl_testing, new viewPagerFragment()).commit();
Now you are good to RUN your code. Get back to me if you have any issue later. Also mark this issue as solved if you are able to solve your issue using this code. Happy Coding :)
Change your Main Activity with this one
<?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"
android:id="#+id/tabanim_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/header"
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|snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</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>

Problems with the scrolling in a expandable list view inside a viewpager - Android

I have an aplication with a toolbar and an tab layout in appcompat v7. I navegate across the tabs with a View Pager, but the problem is where put an Expandable List View inside, doesn't scroll: this is my Java code from the principal activity
The minimal API is 15: Android Ice Cream Sandwicth 4.0.4
public class Principal extends AppCompatActivity{
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_principal);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final TabLayout Tabulacion = (TabLayout) findViewById(R.id.Tabulacion);
final ViewPager viewPager = (ViewPager) findViewById(R.id.Pager);
final PagerAdapter adapter = new PagerAdapter(getSupportFragmentManager(), Tabulacion.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(Tabulacion));
Tabulacion.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) {
}
});
}
the Java code from the PagerAdapter
public class PagerAdapter extends FragmentStatePagerAdapter {
int intNumTabs;
public PagerAdapter(FragmentManager FM, int NumTabs) {
super(FM);
this.intNumTabs = NumTabs;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
TabHome Tab1 = new TabHome();
return Tab1;
case 1:
TabLectura Tab2 = new TabLectura();
return Tab2;
default:
return null;
}
}
#Override
public int getCount() {
return intNumTabs;
}
}
the XML code from the principal activity
<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=".Principal">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:id="#+id/textView">
<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.TabLayout
android:id="#+id/Tabulacion"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Inicio">
</android.support.design.widget.TabItem>
<android.support.design.widget.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lectura">
</android.support.design.widget.TabItem>
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/Pager"
android:isScrollContainer="true"
android:nestedScrollingEnabled="true"
android:background="#color/backgroundColor" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
the XML code from the tab 2 fragment:
<ExpandableListView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ListView">
</ExpandableListView>
The content of the Expandable List View is dynamic generated
I solve it! I extract the view pager from the app coordinator layout in the XML, there is the final code
<?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:orientation="vertical"
tools:context=".Principal">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
android:id="#+id/textView">
<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.TabLayout
android:id="#+id/Tabulacion"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Inicio">
</android.support.design.widget.TabItem>
<android.support.design.widget.TabItem
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Lectura">
</android.support.design.widget.TabItem>
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/Pager"
android:background="#color/backgroundColor" />
</LinearLayout>
Use a recyclerview instead of listview. I have implemented it in a view pager and it works perfectly. Recyclerview does virtually everything that a listview does and much more.

Categories

Resources