Android : TabLayout not responding to clicks - android

I have just created a layout that has a DrawerLayout and inside this there is the toolbar, tablayout and viewpager. However the in the tablayout, the tabs are not responding on clicking on them, but is changing on swiping. Here is the code:
<android.support.v4.widget.DrawerLayout 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/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".activities.HomeActivity">
<LinearLayout
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_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<!-- Content for screen without action bar-->
<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="#color/theme_color"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/theme_color"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
app:tabIndicatorColor="#color/sub_theme_color"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<View
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="#drawable/toolbar_shadow" />
<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"/>
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
app:headerLayout="#layout/header_navigation_drawer"
app:menu="#menu/menu_drawer_links"
/>
And in MainActivity.java
private Toolbar toolbar;
private NavigationView navigationView;
private DrawerLayout drawerLayout;
// Initializing Toolbar and setting it as the actionbar
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//Intializing tab-layout and viewpager for tabs
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Tasks"));
tabLayout.addTab(tabLayout.newTab().setText("Updates"));
tabLayout.addTab(tabLayout.newTab().setText("Redeem"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
// Initializing viewpager to hold the tab-layout
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new PagerAdapter
(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
#Override
public void onTabSelected(TabLayout.Tab tab) {
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(TabLayout.Tab tab) {
}
#Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
Now here is the weird part: It is clickable in Lollipop, but is not working in pre-lollipop version.

You can easily solve this by checking the layout view in "design" tab of XML page. Better put the tablayout and viewpager inside a relativelayout.
The activity is fine.
Here is the corrected XML:
<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:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".activities.HomeActivity">
<LinearLayout
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_height="match_parent"
android:layout_width="match_parent"
android:orientation="vertical">
<!-- Content for screen without action bar-->
<!-- Move toolbar above drawerlayout so that on opening drawer, it is visible -->
<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="#color/theme_color"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/theme_color"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
app:tabIndicatorColor="#color/sub_theme_color"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<View
android:id="#+id/shadow_toolbar"
android:layout_width="match_parent"
android:layout_height="4dp"
android:background="#drawable/toolbar_shadow" />
</RelativeLayout>
</FrameLayout>
</LinearLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_height="match_parent"
android:layout_width="wrap_content"
android:layout_gravity="start"
app:headerLayout="#layout/header_navigation_drawer"
app:menu="#menu/menu_drawer_links"
/>
</android.support.v4.widget.DrawerLayout>

Related

Scrolling in ExpandableListView with coordinator layout

My problem is scrolling in ExpandableListView with coordinator layout design.
Toolbar works right and When it touched up, it gets hide, but ExpandableListView doesnt scroll
I need to use NestedScrollView because the layout_navigation_view is Common everywhere.
Take a look at the
picture http://info-sys.persiangig.com/noScroll.gif
My main code with Java AND My design code with XML is:
ActivityMain.java
public class ActivityMain extends ActivityNavigationView {
ArrayList<StructNote> group ; //StructNote public String id,title,icon; // StructNote = Filde Parametr
ArrayList<ArrayList<StructNote>> child ;
ActivityAdapter mAdapter; // class extends BaseExpandableListAdapter
ExpandableListView exListView ;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// ---> content_frame => layout_navigation_view.xml
FrameLayout contentFrameLayout = (FrameLayout) findViewById(R.id.content_frame);
getLayoutInflater().inflate(R.layout.activity_main, contentFrameLayout);
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.getMenu().getItem(1).setChecked(true);
exListView = (ExpandableListView) findViewById(R.id.exListView);
//... Fill Group Child Adapter List
//...Other CODE ...
}
}
ActivityNavigationView.java
public class ActivityNavigationView extends AppCompatActivity {
DrawerLayout drawerLayout;
ActionBarDrawerToggle actionBarDrawerToggle;
Toolbar toolbar;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.layout_navigation_view);
NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
//...Other CODE ... Click menu and Open close NavigationView, Toolbar
}
}
layout_navigation_view.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:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/background_light"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="300dp"
android:theme="#style/AppTheme.AppBarOverlay"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<ImageView
android:id="#+id/main.backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
android:src="#drawable/bg_tool_bar"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:layout_collapseMode="pin">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_margin="#dimen/activity_horizontal_margin"
android:src="#android:drawable/ic_dialog_info"
app:layout_anchor="#id/main.appbar"
app:layout_anchorGravity="bottom|right|end" />
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_activity_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeToRefresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ExpandableListView
android:id="#+id/exListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:transcriptMode="disabled"
android:divider="#null"
android:dividerHeight="0dp"
android:minHeight="130dp">
</ExpandableListView>
</android.support.v4.widget.SwipeRefreshLayout>
</LinearLayout>
Edit :
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ExpandableListView
android:id="#+id/exListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:transcriptMode="disabled"
android:divider="#null"
android:dividerHeight="0dp"
android:minHeight="130dp">
</ExpandableListView>
</LinearLayout>
Toolbar works right and When it touched up, it gets hide, but ExpandableListView doesnt scroll
Yes it's because of SwipeRefreshLayout and using SwipeRefreshLayout inside of NestedScrollView.
Add the SwipeRefreshLayout Widget To add the swipe to refresh widget to
an existing app, add SwipeRefreshLayout as the parent of a single
ListView or GridView
Solution:
Place SwipeRefreshLayout outside of NestedScrollView in layout_navigation_view.xml first:
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipeToRefresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
...
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.SwipeRefreshLayout>
And remove SwipeRefreshLayout in activity_main.xml.

How to make my TabLayout header be under ToolBar?

I have the app with 5 tabs in TabLayout. I decided to initialize it in MainActivity. Each tab is a fragment and each of them has its own ToolBar, so I decided to initialize toolbars in every fragment separately. But the problem is that my toolbars now are under the TabLaout header. I want to ask how it's possible to move them down or maybe I should organize in some another way?
MainActivity:
<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=".activity.MainActivity">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/AppTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="4dp"
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_below="#+id/tabs" />
</RelativeLayout>
Example of fragment:
<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=".activity.MainActivity">
<View
android:id="#+id/transparent_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="90"
android:background="#20000000"
android:visibility="gone" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_home"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:title="Your Wi-Fi is online">
<Button
android:id="#+id/btn_pause"
android:layout_width="90dp"
android:layout_height="36dp"
android:layout_margin="17dp"
android:layout_gravity="end"
android:background="#color/white"
android:text="#string/pause"
android:textColor="#color/midPurple"
android:textSize="14sp" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>
TabLayout inisialization:
private void initUIComponents() {
mViewPager = findViewById(R.id.viewpager);
mTabLayout = findViewById(R.id.tabs);
mTabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
mViewPager.setAdapter(new MenuCategoryAdapter(getSupportFragmentManager()));
mTabLayout.setupWithViewPager(mViewPager);
for (int i = 0; i < mTabLayout.getTabCount(); i++) {
mTabLayout.getTabAt(i).setIcon(R.drawable.homeicon);
}
}
Example of ToolBar initialization:
private void initUIComponents(LayoutInflater inflater, #Nullable ViewGroup container) {
mRootView = inflater.inflate(R.layout.fragment_home, container, false);
mToolbarHome = mRootView.findViewById(R.id.toolbar_home);
mBtnPause = mRootView.findViewById(R.id.btn_pause);
if (mToolbarHome != null) {
((AppCompatActivity) getActivity()).setSupportActionBar(mToolbarHome);
}
mBtnPause.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
pauseWiFi(mToolbarHome, mBtnPause);
}
});
}
How does it looks like:
One way is you set your ViewPager's height to math_parent, and put TabLayout over your ViewPager with 80dp of top margin to reserve space for fragments toolbar
<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=".activity.MainActivity">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/AppTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="80dp"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
</RelativeLayout>
And in your fragment, put fake and empty TabLayout under toolbar to reserve the TabLayout's space and under it you can put your other views
<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=".activity.MainActivity">
<View
android:id="#+id/transparent_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="90"
android:background="#20000000"
android:visibility="gone" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_home"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:title="Your Wi-Fi is online">
<Button
android:id="#+id/btn_pause"
android:layout_width="90dp"
android:layout_height="36dp"
android:layout_gravity="end"
android:layout_margin="17dp"
android:background="#color/white"
android:text="#string/pause"
android:textColor="#color/midPurple"
android:textSize="14sp" />
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar_home"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/fake_tabs"
style="#style/AppTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<!-- Your other views -->
</LinearLayout>
</RelativeLayout>

