Android to achieve a similar netease news tab dynamic sliding effect _android

This article will achieve a similar netease news (do not say NetEase news everyone may not know what it looks like) Click the Super Multiple tab, tab dynamic sliding effect.

First look at the layout, that is, using the Horizontalscrollview control to achieve the effect of sliding, which contains a layout.

Next we load the layout and build the data we need to display in the Oncreat method

<code class= "Hljs avrasm" > @Override
protected void onCreate (Bundle savedinstancestate) {
Super.oncreate (savedinstancestate);
Setcontentview (R.layout.activity_tabbar);
Tv_tabname= (TextView) This.findviewbyid (r.id.tv_tabname);
Titlelist = new arraylist<string> ();
Titlelist.add ("recommended");
Titlelist.add ("hot spots");
Titlelist.add ("Beijing");
Titlelist.add ("Sports");
Titlelist.add ("entertainment");
Titlelist.add ("football");
Titlelist.add ("Barcelona");
Titlelist.add ("Car");
} </string></code>

Load layouts, dynamically load multiple custom RadioButton with Radiogroup

<code class= "Hljs avrasm" >hs_activity_tabbar= (Horizontalscrollview) This.findviewbyid (R.id.hs_activity_
Tabbar);
Ll_activity_tabbar_content= (LinearLayout) This.findviewbyid (r.id.ll_activity_tabbar_content);
tab layout Myradiogroup = new Radiogroup (this); Myradiogroup.setlayoutparams (New Viewgroup.layoutparams (ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT));
Myradiogroup.setorientation (linearlayout.horizontal);
Ll_activity_tabbar_content.addview (Myradiogroup);
for (int i = 0; i < titlelist.size (); i++) {String channel = Titlelist.get (i);
RadioButton Radio = new RadioButton (this); Radio.setbuttondrawable (Android.
R.color.transparent);
Radio.setbackgroundresource (R.drawable.radiobtn_selector);
Colorstatelist CSL = Getresources (). Getcolorstatelist (R.color.radiobtn_text_color);
Radio.settextcolor (CSL); Linearlayout.layoutparams L = new Linearlayout.layoutparams ((int) sizehelper.dp2px (this, 80),
ViewGroup.LayoutParams.MATCH_PARENT, Gravity.center); radio.seTlayoutparams (l);
Radio.settextsize (15);
Radio.setgravity (Gravity.center);
Radio.settext (channel);
Radio.settag (channel);
Myradiogroup.addview (radio); }</code>

Finally, click on the tab when there will be a dynamic sliding effect, in fact, is the use of Horizontalscrollview Smoothscrollto method to achieve

