Add image on 3 tabs

Add image on 3 tabs - android

How can I add images into tab ? Currently I'm able to move the tab to bottom but have no idea on how to change the LL Tab1, LL Tab2, LL Tab3 to icon.Am I on the right path ? Any help would be greatly appreciated.
xml code
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="5dp" >
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:padding="5dp"
android:layout_weight="1" >
<LinearLayout
android:id="#+id/ll_tab1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
<LinearLayout
android:id="#+id/ll_tab2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
<LinearLayout
android:id="#+id/ll_tab3"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" />
</FrameLayout>
<TabWidget
android:id="#android:id/tabs"
android:background="#color/light_gray"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"/>
</LinearLayout>
</TabHost>
Anyone can help? Thanks a lot !

Try using TabLayout from Android Design Support Library to meet material design guidelines for tabs.
The Design library’s TabLayout implements both fixed tabs, where the
view’s width is divided equally between all of the tabs, as well as
scrollable tabs, where the tabs are not a uniform size and can scroll
horizontally.
To implement TabLayout check this guide and how to add the icon for swipeable tabs to set icons to tabs using setIcon.
final int[] ICONS = new int[]{
R.drawable.ic_action_document,
R.drawable.ic_action_tick,
R.drawable.ic_action_trash};
....
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
tabLayout.getTabAt(0).setIcon(ICONS[0]);
tabLayout.getTabAt(1).setIcon(ICONS[1]);
tabLayout.getTabAt(2).setIcon(ICONS[2]);
To set the tabs at the bottom in a TabLayout check - How can I set tabs at the bottom and also hide top actionbar? where you put the TabLayout in a relativeLayout and align it to parent bottom:
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
app:tabMode="fixed"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
app:tabTextColor="#d3d3d3"
app:tabSelectedTextColor="#ffffff"
app:tabIndicatorColor="#ff00ff"
android:minHeight="?attr/actionBarSize"
android:layout_alignParentBottom="true"
/>
Although you can put your tab layout at the bottom, try not to use bottom tab bars if possible as per the Pure Android guide.
Other platforms use the bottom tab bar to switch between the app's
views. Per platform convention, Android's tabs for view control are
shown in action bars at the top of the screen instead.

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.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
private int[] tabIcons = {
R.drawable.ic_tab_favourite,
R.drawable.ic_tab_call,
R.drawable.ic_tab_contacts
};
#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);
setupTabIcons();
}
private void setupTabIcons() {
tabLayout.getTabAt(0).setIcon(tabIcons[0]);
tabLayout.getTabAt(1).setIcon(tabIcons[1]);
tabLayout.getTabAt(2).setIcon(tabIcons[2]);
}
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);
}
}
}
Layout for Tab
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.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="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>
Fragments(Class) used in this tab
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class OneFragment extends Fragment{
public OneFragment() {
// Required empty public constructor
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_one, container, false);
}
}
Xml file
fragment_one.xml
<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"
tools:context=".fragments.OneFragment">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/one"
android:textSize="40dp"
android:textStyle="bold"
android:layout_centerInParent="true"/>
</RelativeLayout>
TwoFragment.java
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class TwoFragment extends Fragment{
public TwoFragment() {
// Required empty public constructor
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_two, container, false);
}
}
fragment_two.xml
<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"
tools:context=".fragments.TwoFragment">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/one"
android:textSize="40dp"
android:textStyle="bold"
android:layout_centerInParent="true"/>
</RelativeLayout>
You can create third fragment class, and layout as i have done above.
Run it. Hope this would work

Try this,
puth this activity_main.xml and set the custom height to TabLayout.
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="#dimen/custom_tab_layout_height"
app:tabMode="fixed"
app:tabGravity="fill"/>
Create an xml layout named custom_tab.xml under res ⇒ layout. In this layout we have defined the custom view for the tab.
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tab"
android:textColor="#color/colorAccent"
android:textSize="#dimen/tab_label"
android:fontFamily="#string/font_fontFamily_medium"/>
Open MainActivity.java and modify the code as below. Here if you observe setupTabIcons() method, I have rendered custom_tab.xml layout in each tab using below lines of code.
TextView tabOne = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabOne.setText("ONE");
tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_favourite, 0, 0);
tabLayout.getTabAt(0).setCustomView(tabOne);
TextView tabTwo = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabTwo.setText("TWO");
tabTwo.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_call, 0, 0);
tabLayout.getTabAt(1).setCustomView(tabTwo);
TextView tabThree = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
tabThree.setText("THREE");
tabThree.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_contacts, 0, 0);
tabLayout.getTabAt(2).setCustomView(tabThree);