View pager is overlapping the tab fragments vertically

I am using Viewpager to browse through the tabs. But my viewpager is overlapping the top of the fragment due to which the top of all the fagments are not visible. Adding padding on the top does the work but is there any better way to do it rather than giving padding on the next view.
Layout
<?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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Activity.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabs">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:background="#ffffff">
</android.support.v4.view.ViewPager>
</RelativeLayout>
Activity
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// ActionBar
final ActionBar actionBar = getSupportActionBar();
actionBar.setDefaultDisplayHomeAsUpEnabled(true);
// ViewPage: Slider that helps to create a page that we can swipe
PagerAdapter pagerAdapter = new TabPagerAdapter(getSupportFragmentManager());
ViewPager tab = (ViewPager) findViewById(R.id.pager);
tab.setAdapter(pagerAdapter);
//Tablayout : Shows the tab bar that helps to find the ViewPager page
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(tab);
}
Hope this can help you..
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinator"
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/ThemeOverlay.AppCompat.Dark">
<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" />
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
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="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
You have used Relative Layout and not defined android:layout_below="#id/appbar_layout" . So I have edited your code. Just copy and paste below code in your xml file. It'll solve your problem.
<?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: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:id="#+id/appbar_layout"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tabs">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/appbar_layout"
android:orientation="vertical"
android:background="#ffffff">
</android.support.v4.view.ViewPager>
</RelativeLayout>