<code class= "HLJS cs" > Myradiogroup.setoncheckedchangelistener (New Radiogroup.oncheckedchangelistener () {
@Override public
void OnCheckedChanged (radiogroup group, int checkedid) {
int radiobuttonid = Group.getcheckedradiobuttonid ();
Gets an instance of the RadioButton based on the ID
RadioButton RB = (RadioButton) Findviewbyid (Radiobuttonid);
Channel = (String) rb.gettag ();
Mcurrentcheckedradioleft = Rb.getleft ()//update the distance to the left of the current button
int width= (int) sizehelper.dp2px (tabbaractivity.this, 140);
Hs_activity_tabbar.smoothscrollto ((int) mcurrentcheckedradioleft-width, 0);
Tv_tabname.settext (channel);
}
);
Setting the default selected tab is the first item
if (!titlelist.isempty ()) {
Myradiogroup.check (myradiogroup.getchildat (0). GetId ());
} </code>

The Dp2px method is used as follows to convert a DP to PX:

<code class= "Hljs java" > public static float dp2px (context, float DP) {
final float scale = Context.getr Esources (). Getdisplaymetrics (). density;
Return (DP * scale);
} </code>

All code is:

<code class= "Hljs avrasm" >package Com.example.liuwangshu.myslidetabbar;
Import android.content.res.ColorStateList;
Import android.support.v7.app.AppCompatActivity;
Import Android.os.Bundle;
Import android.view.Gravity;
Import Android.view.ViewGroup;
Import Android.widget.HorizontalScrollView;
Import Android.widget.LinearLayout;
Import Android.widget.RadioButton;
Import Android.widget.RadioGroup;
Import Android.widget.TextView;
Import java.util.ArrayList;
Import java.util.List; public class Tabbaractivity extends Appcompatactivity {private Horizontalscrollview hs_activity_tabbar; private
Radiogroup Myradiogroup;
Private list<string> titlelist;
Private LinearLayout ll_activity_tabbar_content;
Private float mcurrentcheckedradioleft;//The current selected RadioButton distance to the left of the private String channel;
Private TextView Tv_tabname; @Override protected void OnCreate (Bundle savedinstancestate) {super.oncreate (savedinstancestate); Setcontentview (
R.layout.activity_tabbar); Tv_tabname= (TextView) thiS.findviewbyid (R.id.tv_tabname);
Titlelist = new arraylist<string> ();
Titlelist.add ("recommended");
Titlelist.add ("hot spots");
Titlelist.add ("Beijing");
Titlelist.add ("Sports");
Titlelist.add ("entertainment");
Titlelist.add ("football");
Titlelist.add ("Barcelona");
Titlelist.add ("Car");
Initgroup (); private void Initgroup () {hs_activity_tabbar= (Horizontalscrollview) This.findviewbyid (R.id.hs_activity_tabbar); ll
_activity_tabbar_content= (LinearLayout) This.findviewbyid (r.id.ll_activity_tabbar_content);
tab layout Myradiogroup = new Radiogroup (this); Myradiogroup.setlayoutparams (New Viewgroup.layoutparams (ViewGroup.LayoutParams.MATCH_PARENT,
ViewGroup.LayoutParams.MATCH_PARENT));
Myradiogroup.setorientation (linearlayout.horizontal);
Ll_activity_tabbar_content.addview (Myradiogroup);
for (int i = 0; i < titlelist.size (); i++) {String channel = Titlelist.get (i);
RadioButton Radio = new RadioButton (this); Radio.setbuttondrawable (Android.
R.color.transparent);
Radio.setbackgroundresource (R.drawable.radiobtn_selector); ColorstateliSt CSL = Getresources (). Getcolorstatelist (R.color.radiobtn_text_color);
Radio.settextcolor (CSL); Linearlayout.layoutparams L = new Linearlayout.layoutparams ((int) sizehelper.dp2px (this, 80),
ViewGroup.LayoutParams.MATCH_PARENT, Gravity.center);
Radio.setlayoutparams (l);
Radio.settextsize (15);
Radio.setgravity (Gravity.center);
Radio.settext (channel);
Radio.settag (channel);
Myradiogroup.addview (radio); Myradiogroup.setoncheckedchangelistener (New Radiogroup.oncheckedchangelistener () {@Override public void OnCheckedChanged (radiogroup Group, int checkedid) {int radiobuttonid = Group.getcheckedradiobuttonid ();//
Gets an instance of the RadioButton based on the ID RadioButton RB = (RadioButton) Findviewbyid (Radiobuttonid);
Channel = (String) rb.gettag ();
Mcurrentcheckedradioleft = Rb.getleft ()//Update current button distance to the left int width= (int) sizehelper.dp2px (tabbaractivity.this, 140);
Hs_activity_tabbar.smoothscrollto ((int) mcurrentcheckedradioleft-width, 0);
Tv_tabname.settext (channel);
}
}); Set the default selected tab to the first item if (!titlelist.isempty()) {Myradiogroup.check (Myradiogroup.getchildat (0). GetId ());} } </string></string></code>

Look at the effect.

The above is a small set of Android to introduce the implementation of similar NetEase News tab dynamic Sliding effect, I hope to help you, if you have any questions welcome to my message, small series will promptly reply to everyone, here also thank you for your support cloud Habitat community site!