Try this,Really interesting.Must be the solution
http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/

Well you can either place an ImageView in your Linearlayout that is each tab, or you can set an drawable as a background for your LinearLayout. If your image will act a background then you will obviously want to add that image as a background and not add an ImageView as a child to your LinearLayout. If it is going to be content though, not a background, you should add an ImageView to each LinearLayout like you would add a child of any other type to a parent View.

Related

Fragment content not visible on adding it to view pager of an activity?

I have put viewpager in an activity and view pager contains 3 fragments but on running app it doesn't show the fragment related data.Following is the aatached code, please help.
Its not throwing any error but the fragment content is not visible though the tab-titles are visible. I saw certain links where they ask you to add getChildFragmentManager() but after searching i got to know that its not supported in activity.
MainActivity.java
package kbg.com.kbgpos;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v4.widget.DrawerLayout;
import android.support.v7.app.ActionBarDrawerToggle;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.Toolbar;
public class MainActivity extends AppCompatActivity {
Toolbar toolbar;
DrawerLayout drawerLayout;
ActionBarDrawerToggle actionBarDrawerToggle;
TabLayout tabLayout;
ViewPager viewPager;
ViewPagerAdapter viewPagerAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar=(Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
drawerLayout=(DrawerLayout) findViewById(R.id.drawer_layout);
actionBarDrawerToggle=new ActionBarDrawerToggle(this,drawerLayout,toolbar,R.string.drawer_open,R.string.drawer_close);
actionBarDrawerToggle.getDrawerArrowDrawable().setColor(getResources().getColor(R.color.hamburgerColor));
drawerLayout.setDrawerListener(actionBarDrawerToggle);
tabLayout=(TabLayout) findViewById(R.id.tabLayout);
viewPager=(ViewPager) findViewById(R.id.viewPager);
viewPagerAdapter=new ViewPagerAdapter(getSupportFragmentManager());
viewPagerAdapter.addFragments(new Personal_Info_Fragment(),"Personal Info");
viewPagerAdapter.addFragments(new EducationalExperience_Info_Fragment(),"Edu & Exp Info");
viewPagerAdapter.addFragments(new OtherInfo_Fragment(),"Official Info");
viewPager.setAdapter(viewPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
}
#Override
protected void onPostCreate(#Nullable Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
actionBarDrawerToggle.syncState();
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
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:id="#+id/drawer_layout">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
android:layout_height="wrap_content"
android:layout_width="match_parent"
layout="#layout/toolbar_layout"
android:id="#+id/toolbar"></include>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabLayout"
app:tabMode="fixed"
app:tabGravity="fill"
android:background="#b3d9ff"
app:tabTextAppearance="#style/TabLayoutStyle">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/viewPager">
</android.support.v4.view.ViewPager>
<android.support.design.widget.NavigationView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/navigation_view"
android:layout_gravity="start"
app:headerLayout="#layout/navigation_drawer_header"
app:itemIconTint="#006699"
app:menu="#menu/drawer_menu">
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
Personal_Info_Fragment
package kbg.com.kbgpos;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class Personal_Info_Fragment extends Fragment {
public Personal_Info_Fragment() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_personal__info_, container, false);
}
}
ViewPagerAdapter.java
package kbg.com.kbgpos;
import android.content.Context;
import android.support.annotation.Nullable;
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> fragments=new ArrayList<>();
ArrayList<String> tabTitles=new ArrayList<>();
public void addFragments(Fragment fragments,String titles){
this.fragments.add(fragments);
this.tabTitles.add(titles);
}
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
return fragments.get(position);
}
#Override
public int getCount() {
return fragments.size();
}
#Nullable
#Override
public CharSequence getPageTitle(int position) {
return tabTitles.get(position);
}
}
fragment_personal__info_.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".Personal_Info_Fragment">
<android.support.v7.widget.CardView
android:id="#+id/info_cardView"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_margin="5dp"
card_view:cardElevation="2dp"
card_view:contentPadding="5dp"
card_view:cardCornerRadius="2dp"
card_view:cardBackgroundColor="#e5c68b">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/infoIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_info_black_24dp"
android:layout_centerVertical="true"
android:layout_marginRight="2dp"/>
<TextView
android:layout_toRightOf="#id/infoIcon"
android:layout_marginLeft="4dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Please Enter Complete and Valid Information Within the Forms As This Will Be Treated As Final Info"
android:textColor="#android:color/white"
android:textSize="14sp"
android:textAllCaps="true"
android:textStyle="bold"/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</FrameLayout>
Please help as how can i see the content of fragments on viewpager tabs which are shown empty at the moment.

