how to change imageview in CollapsingToolbarLayout depending on each Fragment? - android

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) {
}
});
}

Related

Recycler view inside Tab layout giving null point exception

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.

Android does not show tabs

I am in a process of changing home activity to include tabs. I use https://github.com/saulmm/CoordinatorExamples as a source. For unknown reason I do not see the tabs in my AppBarLayout. I can see the Fragment content but tab headers are not displayed at all. I use appcompat-v7:23.3.0.
Shortened layout:
<android.support.design.widget.CoordinatorLayout
<android.support.design.widget.AppBarLayout
<android.support.design.widget.CollapsingToolbarLayout
<ImageView ..
<android.support.v7.widget.Toolbar ..
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/main.tabs"
android:layout_width="fill_parent"
android:layout_height="?attr/actionBarSize"
app:tabSelectedTextColor="?android:attr/textColorPrimaryInverse"
app:tabIndicatorColor="?android:attr/textColorPrimaryInverse"
app:tabIndicatorHeight="4dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/dashboard.viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
Activity:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_dashboard);
CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.main_collapsing);
collapsingToolbarLayout.setTitle(getString(R.string.app_name));
ViewPager viewPager = (ViewPager) findViewById(R.id.dashboard_viewpager);
viewPager.setAdapter(new TabsAdapter(getSupportFragmentManager()));
TabLayout tabLayout = (TabLayout) findViewById(R.id.main_tabs);
tabLayout.setupWithViewPager(viewPager);
}
class TabsAdapter extends FragmentPagerAdapter {
public TabsAdapter(FragmentManager fm) {
super(fm);
}
public int getCount() {
return 1;
}
public Fragment getItem(int i) {
switch(i) {
case 0: return DashboardHomeFragment.newInstance();
}
return null;
}
public CharSequence getPageTitle(int position) {
return "Home";
}
}
Fragment:
public class DashboardHomeFragment extends Fragment implements View.OnClickListener {
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_dashboard_home, container, false);
}
public void onActivityCreated(#Nullable Bundle state) {
log.debug("onActivityCreated()");
super.onActivityCreated(state);
}
and its layout:
<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="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hry"
android:textAppearance="#style/TextAppearance.Header"
android:paddingRight="8dp"
android:paddingLeft="8dp"
style="#style/TextComponent.ItemRow"/>
<TextView
android:id="#+id/main.button.puzzle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Najdi výsledek"
android:textAppearance="#style/TextAppearance.Item"
android:drawableRight="#drawable/ic_arrow_forward_24dp"
style="#style/TextComponent.ItemRow.Selectable"/>
There is a second problem but I will post it in separate question linked to this question.
Update:
It was caused by CoordinatorLayout misconfiguration. I changed:
android:layout_height="150dp"
to
android:layout_height="wrap_content"
and the tabs appeared suddenly.
According to the guidelines of Android and the material design, it is correct to use the coordinatorLayout.
The appBarLayout should be max 256dp and inside we find the toolbar and the views that you need.
If you want the views collapsing insert into collapsingToolbarLayout.
If you want the toolbar expandable will be inserted inside the collapsingToolbarLayout.
The tabLayout often is insert into appBarLayout but out collapsingToolbarLayout.
The sum of views height is equals at appBarLayout height (or use wrap_content for appBarLayout).
This is an example of expandable toolbar with tabLayout, in this case appBarLayout has a fixed height but you can use wrap_content.
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="202dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#color/your_color"
android:fitsSystemWindows="true">
<--Your views-->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="top"
app:titleMarginTop="13dp"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:background="#color/your_color"
app:tabSelectedTextColor="#color/your_color"
app:tabTextColor="#color/your_color"
app:tabIndicatorColor="#color/your_color"
app:tabMode="fixed"
app:tabGravity="fill"
/>
</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.

Cannot scroll RecyclerView inside a Fragment?

I am having troubles integrating a RecyclerView (using cardviews for the rows) inside a fragment. For some reason I cannot scroll the card view? Please, any suggestions?
This is my app design:
This is my fragment code:
public class PageFragment2 extends Fragment {
public static final String ARG_PAGE2 = "ARG_PAGE";
private int mPage2;
public static PageFragment2 newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE2, page);
PageFragment2 fragment = new PageFragment2();
fragment.setArguments(args);
return fragment;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage2 = getArguments().getInt(ARG_PAGE2);
Log.d("MainActivity", "onCreate" + mPage2);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_page2,container,false);
RecyclerView recList = (RecyclerView) view;
recList.setHasFixedSize(true);
LinearLayoutManager llm = new LinearLayoutManager(getActivity());
recList.setLayoutManager(llm);
ArrayList<String> names = new ArrayList<>();
names.add("Georgi Koemdzhiev");
names.add("Mariya Menova");
names.add("Simeon Simeonov");
names.add("Ivan Dqkov");
names.add("Dymityr Vasilev");
names.add("Petar Dimov");
CardAdapter adapter = new CardAdapter(names);
recList.setAdapter(adapter);
Log.d("MainActivity","onCreateView" + mPage2);
return view;
}
}
This is my fragment XML code:
<android.support.v7.widget.RecyclerView
android:id="#+id/cardList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="true"
xmlns:android="http://schemas.android.com/apk/res/android"/>
My activity_main layout:
<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="koemdzhiev.com.newtablayouttest.MainActivity">
<android.support.design.widget.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"/>
<android.support.design.widget.TabLayout
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" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main"/>
The Activity from the "Tabbed Activity" template, which contains the ViewPager which is containing your Fragment, uses an AppBarLayout.
This AppBarLayout is stealing the vertical movement, since it doesn't know there's a scrollable nested view (the RecyclerView) inside the ViewPager. Remove the AppBarLayout from the XML file of your Activity (you can take the TabLayout and ToolBar to the upper level).

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" />

Categories

Resources