Android Studio - Sliding Tabs appear below action bar instead of on action bar -



Android Studio - Sliding Tabs appear below action bar instead of on action bar -

i've created set of sliding tabs view pager set activity_main.xml. in project tabs show below action bar if divided.

i'd have them part of action bar.

what should edit in code accomplish this?

project screenshot

mainactivity.java

package com.davidreadiii.android.slidingtabexample; import android.os.bundle; import android.support.v4.view.viewpager; import android.support.v7.app.actionbaractivity; import android.view.menu; import android.view.menuitem; import com.davidreadiii.android.slidingtabexample.tabs.mfragmentpageradapter; import com.davidreadiii.android.slidingtabexample.tabs.slidingtablayout; public class mainactivity extends actionbaractivity { @override protected void oncreate(bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_main); // viewpager , set it's pageradapter can display items viewpager viewpager = (viewpager) findviewbyid(r.id.viewpager); viewpager.setadapter(new mfragmentpageradapter(getsupportfragmentmanager(), mainactivity.this)); // give slidingtablayout viewpager slidingtablayout slidingtablayout = (slidingtablayout) findviewbyid(r.id.sliding_tabs); // center tabs in layout slidingtablayout.setdistributeevenly(true); slidingtablayout.setviewpager(viewpager); // customizes tab indicator color. slidingtablayout.setcustomtabcolorizer(new slidingtablayout.tabcolorizer() { @override public int getindicatorcolor(int position) { homecoming getresources().getcolor(r.color.accentcolor); } }); } @override public boolean oncreateoptionsmenu(menu menu) { // inflate menu; adds items action bar if present. getmenuinflater().inflate(r.menu.menu_main, menu); homecoming true; } @override public boolean onoptionsitemselected(menuitem item) { // handle action bar item clicks here. action bar // automatically handle clicks on home/up button, long // specify parent activity in androidmanifest.xml. int id = item.getitemid(); //noinspection simplifiableifstatement if (id == r.id.action_settings) { homecoming true; } homecoming super.onoptionsitemselected(item); } }

slidingtablayout.java

bundle com.davidreadiii.android.slidingtabexample.tabs; import android.content.context; import android.graphics.typeface; import android.support.v4.view.pageradapter; import android.support.v4.view.viewpager; import android.util.attributeset; import android.util.sparsearray; import android.util.typedvalue; import android.view.gravity; import android.view.layoutinflater; import android.view.view; import android.view.viewgroup; import android.widget.horizontalscrollview; import android.widget.linearlayout; import android.widget.textview; public class slidingtablayout extends horizontalscrollview { public interface tabcolorizer { int getindicatorcolor(int position); } private static final int title_offset_dips = 24; private static final int tab_view_padding_dips = 16; private static final int tab_view_text_size_sp = 12; private int mtitleoffset; private int mtabviewlayoutid; private int mtabviewtextviewid; private boolean mdistributeevenly; private viewpager mviewpager; private sparsearray<string> mcontentdescriptions = new sparsearray<string>(); private viewpager.onpagechangelistener mviewpagerpagechangelistener; private final slidingtabstrip mtabstrip; public slidingtablayout(context context) { this(context, null); } public slidingtablayout(context context, attributeset attrs) { this(context, attrs, 0); } public slidingtablayout(context context, attributeset attrs, int defstyle) { super(context, attrs, defstyle); // disable scroll bar sethorizontalscrollbarenabled(false); // create sure tab strips fills view setfillviewport(true); mtitleoffset = (int) (title_offset_dips * getresources().getdisplaymetrics().density); mtabstrip = new slidingtabstrip(context); addview(mtabstrip, layoutparams.match_parent, layoutparams.wrap_content); } public void setselectedindicatorcolors(int... colors) { mtabstrip.setselectedindicatorcolors(colors); } /** * set {@link viewpager.onpagechangelistener}. when using {@link slidingtablayout} * required set {@link viewpager.onpagechangelistener} through method. * layout can update it's scroll position correctly. * * @see viewpager#setonpagechangelistener(viewpager.onpagechangelistener) */ public void setonpagechangelistener(viewpager.onpagechangelistener listener) { mviewpagerpagechangelistener = listener; } /** * set custom layout inflated tab views. * * @param layoutresid layout id inflated * @param textviewid id of {@link textview} in inflated view */ public void setcustomtabview(int layoutresid, int textviewid) { mtabviewlayoutid = layoutresid; mtabviewtextviewid = textviewid; } /** * sets associated view pager. note assumption here pager content * (number of tabs , tab titles) not alter after phone call has been made. */ public void setviewpager(viewpager viewpager) { mtabstrip.removeallviews(); mviewpager = viewpager; if (viewpager != null) { viewpager.setonpagechangelistener(new internalviewpagerlistener()); populatetabstrip(); } } /** * create default view used tabs. called if custom tab view not set via * {@link #setcustomtabview(int, int)}. */ protected textview createdefaulttabview(context context) { textview textview = new textview(context); textview.setgravity(gravity.center); textview.settextsize(typedvalue.complex_unit_sp, tab_view_text_size_sp); textview.settypeface(typeface.default_bold); textview.setlayoutparams(new linearlayout.layoutparams( viewgroup.layoutparams.wrap_content, viewgroup.layoutparams.wrap_content)); typedvalue outvalue = new typedvalue(); getcontext().gettheme().resolveattribute(android.r.attr.selectableitembackground, outvalue, true); textview.setbackgroundresource(outvalue.resourceid); textview.setallcaps(true); int padding = (int) (tab_view_padding_dips * getresources().getdisplaymetrics().density); textview.setpadding(padding, padding, padding, padding); homecoming textview; } private void populatetabstrip() { final pageradapter adapter = mviewpager.getadapter(); final view.onclicklistener tabclicklistener = new tabclicklistener(); (int = 0; < adapter.getcount(); i++) { view tabview = null; textview tabtitleview = null; if (mtabviewlayoutid != 0) { // if there custom tab view layout id set, seek , inflate tabview = layoutinflater.from(getcontext()).inflate(mtabviewlayoutid, mtabstrip, false); tabtitleview = (textview) tabview.findviewbyid(mtabviewtextviewid); } if (tabview == null) { tabview = createdefaulttabview(getcontext()); } if (tabtitleview == null && textview.class.isinstance(tabview)) { tabtitleview = (textview) tabview; } if (mdistributeevenly) { linearlayout.layoutparams lp = (linearlayout.layoutparams) tabview.getlayoutparams(); lp.width = 0; lp.weight = 1; } tabtitleview.settext(adapter.getpagetitle(i)); tabview.setonclicklistener(tabclicklistener); string desc = mcontentdescriptions.get(i, null); if (desc != null) { tabview.setcontentdescription(desc); } mtabstrip.addview(tabview); if (i == mviewpager.getcurrentitem()) { tabview.setselected(true); } } } public void setcontentdescription(int i, string desc) { mcontentdescriptions.put(i, desc); } @override protected void onattachedtowindow() { super.onattachedtowindow(); if (mviewpager != null) { scrolltotab(mviewpager.getcurrentitem(), 0); } } private void scrolltotab(int tabindex, int positionoffset) { final int tabstripchildcount = mtabstrip.getchildcount(); if (tabstripchildcount == 0 || tabindex < 0 || tabindex >= tabstripchildcount) { return; } view selectedchild = mtabstrip.getchildat(tabindex); if (selectedchild != null) { int targetscrollx = selectedchild.getleft() + positionoffset; if (tabindex > 0 || positionoffset > 0) { // if we're not @ first kid , mid-scroll, create sure obey offset targetscrollx -= mtitleoffset; } scrollto(targetscrollx, 0); } } private class internalviewpagerlistener implements viewpager.onpagechangelistener { private int mscrollstate; @override public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) { int tabstripchildcount = mtabstrip.getchildcount(); if ((tabstripchildcount == 0) || (position < 0) || (position >= tabstripchildcount)) { return; } mtabstrip.onviewpagerpagechanged(position, positionoffset); view selectedtitle = mtabstrip.getchildat(position); int extraoffset = (selectedtitle != null) ? (int) (positionoffset * selectedtitle.getwidth()) : 0; scrolltotab(position, extraoffset); if (mviewpagerpagechangelistener != null) { mviewpagerpagechangelistener.onpagescrolled(position, positionoffset, positionoffsetpixels); } } @override public void onpagescrollstatechanged(int state) { mscrollstate = state; if (mviewpagerpagechangelistener != null) { mviewpagerpagechangelistener.onpagescrollstatechanged(state); } } @override public void onpageselected(int position) { if (mscrollstate == viewpager.scroll_state_idle) { mtabstrip.onviewpagerpagechanged(position, 0f); scrolltotab(position, 0); } (int = 0; < mtabstrip.getchildcount(); i++) { mtabstrip.getchildat(i).setselected(position == i); } if (mviewpagerpagechangelistener != null) { mviewpagerpagechangelistener.onpageselected(position); } } } private class tabclicklistener implements view.onclicklistener { @override public void onclick(view v) { (int = 0; < mtabstrip.getchildcount(); i++) { if (v == mtabstrip.getchildat(i)) { mviewpager.setcurrentitem(i); return; } } } } }

slidingtabstrip.java

package com.davidreadiii.android.slidingtabexample.tabs; import android.r; import android.content.context; import android.graphics.canvas; import android.graphics.color; import android.graphics.paint; import android.util.attributeset; import android.util.typedvalue; import android.view.view; import android.widget.linearlayout; class slidingtabstrip extends linearlayout { private static final int default_bottom_border_thickness_dips = 0; private static final byte default_bottom_border_color_alpha = 0x26; private static final int selected_indicator_thickness_dips = 3; private static final int default_selected_indicator_color = 0xff33b5e5; private final int mbottomborderthickness; private final paint mbottomborderpaint; private final int mselectedindicatorthickness; private final paint mselectedindicatorpaint; private final int mdefaultbottombordercolor; private int mselectedposition; private float mselectionoffset; private slidingtablayout.tabcolorizer mcustomtabcolorizer; private final simpletabcolorizer mdefaulttabcolorizer; slidingtabstrip(context context) { this(context, null); } slidingtabstrip(context context, attributeset attrs) { super(context, attrs); setwillnotdraw(false); final float density = getresources().getdisplaymetrics().density; typedvalue outvalue = new typedvalue(); context.gettheme().resolveattribute(r.attr.colorforeground, outvalue, true); final int themeforegroundcolor = outvalue.data; mdefaultbottombordercolor = setcoloralpha(themeforegroundcolor, default_bottom_border_color_alpha); mdefaulttabcolorizer = new simpletabcolorizer(); mdefaulttabcolorizer.setindicatorcolors(default_selected_indicator_color); mbottomborderthickness = (int) (default_bottom_border_thickness_dips * density); mbottomborderpaint = new paint(); mbottomborderpaint.setcolor(mdefaultbottombordercolor); mselectedindicatorthickness = (int) (selected_indicator_thickness_dips * density); mselectedindicatorpaint = new paint(); } void setcustomtabcolorizer(slidingtablayout.tabcolorizer customtabcolorizer) { mcustomtabcolorizer = customtabcolorizer; invalidate(); } void setselectedindicatorcolors(int... colors) { // create sure custom colorizer removed mcustomtabcolorizer = null; mdefaulttabcolorizer.setindicatorcolors(colors); invalidate(); } void onviewpagerpagechanged(int position, float positionoffset) { mselectedposition = position; mselectionoffset = positionoffset; invalidate(); } @override protected void ondraw(canvas canvas) { final int height = getheight(); final int childcount = getchildcount(); final slidingtablayout.tabcolorizer tabcolorizer = mcustomtabcolorizer != null ? mcustomtabcolorizer : mdefaulttabcolorizer; // thick colored underline below current selection if (childcount > 0) { view selectedtitle = getchildat(mselectedposition); int left = selectedtitle.getleft(); int right = selectedtitle.getright(); int color = tabcolorizer.getindicatorcolor(mselectedposition); if (mselectionoffset > 0f && mselectedposition < (getchildcount() - 1)) { int nextcolor = tabcolorizer.getindicatorcolor(mselectedposition + 1); if (color != nextcolor) { color = blendcolors(nextcolor, color, mselectionoffset); } // draw selection partway between tabs view nexttitle = getchildat(mselectedposition + 1); left = (int) (mselectionoffset * nexttitle.getleft() + (1.0f - mselectionoffset) * left); right = (int) (mselectionoffset * nexttitle.getright() + (1.0f - mselectionoffset) * right); } mselectedindicatorpaint.setcolor(color); canvas.drawrect(left, height - mselectedindicatorthickness, right, height, mselectedindicatorpaint); } // lean underline along entire bottom border canvas.drawrect(0, height - mbottomborderthickness, getwidth(), height, mbottomborderpaint); } /** * set alpha value of {@code color} given {@code alpha} value. */ private static int setcoloralpha(int color, byte alpha) { homecoming color.argb(alpha, color.red(color), color.green(color), color.blue(color)); } /** * blend {@code color1} , {@code color2} using given ratio. * * @param ratio of blend. 1.0 homecoming {@code color1}, 0.5 give blend, * 0.0 homecoming {@code color2}. */ private static int blendcolors(int color1, int color2, float ratio) { final float inverseration = 1f - ratio; float r = (color.red(color1) * ratio) + (color.red(color2) * inverseration); float g = (color.green(color1) * ratio) + (color.green(color2) * inverseration); float b = (color.blue(color1) * ratio) + (color.blue(color2) * inverseration); homecoming color.rgb((int) r, (int) g, (int) b); } private static class simpletabcolorizer implements slidingtablayout.tabcolorizer { private int[] mindicatorcolors; @override public final int getindicatorcolor(int position) { homecoming mindicatorcolors[position % mindicatorcolors.length]; } void setindicatorcolors(int... colors) { mindicatorcolors = colors; } } }

mfragmentpageradapter.java

package com.davidreadiii.android.slidingtabexample.tabs; import android.content.context; import android.support.v4.app.fragment; import android.support.v4.app.fragmentmanager; import android.support.v4.app.fragmentpageradapter; import com.davidreadiii.android.slidingtabexample.fragments.fragmentpage1; public class mfragmentpageradapter extends fragmentpageradapter { final int page_count = 3; private string tabtitles[] = new string[] { "tab uno", "tab dos", "tab tres" }; private context context; public mfragmentpageradapter(fragmentmanager fm, context context) { super(fm); this.context = context; } @override public int getcount() { homecoming page_count; } @override public fragment getitem(int position) { homecoming fragmentpage1.newinstance(position + 1); } @override public charsequence getpagetitle(int position) { // generate title based on item position homecoming tabtitles[position]; } }

activity_main.xml (in case it's important)

<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <!-- sliding tab layout implementation --> <com.davidreadiii.android.slidingtabexample.tabs.slidingtablayout android:id="@+id/sliding_tabs" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/primarycolor"> </com.davidreadiii.android.slidingtabexample.tabs.slidingtablayout> <!-- view pager implementation --> <android.support.v4.view.viewpager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="0px" android:layout_weight="1" android:background="@android:color/white"/> </linearlayout>

i've scoured web reply can turn nil works particular project.

to reply own question, take few steps accomplish this. first need create own custom action bar in seperate xml file. need apply "noactionbar" theme activity want set action bar silding tabs in. need write in java want set action bar in particular activity own custom action bar. believe, don't quote me, need add together sliding tabs in action bar layout file along view pager.

obviously there lot of steps , hard explain them in way. slidenerd has superb set of video tutorials on how in case you're visual learner.

customactionbar tutorial (videos 3-5): https://www.youtube.com/watch?v=pmo8evkhjo8&index=3&list=plonjj3bvjzw6ctambjz1xd8elus1kxatd

slidingtablayout tutorial (videos 26-28): https://www.youtube.com/watch?v=fl0xmuo10ya&index=26&list=plonjj3bvjzw6ctambjz1xd8elus1kxatd

android android-layout android-studio tabs android-tabs

Comments

Popular posts from this blog

java - How to set log4j.defaultInitOverride property to false in jboss server 6 -

c - GStreamer 1.0 1.4.5 RTSP Example Server sends 503 Service unavailable -

Using ajax with sonata admin list view pagination -