A DrawerLayout is supposed to have 2 children, the main content and the navigation view.
In your case you have 3 children:
<DrawerLayout ...>
<AppBarLayout />
<ViewPager />
<NavigationView />
</DrawerLayout>
So try to wrap the AppBarLayout and ViewPager into a LinearLayout so that in the end the DrawerLayout to have just 2 children as expected.
<DrawerLayout ...>
<LinearLayout orientation="vertical">
<AppBarLayout />
<ViewPager />
</LinearLayout>
<NavigationView />
</DrawerLayout>

Strange behavior of tabs

I have used normal tabLayout with viewpager. I am using custom tabs for the tabLayout. But some strange behavior happens in tabs.
As you can see there is space between first two tabs but there is no space between second and third tabs.
Note : In third tab I have set the visibility of arrow imageview to gone. That is not an issue.
My tablayout screen layout file :
<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.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="center"
app:tabIndicatorHeight="3dp"
app:tabPaddingStart="0dp"
app:tabPaddingEnd="0dp"
android:layout_marginTop="#dimen/margin_15"
app:tabIndicatorColor="#color/colorTransperent"
app:tabMode="fixed"
app:tabTextAppearance="?android:attr/textAppearanceMedium" />
<com.smartcompliant.views.CustomPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Custom tabs :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal">
<TextView
android:id="#+id/tvTabTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:text="#tools:sample/lorem"
android:textSize="#dimen/font_14"/>
<ImageView
android:id="#+id/ivArrow"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:src="#drawable/ic_right"/>
</LinearLayout>
In java file inflating tabs like :
View v = LayoutInflater.from(getContext()).inflate(R.layout.cust_tabs, null);
tabForm = (TextView) v.findViewById(R.id.tvTabTitle);
tabForm.setText(getResources().getString(R.string.form));
tabForm.setTextColor(getContext().getResources().getColor(R.color.colorGreen));
tabLayout.getTabAt(0).setCustomView(v);
So basically two issues :
Space between tabs to be equal.
In some small device screen tab gravity center is not working.
Let me know if any code required. Thank you :)

Try this
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="center"
app:tabIndicatorHeight="3dp"
app:tabPaddingStart="0dp"
app:tabPaddingEnd="0dp"
android:layout_marginTop="15dp"
app:tabIndicatorColor="#android:color/transparent"
app:tabMode="scrollable"
app:tabTextAppearance="?android:attr/textAppearanceMedium" />
custom tab layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:gravity="center"
android:orientation="horizontal">
<TextView
android:id="#+id/tvTabTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="14sp"
tools:text="#tools:sample/lorem" />
<ImageView
android:id="#+id/ivArrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_right" />
</LinearLayout>
set tab icon
public void setTab(){
View v = LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
TextView tabForm = (TextView) v.findViewById(R.id.tvTabTitle);
tabForm.setText("Fill details");
tabLayout.getTabAt(0).setCustomView(v);
View v2 = LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
TextView tabForm2 = (TextView) v2.findViewById(R.id.tvTabTitle);
tabForm2.setText("Select photo");
tabLayout.getTabAt(1).setCustomView(v2);
View v3 = LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
TextView tabForm3 = (TextView) v3.findViewById(R.id.tvTabTitle);
tabForm3.setText("submit");
ImageView imageView=v3.findViewById(R.id.ivArrow);
imageView.setVisibility(View.INVISIBLE);
tabLayout.getTabAt(2).setCustomView(v3);
}

