Android notes-the music effect of a carousel

I. Preface --

Everyone must have heard songs online on Baidu music. Have you noticed the rotating record --

The above one, when the music is playing, the CD wheel is turning, just want to rotate the Trojan. It's fun.

I happen to think of playing a music player a while ago. Well, this can also be done on a music player on a mobile phone. This replaces the progress bar.

When I think of it, I get excited. So I first draw a circle, place the background image, and then rotate it with an animation. When playing music

Starts playing the animation of a circular image. When the music is paused, the rotation is paused. When the music is stopped, the animation is stopped and the image returns to the origin.

 

Ii. Effect --

 

Iii. source code --

(1) MainActivity

<span style="font-size:18px;">public class MainActivity extends Activity {MediaPlayer m1;ImageView infoOperatingIV;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);infoOperatingIV = (ImageView) findViewById(R.id.infoOperating);Button play = (Button) findViewById(R.id.play);Button stop = (Button) findViewById(R.id.stop);play.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {playMusic();}});stop.setOnClickListener(new OnClickListener() {@Overridepublic void onClick(View v) {stopMusic();}});}private void playMusic() {m1 = MediaPlayer.create(this, R.raw.quiet);m1.start();Animation operatingAnim = AnimationUtils.loadAnimation(this, R.anim.tip);LinearInterpolator lin = new LinearInterpolator();operatingAnim.setInterpolator(lin);if (operatingAnim != null) {infoOperatingIV.startAnimation(operatingAnim);}m1.setOnCompletionListener(new OnCompletionListener() {@Overridepublic void onCompletion(MediaPlayer mp) {mp.stop();infoOperatingIV.clearAnimation();}});}private void stopMusic() {m1.stop();infoOperatingIV.clearAnimation();}}</span><span style="font-size: 16pt;"></span>

(2) The Circle control, this part of the code for reference to the netizens.