SlidingTabView inside Toolbar

I have a transparent SlidingTabLayout embedded within my Toolbar and a ViewPager below.
Everything works fine, functionally. However, the SlidingTabLayout isn't showing up in the bottom left corner of the Toolbar. Instead, it is floating in the middle and to the right:
Here is my Layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/thunderstorm2"
android:padding="0dp">
<com.mjh.android.weathertestlayout.SlidingTabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#88ffffff"
android:paddingLeft="0dp"
app:tabTextAppearance="#style/TextAppearance.AppCompat.Small">
</com.mjh.android.weathertestlayout.SlidingTabLayout>
</android.support.v7.widget.Toolbar>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffcccc">
</android.support.v4.view.ViewPager>
</LinearLayout>
And here is the accompanying code:
adapter = new ViewPagerAdapter(getSupportFragmentManager(), 3);
pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(adapter);
tabs = (SlidingTabLayout) findViewById(R.id.tab_layout);
tabs.setDistributeEvenly(true);
tabs.setCustomTabColorizer(new SlidingTabLayout.TabColorizer() {
#Override
public int getIndicatorColor(int position) {
return getResources().getColor(R.color.gray);
}});
tabs.setBackgroundColor(getResources().getColor(R.color.clear));
tabs.setViewPager(pager);
Any idea how to get the SlidingTabLayout back to the lower left within my Toolbar?
I've tried it on numerous devices and emulators, but it remains the same.
I suggest you to nest your SlidingTabLayout inside a RelativeLayout.
Then you can use android:layout_alignParentBottom and android:layout_alignParentLeft to place it at the bottom-left corner of the Toolbar.
<android.support.v7.widget.Toolbar
android:id="#+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/thunderstorm2"
android:padding="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.mjh.android.weathertestlayout.SlidingTabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="#88ffffff"
android:paddingLeft="0dp"
app:tabTextAppearance="#style/TextAppearance.AppCompat.Small"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true">
</com.mjh.android.weathertestlayout.SlidingTabLayout>
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#ffcccc">
</android.support.v4.view.ViewPager>

Why is my Actionbar not moving up while scrolling?

I have an activity with a drawer layout and a toolbar is included as follows:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<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">
<include
android:id="#+id/tool_bar"
layout="#layout/tool_bar"
>
</include>
<!-- The main content view -->
<FrameLayout
android:id="#+id/frame_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
<!-- The navigation drawer list-->
<android.support.v7.widget.RecyclerView
android:id="#+id/RecyclerView"
android:layout_width="280dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:background="#ffffff"
android:scrollbars="vertical">
</android.support.v7.widget.RecyclerView>
</android.support.v4.widget.DrawerLayout>
The toolbar looks like this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:background="#color/background_floating_material_dark"
android:elevation="4dp"
android:paddingTop="1dp"
app:layout_scrollFlags="scroll|enterAlways">
</android.support.v7.widget.Toolbar>
To this activity I keep on adding/replacing fragments #id/frame_container
Now I have a situation where I have a fragment with 2 tabs, which in turn have recycler views fed to a view pager:
And I am setting it up in java as follows:
TabLayout tabLayout = (TabLayout) rootView.findViewById(R.id.tab_layout2);
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
viewPager = (ViewPager) rootView.findViewById(R.id.pager2);
adapter = new MyFragmentAdapter(
getFragmentManager(), 2);
viewPager.setAdapter(adapter);
tabLayout.setupWithViewPager(viewPager);
Layout of this Fragment:
<RelativeLayout ...
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<android.support.v4.view.ViewPager
android:layout_marginTop="#dimen/abc_action_bar_stacked_max_height"
android:id="#+id/pager2"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tab_layout"
/>
</RelativeLayout>
The fragments in the view pager have the recycler view.:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/listViewPO"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="2px">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
The problem is the action bar is not hiding when I try to scroll. I am not able to figure out the issue. I have spent days with this. Please help!

Categories

Resources