EDITED For fixed tabMode to work, you need to make imageview invisible and not gone.
GONE will not take any space in you UI hierarchy, where are INVISIBLE will still be there in UI hierarchy but not visible. In your original implementation can you please replace GONE => INVISIBLE based on your logic
MainActivity.java
package in.silentsudo.shoppingcardnavigation;
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.FragmentStatePagerAdapter;
import android.support.v4.content.ContextCompat;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
public class MainActivity extends AppCompatActivity implements TabLayout.OnTabSelectedListener {
private ViewPager viewPager;
private TabLayout tabLayout;
private String[] titles = new String[]{
"File details", "Select Photo", "Submit"
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
tabLayout = findViewById(R.id.tab_layout);
viewPager = findViewById(R.id.view_pager);
final FormDetailsViewAdapter adapter = new FormDetailsViewAdapter(getSupportFragmentManager());
adapter.addPage(new PlaceHolderFragment());
adapter.addPage(new PlaceHolderFragment());
adapter.addPage(new PlaceHolderFragment());
viewPager.setAdapter(adapter);
tabLayout.addTab(tabLayout.newTab());
tabLayout.addTab(tabLayout.newTab());
tabLayout.addTab(tabLayout.newTab());
tabLayout.setupWithViewPager(viewPager);
final LayoutInflater inflater = LayoutInflater.from(this);
for (int i = 0; i < 3; i++) {
View v = inflater.inflate(R.layout.item_tab, tabLayout, false);
TextView txtView = (TextView) v.findViewById(R.id.txt);
ImageView img = (ImageView) v.findViewById(R.id.img);
txtView.setText(titles[i]);
txtView.setTextColor(ContextCompat.getColor(this, R.color.tab_color_unselected));
img.setImageResource(R.drawable.ic_right_unselected);
if(i == 2) {
img.setVisibility(View.INVISIBLE);
}
tabLayout.getTabAt(i).setCustomView(v);
}
tabLayout.getTabAt(0).select();
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.addOnTabSelectedListener(this);
tabLayout.post(new Runnable() {
#Override
public void run() {
onTabSelected(tabLayout.getTabAt(0));
}
});
}
#Override
public void onTabSelected(TabLayout.Tab tab) {
System.out.println("Tab selected : " + tab.getPosition());
View customView = tab.getCustomView();
TextView txtView = (TextView) customView.findViewById(R.id.txt);
ImageView img = (ImageView) customView.findViewById(R.id.img);
txtView.setTextColor(ContextCompat.getColor(this, R.color.tab_color_selected));
img.setImageResource(R.drawable.ic_right_selected);
}
#Override
public void onTabUnselected(TabLayout.Tab tab) {
System.out.println("Tab unselected : " + tab.getPosition());
View customView = tab.getCustomView();
TextView txtView = (TextView) customView.findViewById(R.id.txt);
ImageView img = (ImageView) customView.findViewById(R.id.img);
txtView.setTextColor(ContextCompat.getColor(this, R.color.tab_color_unselected));
img.setImageResource(R.drawable.ic_right_unselected);
}
#Override
public void onTabReselected(TabLayout.Tab tab) {
System.out.println("Tab reselected : " + tab.getPosition());
}
}
class FormDetailsViewAdapter extends FragmentStatePagerAdapter {
private List<Fragment> list;
public FormDetailsViewAdapter(FragmentManager fm) {
super(fm);
list = new ArrayList<>();
}
public void addPage(Fragment fragment) {
list.add(fragment);
}
#Override
public Fragment getItem(int position) {
return list.get(position);
}
#Override
public int getCount() {
return list.size();
}
#Override
public CharSequence getPageTitle(int position) {
return "Fragment " + position;
}
}
activity_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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="in.silentsudo.shoppingcardnavigation.MainActivity">
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_alignParentBottom="true"
android:background="#ffffff"
app:tabGravity="fill"
app:tabIndicatorColor="#android:color/transparent"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorAccent" />
</LinearLayout>
item_tab.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:padding="4dp"
android:orientation="horizontal">
<TextView
android:id="#+id/txt"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="10sp"
android:text="This is text" />
<ImageView
android:id="#+id/img"
android:layout_width="18dp"
android:layout_height="18dp"
android:layout_marginStart="8dp"
android:src="#drawable/ic_right_selected" />
</LinearLayout>
PlaceHolderFragment.java
public class PlaceHolderFragment extends Fragment {
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
return inflater.inflate(R.layout.layout_fragment_place_holder, container, false);
}
}
fragment_place_holder.xml
<?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">
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:text="This is place holder fragment" />
</RelativeLayout>
ic_right_selected.xml
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android" android:height="18dp" android:viewportHeight="24.0" android:viewportWidth="24.0" android:width="18dp">
<path android:fillColor="#1DE9B6" android:pathData="M8.59,16.34l4.58,-4.59 -4.58,-4.59L10,5.75l6,6 -6,6z"/>
</vector>
ic_right_unselected.xml
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="18dp"
android:height="18dp"
android:viewportHeight="24.0"
android:viewportWidth="24.0">
<path
android:fillColor="#BDBDBD"
android:pathData="M8.59,16.34l4.58,-4.59 -4.58,-4.59L10,5.75l6,6 -6,6z" />
</vector>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#3F51B5</color>
<color name="colorPrimaryDark">#303F9F</color>
<color name="colorAccent">#FF4081</color>
<color name="tab_color_selected">#1DE9B6</color>
<color name="tab_color_unselected">#BDBDBD</color>
</resources>