<Span style = "font-size: 18px;"> public class RoundImageView extends ImageView {private int mBorderThickness = 0; private Context mContext; private int defaultColor = 0 xFFFFFFFF; // if only one of them has a value, draw only one circular border: private int mBorderOutsideColor = 0; private int mBorderInsideColor = 0; // default length and width of the control: private int defaultWidth = 0; private int defaultHeight = 0; public RoundImageView (Context context) {super (context); mContext = Context;} public RoundImageView (Context context, AttributeSet attrs) {super (context, attrs); mContext = context; setCustomAttributes (attrs);} public RoundImageView (Context context, AttributeSet attrs, int defStyle) {super (context, attrs, defStyle); mContext = context; setCustomAttributes (attrs);} private void setCustomAttributes (AttributeSet attrs) {TypedArray a = mContext. obtainStyledAttributes (attrs, R. styleable. roundedimageview); mBorderThickness =. getDimensionPixelSize (R. styleable. roundedimageview_border_thickness, 0); mBorderOutsideColor =. getColor (R. styleable. roundedimageview_border_outside_color, defaultColor); mBorderInsideColor =. getColor (R. styleable. roundedimageview_border_inside_color, defaultColor);} @ Overrideprotected void onDraw (Canvas canvas) {Drawable drawable = getDrawable (); I F (drawable = null) {return;} if (getWidth () = 0 | getHeight () = 0) {return;} this. measure (0, 0); if (drawable. getClass () = NinePatchDrawable. class) return; Bitmap B = (BitmapDrawable) drawable ). getBitmap (); Bitmap bitmap = B. copy (Bitmap. config. ARGB_8888, true); if (defaultWidth = 0) {defaultWidth = getWidth ();} if (defaultHeight = 0) {defaultHeight = getHeight ();} // ensure that the width and height of the widget are not changed because of the image size after the image is re-read. The width and height are the imageview of the wrap_content layout, but the margin is invalid.) // if (defaultWidth! = 0 & defaultHeight! = 0) {// LinearLayout. layoutParams params = new LinearLayout. layoutParams (// defaultWidth, defaultHeight); // setLayoutParams (params); //} int radius = 0; if (mBorderInsideColor! = DefaultColor & mBorderOutsideColor! = DefaultColor) {// define two borders: the outer circle border and the inner circle border radius = (defaultWidth <defaultHeight? DefaultWidth: defaultHeight)/2-2 * mBorderThickness; // draw the inner circle drawCircleBorder (canvas, radius + mBorderThickness/2, mBorderInsideColor); // draw the outer circle drawCircleBorder (canvas, radius + mBorderThickness/2, mBorderOutsideColor);} else if (mBorderInsideColor! = DefaultColor & mBorderOutsideColor = defaultColor) {// define to draw a border radius = (defaultWidth <defaultHeight? DefaultWidth: defaultHeight)/2-mBorderThickness; border (canvas, radius + mBorderThickness/2, mBorderInsideColor);} else if (mBorderInsideColor = defaultColor & mBorderOutsideColor! = DefaultColor) {// define to draw a border radius = (defaultWidth <defaultHeight? DefaultWidth: defaultHeight)/2-mBorderThickness; drawCircleBorder (canvas, radius + mBorderThickness/2, mBorderOutsideColor);} else {// no border radius = (defaultWidth <defaultHeight? DefaultWidth: defaultHeight)/2;} Bitmap roundBitmap = getCroppedRoundBitmap (bitmap, radius); canvas. drawBitmap (roundBitmap, defaultWidth/2-radius, defaultHeight/2-radius, null );} /*** get the cropped circular image ** @ param radius */public Bitmap getCroppedRoundBitmap (Bitmap bmp, int radius) {Bitmap scaledSrcBmp; int diameter = radius * 2; // to avoid deformation of the circular image due to unequal width and height, the largest square image in the middle of the rectangle is taken. int bmp width = bmp. g EtWidth (); int bmpHeight = bmp. getHeight (); int squareWidth = 0, squareHeight = 0; int x = 0, y = 0; Bitmap squareBitmap; if (bmpHeight> BMP width) {// The height is higher than the width squareWidth = squareHeight = BMP width; x = 0; y = (bmpHeight-BMP width)/2; // capture the square image squareBitmap = Bitmap. createBitmap (bmp, x, y, squareWidth, squareHeight);} else if (bmpHeight <bmp width) {// larger than squareWidth = squareHeight = bmpHeight; x = (bmp wid Th-bmpHeight)/2; y = 0; squareBitmap = Bitmap. createBitmap (bmp, x, y, squareWidth, squareHeight);} else {squareBitmap = bmp;} if (squareBitmap. getWidth ()! = Diameter | squareBitmap. getHeight ()! = Diameter) {scaledSrcBmp = Bitmap. createScaledBitmap (squareBitmap, diameter, diameter, true);} else {scaledSrcBmp = squareBitmap;} Bitmap output = Bitmap. createBitmap (scaledSrcBmp. getWidth (), scaledSrcBmp. getHeight (), Config. ARGB_8888); Canvas canvas = new Canvas (output); Paint paint = new Paint (); Rect rect = new Rect (0, 0, scaledSrcBmp. getWidth (), scaledSrcBmp. getHeight (); paint. setAntiAlias (true); paint. setFilterBitmap (true); paint. setDither (true); canvas. drawARGB (0, 0, 0, 0); canvas. drawCircle (scaledSrcBmp. getWidth ()/2, scaledSrcBmp. getHeight ()/2, scaledSrcBmp. getWidth ()/2, paint); paint. setXfermode (new porterduduxfermode (Mode. SRC_IN); canvas. drawBitmap (scaledSrcBmp, rect, rect, paint); bmp = null; squareBitmap = null; scaledSrcBmp = null; return output ;} /*** edges circle */private void drawCircleBorder (Canvas canvas, int radius, int color) {Paint paint = new Paint ();/* de-sawtooth */paint. setAntiAlias (true); paint. setFilterBitmap (true); paint. setDither (true); paint. setColor (color);/* set the paint style to STROKE: hollow */paint. setStyle (Paint. style. STROKE);/* set the width of the paint box */paint. setStrokeWidth (mBorderThickness); canvas. drawCircle (defaultWidth/2, defaultHeight/2, radius, paint) ;}</span> <span style = "font-size: 16pt;" ></span>