Imitation NetEase cloud music player (disk spinning, background blur, etc.)

Source: Internet
Author: User
Tags set background

First look at the effect, csdn git always do not move, do not know why.


Main ideas:

1, in addition to the start/pause, the last song, the next one of these three icons, you see a viewgroup, this viewgroup inside has a round cover, black circle disk, stylus, Gaussian blur background image

2, comments off the disk with the rotation of the effect, the current scheme is not the best, if you want to implement, you can combine the round cover and disk into a picture (preferably in Cicicleimageview this inside). Give a spinning animation. Two animations, two view, frame frequency not so high

3, commented out the previous, the next switch when the animation effect of the gradient, the original image from 1-0, the new figure from 0-1 gradient. In the simulator will be error, mainly because the change ImageView background that line error. No specific reasons are currently known. Looks like a wild pointer to the bottom.

Welcome everyone to optimize, revise the above problem, change well must communicate with me.

Here is the code structure:



Circleimageview: Creating a circular picture

Gaussianblurutil: Gaussian Blur

Musicplayview: Player View

Mainactivity: Main control class


Layout 2, one is the master, the other is the player's view. Look at the Lord's will know the train of thought.

One player, three button

<?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 "          > <include layout= "@layout/media_play_view" android:id= "@+id/layout_media_play_view"/>            <button android:id= "@+id/btn_play_pause" android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" android:background= "@drawable/fm_btn_play" Android:layout_cente            Rinparent= "true"/><button android:id= "@+id/btn_previous" android:layout_width= "Wrap_content" android:layout_height= "Wrap_content" android:background= "@drawable/bg_play_previous" Andro            Id:layout_centervertical= "true" android:layout_alignparentleft= "true"/> <button      Android:id= "@+id/btn_next"      Android:layout_width= "Wrap_content" android:layout_height= "wrap_content" android:background= "@ Drawable/bg_play_next "android:layout_centervertical=" true "android:layout_alignparentright=" true "/& Gt;</relativelayout>

The source of the player, there is a lot of attention code.