Android Fragments not showing up Text view and internal elements

I am new to android.I created a tablayout and a viewpager with two fragments.I have elements/items in my created Detail Fragment and a TextView in my measure fragment but when i run the code on my mobile,nothing is shown in my fragment.I haven't java code of my fragment.Everything works fine on the tablayout..i can switch between the tab but nothing is being shown in my fragments...why is that happening?
My Activity:
<?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"
tools:context="com.example.update">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
>
<!--<include android:layout_height="wrap_content"
android:layout_width="match_parent"
layout="#layout/toolbar_layout"/>-->
<include
android:id="#+id/update_screen_toolbar"
layout="#layout/toolbar_layout"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:id="#+id/name_age_gender"
android:background="#d3d3d3"
android:layout_below="#+id/update_screen_toolbar"/>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabLayout"
app:tabMode="fixed"
app:tabGravity="fill">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/viewPager">
</android.support.v4.view.ViewPager>
</RelativeLayout>
JAVA code for activity
package com.example.update;
import android.content.Intent;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;
import android.widget.Toast;
public class UpdateDetail extends AppCompatActivity {
TabLayout tabLayout;
ViewPager viewPager;
ViewPagerAdapter viewPagerAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_detail);
tabLayout=(TabLayout)findViewById(R.id.tabLayout);
viewPager=(ViewPager)findViewById(R.id.viewPager);
viewPagerAdapter=new ViewPagerAdapter(getSupportFragmentManager());
viewPagerAdapter.addFragments(new DetailFragment()," DETAIL");
viewPagerAdapter.addFragments(new MeasureFragment(),"MEASURE");
viewPager.setAdapter(viewPagerAdapter);
tabLayout.setupWithViewPager(viewPager);
}
}
code for DetailFragment:
<FrameLayout 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="com.example.DetailFragment">
<!-- TODO: Update blank fragment layout -->
<Button
android:id="#+id/expandableButton4"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#066da1"
android:drawableRight="#android:drawable/arrow_down_float"
android:onClick="expandableButton4"
android:paddingRight="10dp"
android:text="Expand/Collapse Android Example"
android:textColor="#fff" />
<com.github.aakira.expandablelayout.ExpandableRelativeLayout
android:id="#+id/expandableLayout4"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/expandableButton4"
android:background="#90066da1"
android:padding="16dp"
app:ael_duration="400"
app:ael_expanded="false"
app:ael_interpolator="bounce"
app:ael_orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Implements the expand and collapse by sliding logic for a top or a bottom view in a two children view or layout or any widgets composition.
Implements the expand and collapse by sliding logic for a top or a bottom view in a two children view or layout or any widgets composition." />
</com.github.aakira.expandablelayout.ExpandableRelativeLayout>
</FrameLayout>

