Effect of starting the sliding interface for the first time on Imitation WeChat

Once I used it, I knew that there would be a series of operation instructions or functional instructions during the first startup, slide to the end, and then enter the official interface. Today I also made a reference to network resource imitation.

First, take a look at the engineering structure:

First, check the layout file main. xml.

<? XML version = "1.0" encoding = "UTF-8"?> <Relativelayout xmlns: Android = "http://schemas.android.com/apk/res/android" Android: Id = "@ + ID/mainrlayout" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: background = "#000000"> <! -- Custom sliding control --> <COM. ericssonlabs. scrolllayout xmlns: Android = "http://schemas.android.com/apk/res/android" Android: Id = "@ + ID/scrolllayout" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: visibility = "visible"> <! -- The layout of each page is controlled by a relativelayout. For example, there are four layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: layout_height = "fill_parent" Android: background = "@ drawable/W01"> <textview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: layout_alignparentbottom = "true" Android: layout_centerhorizontal = "true" Android: layout_marginbottom = "90dp" Android: text = ", not just a chat tool" Android: Textcolor = "# ffffff" Android: textsize = "18sp"/> </relativelayout> <relativelayout Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: background = "@ drawable/w02"> <textview Android: Id = "@ + ID/T1" Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: layout_alignparenttop = "true" Android: layout_centerhorizontal = "true" Android: layout_margintop = "96dp" Android: gravity = "center_horizontal" Android: text = "for the first time, you can use animated expressions with transparent backgrounds to express your mood at the moment." Android: textcolor = "# ffffff" Android: textsize = "18sp"/> </relativelayout> <relativelayout Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: background = "@ drawable/w03"/> <relativelayout Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: Background = "@ drawable/W01"> <! -- Click this button to go to otheractivit --> <button Android: Id = "@ + ID/startbtn" Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: authorization = "true" Android: layout_centerhorizontal = "true" Android: layout_gravity = "center_vertical" Android: layout_marginbottom = "90dp" Android: layout_marginleft = "8dp" Android: layout_marginright = "8dp" Android: Background = "@ drawable/button_bg" Droid: text = "start my life" Android: textcolor = "# ffffff" Android: textsize = "18sp"/> </relativelayout> </COM. ericssonlabs. scrolllayout> <! -- This layout is the layout of the small dots shown below. The number of imageviews must correspond to the number of relativelayout above --> <linearlayout Android: Id = "@ + ID/llayout" Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: Rule = "true" Android: layout_centerhorizontal = "true" Android: layout_marginbottom = "25dp" Android: orientation = "horizontal" Android: visibility = "visible"> <imageview Android: layout_width = "wrap_content" Ndroid: layout_height = "wrap_content" Android: layout_gravity = "center_vertical" Android: clickable = "true" Android: padding = "5dp" Android: src = "@ drawable/page_indicator_bg"/> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: layout_gravity = "center_vertical" Android: clickable = "true" Android: padding = "5dp" Android: src = "@ drawable/page_indicator_bg"/> <imageview and Roid: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: layout_gravity = "center_vertical" Android: clickable = "true" Android: padding = "5dp" Android: src = "@ drawable/page_indicator_bg"/> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: layout_gravity = "center_vertical" Android: clickable = "true" Android: padding = "5dp" Android: src = "@ drawable/PA Ge_indicator_bg "/> </linearlayout> <! -- This layout is an animation effect in the New Territories after the last button is clicked --> <linearlayout Android: Id = "@ + ID/animlayout" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: visibility = "gone"> <linearlayout Android: Id = "@ + ID/leftlayout" Android: layout_width = "wrap_content" Android: layout_height = "fill_parent"> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: src = "@ drawable/whatsnew_left"/> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: src = "@ drawable/whatsnew_left_m"/> </linearlayout> <linearlayout Android: id = "@ + ID/rightlayout" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent"> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: src = "@ drawable/whatsnew_right_m"/> <imageview Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: src = "@ drawable/whatsnew_right"/> </linearlayout> </relativelayout>

The next step is the custom control scrolllayout. Java, which inherits a custom control of viewgroup and mainly implements the left and right sliding and display content functions. The source code is as follows:

Public class scrolllayoutactivity extends activity implements extends {private scrolllayout mscrolllayout; private imageview [] IMGs; private int count; private int currentitem; private button startbtn; private extends mainrlayout; private linearlayout pointllayout; private linearlayout leftlayout; private linearlayout rightlayout; private linearlayout animlayout; @ overridepublic void oncreate (bundle savedinstancestate) {super. oncreate (savedinstancestate); setcontentview (R. layout. main); initview ();} private void initview () {mscrolllayout = (scrolllayout) findviewbyid (R. id. scrolllayout); pointllayout = (linearlayout) findviewbyid (R. id. llayout); mainrlayout = (relativelayout) findviewbyid (R. id. mainrlayout); startbtn = (button) findviewbyid (R. id. startbtn); startbtn. setonclicklistener (onclick); animlayout = (linearlayout) findviewbyid (R. id. animlayout); leftlayout = (linearlayout) findviewbyid (R. id. leftlayout); rightlayout = (linearlayout) findviewbyid (R. id. rightlayout); Count = mscrolllayout. getchildcount (); IMGs = new imageview [count]; for (INT I = 0; I <count; I ++) {IMGs [I] = (imageview) pointllayout. getchildat (I); IMGs [I]. setenabled (true); IMGs [I]. settag (I);} currentitem = 0; IMGs [currentitem]. setenabled (false); mscrolllayout. setonviewchangelistener (this);} private view. onclicklistener onclick = new view. onclicklistener () {@ overridepublic void onclick (view v) {Switch (v. GETID () {case R. id. startbtn: mscrolllayout. setvisibility (view. gone); pointllayout. setvisibility (view. gone); animlayout. setvisibility (view. visible); mainrlayout. setbackgroundresource (R. drawable. whatsnew_bg); animation leftoutanimation = animationutils. loadanimation (getapplicationcontext (), R. anim. translate_left); animation rightoutanimation = animationutils. loadanimation (getapplicationcontext (), R. anim. translate_right); leftlayout. setanimation (leftoutanimation); rightlayout. setanimation (rightoutanimation); leftoutanimation. setanimationlistener (New animationlistener () {@ overridepublic void onanimationstart (animation) {mainrlayout. setbackgroundcolor (color. black) ;}@ overridepublic void onanimationrepeat (animation) {}@ overridepublic void onanimationend (animation) {leftlayout. setvisibility (view. gone); rightlayout. setvisibility (view. gone); intent = new intent (scrolllayoutactivity. this, otheractivity. class); scrolllayoutactivity. this. startactivity (intent); scrolllayoutactivity. this. finish (); // overridependingtransition (R. anim. zoom_out_enter, R. anim. zoom_out_exit) ;}}); break ;}};@ overridepublic void onviewchange (INT position) {setcurrentpoint (position);} private void setcurrentpoint (INT position) {If (position <0 | position> count-1 | currentitem = position) {return;} IMGs [currentitem]. setenabled (true); IMGs [position]. setenabled (false); currentitem = position ;}}

Then there is a defined callback interface. The main function of this interface is to comment in the Code. The source code is as follows:

Package com. ericssonlabs; public interface onviewchangelistener {// callback method for controlling small dots at the bottom public void onviewchange (INT view );}

Finally, the Code is as follows:

Public class scrolllayoutactivity extends activity implements extends {private scrolllayout mscrolllayout; private imageview [] IMGs; private int count; private int currentitem; private button startbtn; private extends mainrlayout; private linearlayout pointllayout; private linearlayout leftlayout; private linearlayout rightlayout; private linearlayout animlayout; @ overridepublic void oncreate (bundle savedinstancestate) {super. oncreate (savedinstancestate); setcontentview (R. layout. main); initview ();} private void initview () {mscrolllayout = (scrolllayout) findviewbyid (R. id. scrolllayout); pointllayout = (linearlayout) findviewbyid (R. id. llayout); mainrlayout = (relativelayout) findviewbyid (R. id. mainrlayout); startbtn = (button) findviewbyid (R. id. startbtn); startbtn. setonclicklistener (onclick); animlayout = (linearlayout) findviewbyid (R. id. animlayout); leftlayout = (linearlayout) findviewbyid (R. id. leftlayout); rightlayout = (linearlayout) findviewbyid (R. id. rightlayout); Count = mscrolllayout. getchildcount (); IMGs = new imageview [count]; for (INT I = 0; I <count; I ++) {IMGs [I] = (imageview) pointllayout. getchildat (I); IMGs [I]. setenabled (true); IMGs [I]. settag (I);} currentitem = 0; IMGs [currentitem]. setenabled (false); mscrolllayout. setonviewchangelistener (this);} private view. onclicklistener onclick = new view. onclicklistener () {@ overridepublic void onclick (view v) {Switch (v. GETID () {case R. id. startbtn: mscrolllayout. setvisibility (view. gone); pointllayout. setvisibility (view. gone); animlayout. setvisibility (view. visible); mainrlayout. setbackgroundresource (R. drawable. whatsnew_bg); animation leftoutanimation = animationutils. loadanimation (getapplicationcontext (), R. anim. translate_left); animation rightoutanimation = animationutils. loadanimation (getapplicationcontext (), R. anim. translate_right); leftlayout. setanimation (leftoutanimation); rightlayout. setanimation (rightoutanimation); leftoutanimation. setanimationlistener (New animationlistener () {@ overridepublic void onanimationstart (animation) {mainrlayout. setbackgroundcolor (color. black) ;}@ overridepublic void onanimationrepeat (animation) {}@ overridepublic void onanimationend (animation) {leftlayout. setvisibility (view. gone); rightlayout. setvisibility (view. gone); intent = new intent (scrolllayoutactivity. this, otheractivity. class); scrolllayoutactivity. this. startactivity (intent); scrolllayoutactivity. this. finish (); // overridependingtransition (R. anim. zoom_out_enter, R. anim. zoom_out_exit) ;}}); break ;}};@ overridepublic void onviewchange (INT position) {setcurrentpoint (position);} private void setcurrentpoint (INT position) {If (position <0 | position> count-1 | currentitem = position) {return;} IMGs [currentitem]. setenabled (true); IMGs [position]. setenabled (false); currentitem = position ;}}

I am not very familiar with animation. Here is the effect of direct copy on the Internet. In the future, I will specialize in animation research. After all, the world with animation is colorful.

After everything is ready, run the command to see the effect:

Project download: Code download

To join our QQ group or public account, see: Ryan's
Zone public account and QQ Group

Welcome to my Sina Weibo chat: @ Tang Ren _ Ryan