/** * Code Description: 1. Commented out the effect of disk rotation together, the current scheme is not the best, it is recommended that if you want to implement, you can combine the round cover and disk into a picture (preferably in Cicicleimageview this inside). Give a spinning animation. Two animations, two view, the frame frequency is not so high * 2. Comment out the previous and next switch when the gradient animation effect, the original image from 1-0, the new figure from the 0-1 gradient. In the simulator will be error, mainly because the change ImageView background that line error. * @author Xiu * */public class Musicplayview extends Relativelayout {private Context mcontext;//the time it takes to rotate a week private static fin Al int rotate_time = 12 * 1000;//The number of times the animation rotates repeatedly, which represents countless occurrences, does not seem to have an infinitely executed property, so a large number is used to represent the private static final int rotate_count = 10000; Stylus Animation time private static final int needle_time = 1 * 500;//Stylus animation execution angle private static final int needle_radius = 30;//cover, background switch Wait for the gradient animation private static final int avatart_disc_alpha_time = 1 *;p rivate static final float avatart_disc_alpha_percent = 0.3f;//background Private ImageView mbackground;//Stylus Private ImageView mneedle;//record//private ImageView mdisc;//cover Private Circleimageview mavatar;private Boolean isplay = false;//Stylus Move animation objectanimator manineedle;//disk and cover rotation animation//objectanimator Manidisc;objectanimator maniavatar;////The gradient effect when the cover is replaced//objectanimator MAniALphaavatarhide;//objectanimator manialphaavatarshow;//////Gradient effect when background change//objectanimator manialphadiscbghide;// Objectanimator manialphadiscbgshow;float Mvalueavatar; float mvaluedisc; float mvalueneedle;//private int Mcurrentimageresource = 0;//public musicplay mmusicplaylistener;p ublic Musicplayview (context context, AttributeSet Attrs) {super (context); mcontext = context;} Public Musicplayview (Context context) {super (context); mcontext = context;} Public Musicplayview (context context, AttributeSet attrs, int defstyle) {Super (context, attrs, defstyle); mcontext = Conte XT;} /*public interface musicplay{void onavatarchange (); void Ondiscbgchange ();} *//*public void Setmusicplayerlistener (Musicplay listener) {This.mmusicplaylistener = listener;}        */@Override protected void Onfinishinflate () {super.onfinishinflate (); Mbackground = (ImageView) Findviewbyid (r.id.bg); Mavatar = (Circleimageview) Findviewbyid (R.id.avatar);//Bitmap Conformbitmap = Toconformbitmap (bitmapfactory.decoderesOurce (Getresources (), R.drawable.fm_play_disc), Mavatar.getbitmap ());//mavatar.setimagebitmap (conformBitmap);// Mavatar.setbackgrounddrawable (New bitmapdrawable (Conformbitmap));//mavatar.setbackgrounddrawable (GetResources () . Getdrawable (R.drawable.fm_play_disc));//mdisc = (ImageView) Findviewbyid (r.id.disc); mneedle = (ImageView) Findviewbyid (R.id.needle);//mdisc.setvisibility (View.gone); initavataranimation (0f);//initdiscanimation (0f); Initneedleanimation (0f);////cover page Animation//manialphaavatarhide = Objectanimator.offloat (Mavatar, "Alpha", 1, AVATART_DISC_ alpha_percent). Setduration (Avatart_disc_alpha_time);//manialphaavatarhide.addlistener (AvatarAlphaHideListener) ;//manialphaavatarshow = Objectanimator.offloat (Mavatar, "Alpha", Avatart_disc_alpha_percent, 1). SetDuration ( Avatart_disc_alpha_time);////manialphadiscbghide = Objectanimator.offloat (Mbackground, "ALPHA", 1, AVATART_DISC_ alpha_percent). Setduration (Avatart_disc_alpha_time);//manialphadiscbghide.addlistener (DiscbgAlphaHideListener) ;//maniaLphadiscbgshow = Objectanimator.offloat (Mbackground, "Alpha", Avatart_disc_alpha_percent, 1). Setduration (AVATART_    Disc_alpha_time); }/* Animatorlistener Avataralphahidelistener = new Animatorlistener () {@Overridepublic void Onanimationstart (Animator arg0) {} @Overridepublic void Onanimationrepeat (Animator arg0) {} @Overridepublic void Onanimationend (Animator arg0) { Mmusicplaylistener.onavatarchange (); Manialphaavatarshow.start ();} @Overridepublic void Onanimationcancel (Animator arg0) {}}; Animatorlistener Discbgalphahidelistener = new Animatorlistener () {@Overridepublic void Onanimationstart (Animator arg0 {} @Overridepublic void Onanimationrepeat (Animator arg0) {} @Overridepublic void Onanimationend (Animator arg0) { Mmusicplaylistener.ondiscbgchange (); Manialphadiscbgshow.start ();} @Overridepublic void Onanimationcancel (Animator arg0) {}};*//** * * Set background * @param d */public void setbackgrounddrawable (drawable D) {mbackground.setbackgrounddrawable (d);} /** * * Set background * @param d */public voidSetbackgroundresource (int resourece) {Bitmap bmp = Gaussianblurutil.drawabletobitmap (Getresources (). GetDrawable ( resourece)); Mbackground.setbackgrounddrawable (Gaussianblurutil.boxblurfilter (BMP));} public void Setavatarimageresource (int resourceid) {mavatar.setimagedrawable (Getresources (). Getdrawable (ResourceID ));} /** * Play */public void play () {initneedleanimation (0f);  Animatorset animset = new Animatorset ();        Animset.playtogether (MANIAVATAR,MANIDISC);          Animset.play (Maniavatar). After (Manineedle);  Animset.start (); Setplay (TRUE);} /** * Pause */public void pause () {initneedleanimation (Needle_radius); Manineedle.start (); Maniavatar.cancel ();// Manidisc.cancel (); initavataranimation (Mvalueavatar);//initdiscanimation (Mvaluedisc); SetPlay (false);} /** * Next */public void next (int resourceId) {//manialphaavatarhide.start ();//manialphadiscbghide.start (); changeimage (resourceId);//pause ();//initavataranimation (0f);//initdiscanimation (0f);//initneedleanimation (0f);//play ();} private voidChangeimage (final int resourceId) {postdelayed (new Runnable () {@Overridepublic void run () {Setbackgroundresource ( RESOURCEID); Setavatarimageresource (resourceId);}}, 0);} Private Bitmap Toconformbitmap (Bitmap background, Bitmap foreground) {if (background = = null) {Retu           RN null;           } int bgwidth = Background.getwidth ();           int bgheight = Background.getheight ();           int fgwidth = Foreground.getwidth ();           int fgheight = Foreground.getheight (); Create the new blank bitmap creates the same bitmap as the src length width bitmap newbmp = Bitmap.createbitmap (Bgwidth, Bgheight, Config.          rgb_565);           Canvas CV = new canvas (newbmp); Draw BG into cv.drawbitmap (background, 0, 0, NULL);//at 0, 0 coordinates start with BG//draw FG into CV.DRAWB Itmap (foreground, 0, 0, NULL);//at 0, 0 coordinates are drawn into FG, can be drawn from any position//save all clip cv.save (canvas.all_save_flag);//       Save//store Cv.restore ();//Storage    return newbmp; }/** * Previous */public void previous (int resourceId) {//manialphaavatarhide.start ();//manialphadiscbghide.start ();p ause ( ); Changeimage (resourceId);//pause ();//initavataranimation (0f);//initdiscanimation (0f);//initneedleanimation (0f );//play ();} public boolean isplay () {return isplay;} public void Setplay (Boolean isplay) {this.isplay = Isplay;} /** * Initialize rotate cover Animation object * @param start */private void initavataranimation (float start) {Maniavatar = Objectanimator.offloat (Mava Tar, "Rotation", start, 360f + start); Maniavatar.addupdatelistener (new Animatorupdatelistener () {@Overridepublic void Onanimationupdate (Valueanimator animation) {Mvalueavatar = (Float) animation.getanimatedvalue ("rotation"); LOG.E ("", "angle:" + Mvalueavatar);}}); Maniavatar.setduration (Rotate_time); Maniavatar.setinterpolator (new Linearinterpolator ()); Maniavatar.setrepeatcount (Rotate_count);}  /** * Initialize Rotating disk Animation Object * @param start *//*private void initdiscanimation (float start) {Manidisc = Objectanimator.offloat (Mdisc, "Rotation ", start, 360f + start); Manidisc.addupdatelistener (new Animatorupdatelistener () {@Overridepublic void Onanimationupdate (Valueanimator animation) {Mvaluedisc = (Float) animation.getanimatedvalue ("Rotation");}}); Manidisc.setduration (Rotate_time); Manidisc.setinterpolator (new Linearinterpolator ()); Manidisc.setrepeatcount ( Rotate_count);} *//** * Initialize Stylus animation * @param start */private void initneedleanimation (float start) {manineedle = Objectanimator.offloat (Mneedl  E, "Rotation", start, Needle_radius-start). Setduration (Needle_time);}}


SOURCE Download: http://download.csdn.net/detail/u013651247/8270811



Imitation NetEase cloud music player (disk spinning, background blur, etc.)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.