Try this one:
public class FriendshipParentFragment extends Fragment {
#BindView(R.id.tabs)
TabLayout tabs;
#BindView(R.id.viewpager)
ViewPager viewPager;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_friendship_parent, container, false);
ButterKnife.bind(this, view);
initTabs();
return view;
}
private void initTabs(){
viewPager.setAdapter(new TabsAdapter(getChildFragmentManager()));
tabs.setupWithViewPager(viewPager);
tabs.getTabAt(0).setText("Tab1");
tabs.getTabAt(1).setText("Tab2");
tabs.setTabTextColors(ContextCompat.getColor(getActivity(), R.color.colorAccent), ContextCompat.getColor(getActivity(), R.color.colorBottomNavigationPrimary));
tabs.setSelectedTabIndicatorColor(ContextCompat.getColor(getActivity(), R.color.white));
tabs.setSelectedTabIndicatorHeight(4);
}
public class TabsAdapter extends FragmentPagerAdapter {
public TabsAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position){
case 0:
return new FollowersFragment();
case 1:
return new FollowFragment();
}
return null;
}
#Override
public int getCount() {
return 2;
}
}
}
xml file
<LinearLayout 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:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="owo.owocar.driver.OrdersParentFragment">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dp"
android:elevation="4dp"
app:tabGravity="fill" />
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:id="#+id/viewpager"
android:layout_height="match_parent"></android.support.v4.view.ViewPager>

Align Icons in Tab Layout To The Left

