先看看知乎日报开屏页的效果,非常漂亮的开屏效果
私人空间startAnimation () {//位移动画,从底部滑出,Y方向移动,mHeight是底部布局的高度
ObjectAnimator translationAnimator=ObjectAnimator。ofFloat (rv_bottom“translationY”, mHeight 0 f);//设置时长
translationAnimator.setDuration (1000);//透明度渐变动画
ObjectAnimator alphaAnimatorator=ObjectAnimator。ofFloat (rv_bottom“阿尔法”0 f 1 f);//设置时长
alphaAnimatorator.setDuration (2500);//添加监听器,位移结束后,画圆弧开始
translationAnimator。addListener(新Animator.AnimatorListener () {
@Override
公共空间>
私人空间initPaint () {
mPaint1=new油漆();//设置画笔颜色
mPaint1.setColor (Color.WHITE);//设置画笔的样式为圆形
mPaint1.setStrokeCap (Paint.Cap.ROUND);//设置画笔的填充样式为描边
mPaint1.setStyle (Paint.Style.STROKE);//抗锯齿
mPaint1.setAntiAlias(真正的);//设置画笔宽度
mPaint1.setStrokeWidth (mBorderWidth2);
mPaint2=new油漆();
mPaint2.setColor (Color.WHITE);
mPaint2.setStyle (Paint.Style.STROKE);
mPaint2.setAntiAlias(真正的);
mPaint2.setStrokeWidth (mBorderWidth3);
}
之前
mPaint1用来画弧,设置填充样式为描边,这样起码我们就能轻松画一个圆环了。其实要画的知弧就是一个圆环被啃去了一块的感觉~但被啃的地方很光滑,所以需要一个圆头的画笔。
mPaint2用来画外面的圆角矩形环,设置也差不多。
@Override
保护空白>
私人空间startAnimationDraw () {//圆弧扫过范围为270度
ValueAnimator ValueAnimator=new ValueAnimator () .ofFloat (0270);//动画持续时间
valueAnimator.setDuration (mDuration);//设置插值器,中间快两头慢
valueAnimator。setInterpolator(新AccelerateDecelerateInterpolator ());//添加状态监听器
valueAnimator。addUpdateListener(新ValueAnimator.AnimatorUpdateListener () {
@Override
公共空间>//延时加载图片
新处理程序()。postDelayed(新Runnable () {
@Override
公共空间run () {
Glide.with (MainActivity.this)。
负载(R.drawable.timg)。
centerCrop ()。
skipMemoryCache(真正的)。
diskCacheStrategy (DiskCacheStrategy.NONE)。
淡入淡出(500)。
(图片)
；
}
},2000);
之前
这里个人认为知乎也是用某种方式预先把图片下载到本地完成来把握精确地加载时机,不知道是不是这样. .
最后贴一下代码
活动
公开课MainActivity延伸AppCompatActivity {
私人RelativeLayout rv_bottom;
私人Zhview Zhview;
私人mHeight浮动;
私人ImageView形象;
@Override
保护空白>
公开课Zhview扩展视图{
私人油漆mPaint1;//圆弧画笔
私人油漆mPaint2;//外框画笔//圆弧宽度
私人int mBorderWidth2=dipToPx (5);//外框宽度
私人int mBorderWidth3=dipToPx(1.5度);//扫过的范围
私人浮动mCurrentRadian=0;//动画持续时长
私人int mDuration=1500;
公共Zhview(上下文语境){
这(上下文,null);
}
公共Zhview(上下文语境,@Nullable AttributeSet attrs) {
这(上下文、attrs 0);
}
公共Zhview(上下文语境,@Nullable AttributeSet attrs, int defStyleAttr) {
超级(上下文、attrs defStyleAttr);//初始化画笔
initPaint ();
}
私人空间initPaint () {
mPaint1=new油漆();//设置画笔颜色
mPaint1.setColor (Color.WHITE);//设置画笔的样式为圆形
mPaint1.setStrokeCap (Paint.Cap.ROUND);//设置画笔的填充样式为描边
mPaint1.setStyle (Paint.Style.STROKE);//抗锯齿
mPaint1.setAntiAlias(真正的);//设置画笔宽度
mPaint1.setStrokeWidth (mBorderWidth2);
mPaint2=new油漆();
mPaint2.setColor (Color.WHITE);
mPaint2.setStyle (Paint.Style.STROKE);
mPaint2.setAntiAlias(真正的);
mPaint2.setStrokeWidth (mBorderWidth3);
}
@Override
保护空白>
& lt; & # 63; xml version=" 1.0 " encoding=" utf - 8 " & # 63;比;
& lt; RelativeLayout xmlns: android=" http://schemas.android.com/apk/res/android "
xmlns:应用=" http://schemas.android.com/apk/res-auto "
xmlns:工具=" http://schemas.android.com/tools "
android: layout_width=" match_parent "
android: layout_height=" match_parent "
android:背景=" @android:颜色/黑”
工具:上下文=癱om.zhview.MainActivity”比;
& lt; ImageView
android: id=癅 + id/形象”
android: layout_width=" match_parent "
android: layout_height=" match_parent "
android: layout_above=癅 + id/rv_bottom”/比;
& lt;使用
android: id=癅 + id/rv_bottom”
android: layout_width=" match_parent "
android: layout_height=" wrap_content "
android: layout_alignParentBottom=" true "
android:填充=" 20 dp”比;
& lt; com.zhview.Zhview
android: id=癅 + id/zhview”
android: layout_width=" 46 dp "
android: layout_height=" 46 dp "
android: layout_marginLeft=" 10 dp/比;
& lt; TextView
android: id=癅 + id/tv_title”
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android: layout_marginLeft=" 20 dp”
android: layout_toRightOf=癅 + id/zhview”
android:文本="知乎日报”
android:输入textColor=" @android:颜色/白”
android: textSize=" 19 sp "/比;
& lt; TextView
android: layout_width=" wrap_content "
android: layout_height=" wrap_content "
android: layout_alignBottom=癅 + id/zhview”
android: layout_marginLeft=" 20 dp”
android: layout_toRightOf=癅 + id/zhview”
android:文本="每天三次,每次七分钟”
android:输入textColor=" @android:颜色/darker_gray”
android: textSize=" 13 sp "/比;
& lt;/RelativeLayout>
& lt;/RelativeLayout>
