这篇文章主要介绍“Android怎么实现网易云推荐歌单界面”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“Android怎么实现网易云推荐歌单界面”文章能帮助大家解决问题。

一、实现1.自定义一个圆角图片控件(也可直接使用第三方框架)

由于是一些简单的绘制,就不一一介绍了,直接上代码。

publicclassMellowImageViewextendsImageView{privatePaintpaint;publicMellowImageView(Contextcontext){super(context);}publicMellowImageView(Contextcontext,@NullableAttributeSetattrs){super(context,attrs);}publicMellowImageView(Contextcontext,@NullableAttributeSetattrs,intdefStyleAttr){super(context,attrs,defStyleAttr);paint=newPaint();}/***绘制圆角矩形图片*@authorjimeng*/@OverrideprotectedvoidonDraw(Canvascanvas){Drawabledrawable=getDrawable();if(null!=drawable){Bitmapbitmap=getBitmapFromDrawable(drawable);Bitmapb=getRoundBitmapByShader(bitmap,getWidth(),getHeight(),20,0);finalRectrectSrc=newRect(0,0,b.getWidth(),b.getHeight());finalRectrectDest=newRect(0,0,getWidth(),getHeight());canvas.drawBitmap(b,rectSrc,rectDest,paint);}else{super.onDraw(canvas);}}/***把图片转换成Bitmap*@paramdrawable*资源图片*@return位图*/publicstaticBitmapgetBitmapFromDrawable(Drawabledrawable){intwidth=drawable.getIntrinsicWidth();intheight=drawable.getIntrinsicHeight();Bitmapbitmap=Bitmap.createBitmap(width,height,drawable.getOpacity()!=PixelFormat.OPAQUE?Bitmap.Config.ARGB_8888:Bitmap.Config.RGB_565);Canvascanvas=newCanvas(bitmap);drawable.draw(canvas);returnbitmap;}publicstaticBitmapgetRoundBitmapByShader(Bitmapbitmap,intoutWidth,intoutHeight,intradius,intboarder){if(bitmap==null){returnnull;}intwidth=bitmap.getWidth();intheight=bitmap.getHeight();floatwidthScale=outWidth*1f/width;floatheightScale=outHeight*1f/height;Matrixmatrix=newMatrix();matrix.setScale(widthScale,heightScale);//创建需要输出的bitmapBitmapdesBitmap=Bitmap.createBitmap(outWidth,outHeight,Bitmap.Config.ARGB_8888);Canvascanvas=newCanvas(desBitmap);Paintpaint=newPaint(Paint.ANTI_ALIAS_FLAG);//着色器BitmapShaderbitmapShader=newBitmapShader(bitmap,Shader.TileMode.CLAMP,Shader.TileMode.CLAMP);//给着色器配置matrixbitmapShader.setLocalMatrix(matrix);paint.setShader(bitmapShader);//创建矩形区域并且预留出borderRectFrect=newRectF(boarder,boarder,outWidth-boarder,outHeight-boarder);//把传入的bitmap绘制到圆角矩形区域内canvas.drawRoundRect(rect,radius,radius,paint);returndesBitmap;}}

效果图如下:

时间原因,一些简单的细节没有画上去。

2.进行布局摆设

将整个布局放在HorizontalScrollView中使其可以左右滑动,以一个item为例。

<HorizontalScrollViewxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="match_parent"android:layout_height="match_parent"android:scrollbars="none"android:orientation="horizontal"><LinearLayoutandroid:layout_width="wrap_content"android:layout_height="match_parent"android:orientation="horizontal"><!--美化,并无其他作用--><RelativeLayoutandroid:layout_width="@dimen/jimeng_dp_16"android:layout_height="@dimen/jimeng_dp_135"/><RelativeLayoutandroid:layout_width="@dimen/jimeng_dp_130"android:layout_height="@dimen/jimeng_dp_135"><TextViewandroid:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@id/like_icon2"android:layout_centerHorizontal="true"android:text="计蒙不吃鱼"android:maxLines="1"android:ellipsize="end"android:textColor="@color/jimeng_black"android:textSize="12.0dip"/><com.shenzhen.jimeng.jmhnzsb.View.MellowImageViewandroid:id="@+id/like_icon2"android:layout_width="120.0dip"android:layout_height="120.0dip"android:layout_centerHorizontal="true"android:scaleType="centerCrop"android:src="@drawable/yf1"/></RelativeLayout></LinearLayout></HorizontalScrollView>3.图片切换动画效果

博主使用的是ViewFlipper。
XML代码如下

<RelativeLayoutxmlns:android="http://schemas.android.com/apk/res/android"android:layout_width="wrap_content"android:layout_height="wrap_content"><ViewFlipperandroid:id="@+id/viewFlipper"android:layout_width="120.0dip"android:layout_height="120.0dip"android:flipInterval="3000"android:inAnimation="@anim/anim_marquee_in"android:outAnimation="@anim/anim_marquee_out"/></RelativeLayout>

划重点:两个动画文件,计蒙调试的将近30分钟才调试成类似效果
anim_marquee_in:

<?xmlversion="1.0"encoding="utf-8"?><setxmlns:android="http://schemas.android.com/apk/res/android"><translateandroid:duration="500"android:fromYDelta="120%p"android:toYDelta="0"/><scaleandroid:duration="500"android:fromXScale="0.8"android:fromYScale="0.8"android:toXScale="1"android:toYScale="1"android:pivotY="50%"android:pivotX="50%"/></set>

anim_marquee_out:

<?xmlversion="1.0"encoding="utf-8"?><setxmlns:android="http://schemas.android.com/apk/res/android"><translateandroid:duration="500"android:fromYDelta="0"android:toYDelta="-120%p"/><scaleandroid:duration="500"android:fromXScale="1"android:fromYScale="1"android:toXScale="0.8"android:toYScale="0.8"android:pivotY="50%"android:pivotX="50%"></scale></set

在Java文件中为ViewFlipper添加view:

privateViewFlipperviewFlipper;//---------------------------------viewFlipper.removeAllViews();Viewview=View.inflate(getContext(),R.layout.home_rebroadcast_item,null);MellowImageViewcarouselImageView=view.findViewById(R.id.carousel_item_iv);Viewview1=View.inflate(getContext(),R.layout.home_rebroadcast_item1,null);MellowImageViewcarouselImageView1=view.findViewById(R.id.carousel_item_iv);//循环滚动图片的点击事件//iv.setOnClickListener(new....);//添加viewviewFlipper.addView(view);viewFlipper.addView(view1);二、实现效果展示

关于“Android怎么实现网易云推荐歌单界面”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识,可以关注亿速云行业资讯频道,小编每天都会为大家更新不同的知识点。