Hello I have created a tab layout in my activity. This is the main .xml file:
<?xml version="1.0" encoding="utf-8"?>
<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="com.xxxxxx.eventmanager.EventDetailsActivity">
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:id="#+id/toolbarContainer"
android:theme="#style/AppTheme.AppBarOverlay">
<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"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbarContainer"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
app:tabTextColor="#color/colorLight"
app:tabSelectedTextColor="#color/colorAccent"
android:textAlignment=""
android:theme="#style/AppTheme"/>
<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>
And this is my .java class:
package com.xxxxxx.eventmanager;
import android.graphics.drawable.Drawable;
import android.support.design.widget.TabLayout;
import android.support.v13.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import com.xxxxxx.eventmanager.adapters.EventPagerAdapter;
public class EventDetailsActivity extends AppCompatActivity {
/**
* The {#link android.support.v4.view.PagerAdapter} that will provide
* fragments for each of the sections. We use a
* {#link FragmentPagerAdapter} derivative, which will keep every
* loaded fragment in memory. If this becomes too memory intensive, it
* may be best to switch to a
* {#link android.support.v13.app.FragmentStatePagerAdapter}.
*
* private SectionsPagerAdapter mSectionsPagerAdapter;
*
*/
private Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_event_details);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Details").setIcon(R.mipmap.ic_details));
tabLayout.addTab(tabLayout.newTab().setText("Sales").setIcon(R.mipmap.ic_sales));
tabLayout.addTab(tabLayout.newTab().setText("Purchases").setIcon(R.mipmap.ic_purchase));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final EventPagerAdapter adapter = new EventPagerAdapter
(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) {
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.menu_event_details, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
// Handle action bar item clicks here. The action bar will
// automatically handle clicks on the Home/Up button, so long
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();
//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
Now currently the tab displays like this:
However now I would like the icons to display on the left hand side of the text instead of on top of the text.

I have exact solution which you guys want.
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:textAlignment="textStart"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:tabInlineLabel="true"
app:tabPaddingStart="#dimen/default_10dp">
Using below property you can achive desire result.
app:tabInlineLabel="true"

Just add this line to your TabLayout in XML
app:tabInlineLabel="true"

The answer given by #Tjerkw is ok just that it doesn't loop through the entire tab. I guess the right solution should be this
for (int i = 0; i < tabLayout.getTabCount(); i++ ) {
yourlinearlayout = (LinearLayout) LayoutInflater.from(getContext()).inflate(R.layout.title_text, null);
tab_text = (TextView) yourlinearlayout.findViewById(R.id.tabContent);
tab_text.setText(" " + tab_titles[i]);
tab_text.setCompoundDrawablesWithIntrinsicBounds(tabicons[i], 0, 0, 0);
tabLayout.getTabAt(i).setCustomView(tab_text);}
and the layout resource .xml representing R.layout.title_text will be
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<TextView
android:id="#+id/tabContent"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textAlignment="center"
android:textColor="#android:color/white"
android:gravity="center"/>
finally, the tabicons[i] and tab tab_titles[i] are just String arrays containing their respective contents.
I know this question's old but i recently faced this and i'm sure someone else might still need this

TabLayout also support custom views instead of TabView.
1.Create your tab item layout.The main idea is we should use specify id
for ImageView #android:id/icon and for TextView #android:id/text1
R.layout.custom_tab_item
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/color_app_background"
android:gravity="center"
android:orientation="horizontal">
<ImageView
android:id="#android:id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/appoinments_" />
<com.app.barber.views.CustomTextView
android:id="#android:id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:paddingBottom="#dimen/_8sdp"
android:paddingLeft="#dimen/_5sdp"
android:paddingTop="#dimen/_8sdp"
android:text="#string/title_appointments"
android:textColor="#color/color_white"
android:textSize="#dimen/_12ssp" />
</LinearLayout>
2. And TabLayout xml file
<android.support.design.widget.TabLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:tabMaxWidth="0dp"
app:tabGravity="fill"
app:tabMode="fixed"
android:theme="#style/vocabularyTheme.ActionBar" />
3. Create tabLayout using custom views, and remove bottom margin, which was set up by default 8dp
mTabLayout = (TabLayout) findViewById(R.id.tab_layout);
mTabLayout.addTab(createTab(text1,icon1));
mTabLayout.addTab(createTab(text2,icon2));
private TabLayout.Tab createTab(String text, Drawable icon){
TabLayout.Tab tab = mTabLayout.newTab().setText(text).setIcon(icon).setCustomView(R.layout.custom_tab_item);
// remove imageView bottom margin
if (tab.getCustomView() != null){
ImageView imageView = (ImageView) tab.getCustomView().findViewById(android.R.id.icon);
ViewGroup.MarginLayoutParams lp = ((ViewGroup.MarginLayoutParams) imageView.getLayoutParams());
lp.bottomMargin = 0;
imageView.requestLayout();
}
return tab;
}
Expected result.

Use a custom view:
TextView newTab = (TextView) LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
newTab.setText("tab1"); //tab label txt
newTab.setCompoundDrawablesWithIntrinsicBounds(your_drawable_icon_here, 0, 0, 0);
tabLayout.getTabAt(tab_index_here_).setCustomView(newTab);

You have to introduce ActionMenuView inside Toolbar.
From Google Official docs "ActionMenuView is a presentation of a series of menu options as a View. It provides several top level options as action buttons while spilling remaining options over as items in an overflow menu. This allows applications to present packs of actions inline with specific or repeating content."
Eg,
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/tToolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
android:background="?attr/colorPrimary"
android:gravity="center_vertical|start"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<android.support.v7.widget.ActionMenuView
android:id="#+id/amvMenu"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
</android.support.v7.widget.Toolbar>
And on your Activity,
Toolbar t = (Toolbar) findViewById(R.id.tToolbar);
amvMenu = (ActionMenuView) t.findViewById(R.id.amvMenu);
amvMenu.setOnMenuItemClickListener(new ActionMenuView.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem menuItem) {
return onOptionsItemSelected(menuItem);
}
});

Last Item on Listview is cut off

So in my Android app I have where the main activity has tabs and in each tab there is a fragment containing a listview. But for some reason the last item in the listview always gets cut off. I have looked around for solutions but I havent found any yet. Any suggestions?
Main Activity layout
<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/rl"
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.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="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>
Fragment with ListView
<?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"
android:orientation="vertical">
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
style="#style/Widget.AppCompat.ProgressBar" />
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<ListView
android:id="#+id/list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
style="#style/Widget.AppCompat.ProgressBar"></ListView>
</LinearLayout>
</RelativeLayout>
List Item Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="2dp"
android:layout_margin="5dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/title"
android:textSize="20sp"
android:textStyle="bold"
android:typeface="normal"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/author"
android:textSize="15sp"
android:typeface="normal"
android:layout_below="#+id/publishdate"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="New Text"
android:id="#+id/publishdate"
android:textSize="15sp"
android:typeface="normal"
android:layout_below="#+id/title"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</LinearLayout>
List Adapter Class
package com.czhou.dailyprincetoniannewspaper.adapters;
import android.content.ClipData;
import android.content.Context;
import android.graphics.Paint;
import android.util.Log;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;
import com.czhou.dailyprincetoniannewspaper.NewspaperMetaObject;
import com.czhou.dailyprincetoniannewspaper.R;
import java.util.List;
public class NewsListAdapter extends ArrayAdapter<NewspaperMetaObject> {
static class ViewHolder {
TextView author;
TextView publishdate;
TextView title;
}
private LayoutInflater inflater;
List<NewspaperMetaObject> newsitems;
public NewsListAdapter(Context context, List<NewspaperMetaObject> items) {
super(context, R.layout.newslistitem, items);
this.newsitems = items;
inflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public View getView(int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder;
if (convertView == null) {
convertView = inflater.inflate(R.layout.newslistitem, parent, false);
viewHolder = new ViewHolder();
viewHolder.title = (TextView) convertView.findViewById(R.id.title);
viewHolder.author = (TextView) convertView.findViewById(R.id.author);
viewHolder.publishdate = (TextView) convertView.findViewById(R.id.publishdate);
convertView.setTag(viewHolder);
} else {
viewHolder = (ViewHolder) convertView.getTag();
}
viewHolder.title.setText(newsitems.get(position).getArticleTitle());
viewHolder.title.setPaintFlags(Paint.UNDERLINE_TEXT_FLAG);
viewHolder.publishdate.setText(newsitems.get(position).getArticlePublishDate());
viewHolder.author.setText(newsitems.get(position).getArticleAuthor());
System.out.println(viewHolder.publishdate.getText());
return convertView;
}
}
Main Activity Class
package com.czhou.dailyprincetoniannewspaper;
import android.os.Bundle;
import android.support.design.widget.CoordinatorLayout;
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.support.v7.widget.Toolbar;
import android.view.View;
import android.widget.ProgressBar;
import android.widget.RelativeLayout;
import java.util.ArrayList;
import java.util.List;
/**
* Created by czhou on 11/21/2015.
*/
public class MainActivity extends AppCompatActivity {
private Toolbar toolbar;
private TabLayout tabLayout;
private ViewPager viewPager;
private ProgressBar mProgressBar;
private CoordinatorLayout coordinatorLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager){
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new PUNewsFragment(), "News");
adapter.addFragment(new PUSportsFragment(), "Sports");
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);
}
}
}

Put in a line like android:paddingBottom="20dp" into your ListView item in your Fragment XML file. Adjust the 20dp value until it looks the way you want it to.
For some strange reason it just fixes the problem, and it doesn't have to do with the size of the ListView being changed. Somehow the small padding forces the ListView to layout in a different way.

Adding below line in your RecyclerView should solve the issue.
android:layout_marginBottom="?attr/actionBarSize"

Use RecyclerView instead of ListView. It will work for sure. Scrolling of the toolbar strips the bottom space of your layout. ListView won't work perfectly with app:layout_behavior="#string/appbar_scrolling_view_behavior". If you want scrolling and view full items ,use RecyclerView or NestedScrollView instead of ListView.
If you remove app:layout_behavior="#string/appbar_scrolling_view_behavior" and
app:layout_scrollFlags="scroll|enterAlways"
of toolbar you can see ListView with full items.
So, use RecyclerView instead of ListView with app:layout_behavior="#string/appbar_scrolling_view_behavior" and app:layout_scrollFlags="scroll|enterAlways". It will works with scrolling and layout behavior.

For anyone still having this issue, removing the action bar worked for me.
Inside your AndroidManifest:
android:theme="#style/AppTheme.NoActionBar">
Also delete the Action Bar from the layout XML for the Activity.
And remove this from your Activity class:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

Add image on 3 tabs - android

Try this,Really interesting.Must be the solution http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/

Related

Fragment content not visible on adding it to view pager of an activity?

Strange behavior of tabs

Android Fragments not showing up Text view and internal elements

Align Icons in Tab Layout To The Left

Last Item on Listview is cut off

Categories

Resources