android动画view上移,在Android开发中使用View制作一个引导动画

在Android开发中使用View制作一个引导动画

发布时间:2020-11-20 16:46:16

来源:亿速云

阅读:98

作者:Leah

这篇文章将为大家详细讲解有关在Android开发中使用View制作一个引导动画,文章内容质量较高,因此小编分享给大家做个参考,希望大家阅读完这篇文章后对相关知识有一定的了解。

一、实现效果图

f773ac01aee527cd3dac20910c176169.gif

关于贝塞尔曲线

b376881ee9bb33e17a1ffcaebfba8614.png

二、实现代码

1.自定义view

package com.czhappy.showintroduce.view;

import android.content.Context;

import android.graphics.Bitmap;

import android.graphics.Canvas;

import android.graphics.Color;

import android.graphics.Paint;

import android.graphics.Path;

import android.util.AttributeSet;

import android.view.View;

import android.widget.RelativeLayout;

/**

* Description: 水波纹动画引导view

* User: chenzheng

* Date: 2017/1/14 0014

* Time: 18:01

*/

public class RippleIntroView extends RelativeLayout implements Runnable {

private int mMaxRadius = 70;

private int mInterval = 20;

private int count = 0;

private Bitmap mCacheBitmap;

private Paint mRipplePaint;

private Paint mCirclePaint;

private Path mArcPath;

public RippleIntroView(Context context) {

this(context, null);

}

public RippleIntroView(Context context, AttributeSet attrs) {

this(context, attrs, 0);

}

public RippleIntroView(Context context, AttributeSet attrs, int defStyleAttr) {

super(context, attrs, defStyleAttr);

init();

}

private void init() {

mRipplePaint = new Paint();

mRipplePaint.setAntiAlias(true);

mRipplePaint.setStyle(Paint.Style.STROKE);

mRipplePaint.setColor(Color.WHITE);

mRipplePaint.setStrokeWidth(2.f);

mCirclePaint = new Paint();

mCirclePaint.setAntiAlias(true);

mCirclePaint.setStyle(Paint.Style.FILL);

mCirclePaint.setColor(Color.WHITE);

mArcPath = new Path();

}

/**

* view大小变化时系统调用

* @param w

* @param h

* @param oldw

* @param oldh

*/

@Override

protected void onSizeChanged(int w, int h, int oldw, int oldh) {

super.onSizeChanged(w, h, oldw, oldh);

if (mCacheBitmap != null) {

mCacheBitmap.recycle();

mCacheBitmap = null;

}

}

@Override

protected void onDraw(Canvas canvas) {

//获取加号图片view

View mPlusChild = getChildAt(0);

//获取提示图片view

View mRefsChild = getChildAt(1);

if (mPlusChild == null || mRefsChild == null) return;

//获取加号图片大小

final int pw = mPlusChild.getWidth();

final int ph = mPlusChild.getHeight();

//获取提示图片大小

final int fw = mRefsChild.getWidth();

final int fh = mRefsChild.getHeight();

if (pw == 0 || ph == 0) return;

//加号图片中心点坐标

final float px = mPlusChild.getX() + pw / 2;

final float py = mPlusChild.getY() + ph / 2;

//提示图片左上角坐标

final float fx = mRefsChild.getX();

final float fy = mRefsChild.getY();

final int rw = pw / 2;

final int rh = ph / 2;

if (mCacheBitmap == null) {

mCacheBitmap = Bitmap.createBitmap(getWidth(), getHeight(), Bitmap.Config.ARGB_8888);

Canvas cv = new Canvas(mCacheBitmap);

super.onDraw(cv);

//清空所有已经画过的path至原始状态

mArcPath.reset();

//起始轮廓点移至x,y坐标点,即加号图片正下方再往下20位置

mArcPath.moveTo(px, py + rh + mInterval);

//设置二次贝塞尔,实现平滑曲线,前两个参数为操作点坐标,后两个参数为结束点坐标

mArcPath.quadTo(px, fy - mInterval, fx + fw * 0.618f, fy - mInterval);

//0~255,数值越小越透明

mRipplePaint.setAlpha(255);

cv.drawPath(mArcPath, mRipplePaint);

//绘制半径为6的实心圆点

cv.drawCircle(px, py + rh + mInterval, 6, mCirclePaint);

}

//绘制背景图片

canvas.drawBitmap(mCacheBitmap, 0, 0, mCirclePaint);

//保存画布当前的状态

int save = canvas.save();

for (int step = count; step <= mMaxRadius; step += mInterval) {

//step越大越靠外就越透明

mRipplePaint.setAlpha(255 * (mMaxRadius - step) / mMaxRadius);

canvas.drawCircle(px, py, (float) (rw + step), mRipplePaint);

}

//恢复Canvas的状态

canvas.restoreToCount(save);

//延迟80毫秒后开始运行

postDelayed(this, 80);

}

@Override

public void run() {

//把run对象的引用从队列里拿出来,这样,他就不会执行了,但 run 没有销毁

removeCallbacks(this);

count += 2;

count %= mInterval;

invalidate();//重绘

}

/**

* 销毁view时调用,收尾工作

*/

@Override

protected void onDetachedFromWindow() {

super.onDetachedFromWindow();

if (mCacheBitmap != null) {

mCacheBitmap.recycle();

mCacheBitmap = null;

}

}

}

2.MainActivity.java

package com.czhappy.showintroduce.activity;

import android.os.Bundle;

import android.support.v7.app.AppCompatActivity;

import android.view.View;

import android.view.ViewGroup;

import com.czhappy.showintroduce.R;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

View view = findViewById(R.id.layout_ripple);

view.setOnClickListener(new View.OnClickListener() {

@Override

public void onClick(View v) {

((ViewGroup) v.getParent()).removeView(v);

}

});

}

}

3.activity_main.xml

android:layout_width="match_parent"

android:layout_height="match_parent">

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Hello World!" />

android:id="@+id/layout_ripple"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:clickable="true"

android:fitsSystemWindows="true"

android:background="#AA000000">

android:id="@+id/iv_plus"

android:layout_marginTop="36dp"

android:src="@mipmap/ic_add"

android:layout_alignParentRight="true"

android:layout_marginRight="6dp"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

android:src="@mipmap/tips_subscribe"

android:id="@+id/tv_title"

android:layout_below="@id/iv_plus"

android:layout_marginTop="50dp"

android:layout_alignParentRight="true"

android:layout_marginRight="40dp"

android:layout_width="wrap_content"

android:layout_height="wrap_content"/>

关于在Android开发中使用View制作一个引导动画就分享到这里了,希望以上内容可以对大家有一定的帮助,可以学到更多知识。如果觉得文章不错,可以把它分享出去让更多的人看到。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/559905.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

linux 启动 x,(1)linux启动过程

head.S是linux启动后的第一个文件&#xff0c;主要完成以下功能&#xff1a;1、检查处理器信息&#xff0c;并保存&#xff1b;2、检查平台号&#xff0c;并保存&#xff1b;3、创建页表&#xff0c;并开启MMU功能&#xff1b;4、对内核data section、bbs section作调整和初始化…

android 刷新view位置,Android View刷新机制实例分析

本文实例讲述了Android View刷新机制。分享给大家供大家参考&#xff0c;具体如下&#xff1a;一、总体说明在Android的布局体系中&#xff0c;父View负责刷新、布局显示子View&#xff1b;而当子View需要刷新时&#xff0c;则是通知父View来完成。二、代码分析1).ViewGroup的a…

android 滚动到底部,Android 控制ScrollView滚动到底部(示例代码)

在开发中&#xff0c;我们经常需要更新列表&#xff0c;并将列表拉倒最底部&#xff0c;比如发表微博&#xff0c;聊天界面等等,这里有两种办法,第一种&#xff0c;使用scrollTo():public static void scrollToBottom(final View scroll, final View inner) {Handler mHandler …

html整体引入js,html页面用js引入js的方式

最原始的是用script便签&#xff1a;1. 使用js打印这个便签&#xff1a;当然这也可以动态引入css以及其他html元素。2. 使用dom的api添加script元素&#xff1a;jQuery中封装了这种方式&#xff0c;并贴心的加入了回调&#xff1a;$.getScript(url,callback(res, status));简单…

vivo android p 机型,vivo X21成全球首批Android P适配机型!vivo :不小心就秀实力了

原标题&#xff1a;vivo X21成全球首批Android P适配机型&#xff01;vivo :不小心就秀实力了近日&#xff0c;2018谷歌I/O大会正式召开&#xff0c;会上发布了大家期待已久的Android P开发者预览版&#xff0c;给我们展示了众多全新特性&#xff0c;其中AI功能的进化让人十分眼…

android继承父类的界面,Android调用父类方法,进行子界面刷新

偶然遇到一个需求、有几个主界面需要获取消息的未读数量由于不是所有类都调用、调用的次数又比较多&#xff0c;整的不上不下的1、对于方法调用次数比较少的 推荐广播广播的方法很方便、但是一堆的消息接收、发送很模式化2、对于较多的方法调用 个人建议直接写共用类中此方法通…

html中依次展开的搜索框,jQuery+CSS3动画展开收缩搜索框特效

js代码function searchToggle(obj, evt){var container $(obj).closest(.search-wrapper);if(!container.hasClass(active)){container.addClass(active);evt.preventDefault();}else if(container.hasClass(active) && $(obj).closest(.input-holder).length 0){con…

直接修改html文本页面没变化,VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法分析...

本文实例讲述了VUE 直接通过JS 修改html对象的值导致没有更新到数据中解决方法。分享给大家供大家参考&#xff0c;具体如下&#xff1a;业务场景我们在使用vue 编写 代码时&#xff0c;我们有一个 多行文本框控件&#xff0c;希望在页面点击一个按钮 在 文本框焦点位置插入一个…

html.partial传递模型,Html.Partial和Html. RenderPartial用法

Html.Partial("MyView")Renders the "MyView" view to an MvcHtmlString.Html.Partial通常呈现的是静态内容&#xff0c;如果不指定的Partial方法中绑定的参数&#xff0c;默认为宿主页面的Model类型&#xff0c;因此如果Partial页面中的Model和主页面的Mo…

live2d内嵌html,博客(网页)添加 Live2D 看板娘

Live2D demoLive2D 看板娘插件 (https://www.fghrsh.net/post/123.html) 的前端 HTML 源码基于 API 加载模型&#xff0c;支持 定制 提示语增加 参数设置 一键定制看板娘&#xff0c;易用性增加 看板娘样式设置&#xff0c;可直接设置宽高度等支持多种一言接口&#xff0c;基于…

计算机启动进入不了桌面图标,电脑开机后不显示桌面图标如何通过修改注册表解决问题...

‍近来有用户发现电脑开机后不显示桌面图标&#xff0c;一般遇到这样的问题&#xff0c;我们会进入任务管理器结束explorer.exe资源管理器进程&#xff0c;再重新启动来解决这个问题。但是&#xff0c;如果这样还无法解决不显示电脑系统桌面图标的问题&#xff0c;那么可以按下…

药学专业报计算机一级有用吗,全网友泣泪劝阻!高考结束之后,什么专业千万不能报?...

原标题&#xff1a;全网友泣泪劝阻&#xff01;高考结束之后&#xff0c;什么专业千万不能报&#xff1f;本文来源&#xff1a;魔都囡啊呀呀呀&#xff0c;高考终于结束啦&#xff0c;大家可以轻松下啦&#xff1f;不过高考的硝烟还没消散&#xff0c;接下来的一个问题就是非常…

如何去掉html body里的 nbsp,html的空格和nbsp怎么去除?

同楼主&#xff0c;这个问题我也碰到了。用html_parser好像不也行replace也不解决不完全&#xff0c;我希望把所有数据(房间类型&#xff0c;面积&#xff0c;位置&#xff0c;详细位置&#xff0c;发布时间&#xff0c;价格)放一行最后没办法只能这样了import requests ##导入…

计算机网络原理04741教学课件,【精编】04741计算机网络原理自考本科2018年4月课件.ppt...

【精编】04741计算机网络原理自考本科2018年4月课件.ppt二、路由选择 5、常用静态路由选择算法的基本内容 6、常见的动态路由选择算法 距离矢量路由算法、链路状态路由算法 7、常用动态路由选择算法的基本内容 8、移动主机的路由选择 9、广播路由选择 10、多播路由选择 第五章 …

计算机数据库管理基本知识,2015年计算机四级考试《数据库技术》基础知识:概念篇...

2015年计算机四级考试《数据库技术》基础知识&#xff1a;概念篇信息与数据1、 信息、物质、能量是组成客观世界并促进社会发展的三大基本要素;2、 信息(Information)--是客观世界事物的存在方式和运动状态的反映&#xff0c;是对事物之间相互联系、相互作用的描述。信息具有可…

coffeescript html5,HTML5——前端预处理技术(Less、Sass、CoffeeScript)

一、Less1.1、概要Less是一种动态样式语言&#xff0c;Less 是一门 CSS 预处理语言&#xff0c;它扩展了 CSS 语言&#xff0c;增加了变量、Mixin、函数等特性&#xff0c;使 CSS 更易维护和扩展。Less 将 CSS 赋予了动态语言的特性&#xff0c;如 变量&#xff0c; 继承&#…

计算机桌面程序名,深度技术win7旗舰版电脑桌面图标只显示名称了怎么办

就算是咱们没有刻意的在桌面创建程序的快捷打开方式&#xff0c;咱们windows系统预装的时候&#xff0c;也会在桌面自行的安装一些快捷方式&#xff0c;例如咱们比较熟悉的回收站、计算机、网络、IE图标等等&#xff0c;而这些图标的显示方式也是系统默认的&#xff0c;由图标和…

计算机专业英语读书报告,英语读书报告怎么写

《英语读书报告怎么写》由会员分享&#xff0c;可在线阅读&#xff0c;更多相关《英语读书报告怎么写(8页珍藏版)》请在装配图网上搜索。1、英语读书报告怎么写-工作报告一:英文读书报告撰写格式英文读书报告撰写格式1字体均为Times New Roman报告题目为3号黑体居中学生姓名、专…

《计算机基础知识》读后感300字,计算机应用基础读后感

010在线为您甄选多篇描写计算机应用基础读后感,计算机应用基础读后感精选,计算机应用基础读后感大全&#xff0c;有议论&#xff0c;叙事 &#xff0c;想象等形式。文章字数有400字、600字、800字....缓存时间&#xff1a; 2021-06-21计算机应用基础说课稿随着计算机应用的普及…

一调计算机专业综合理论试卷,一调计算机专业综合理论试卷(盐城)(新编)

一调计算机专业综合理论试卷(盐城)(新编) (15页)本资源提供全文预览&#xff0c;点击全文预览即可全文预览,如果喜欢文档就下载吧&#xff0c;查找使用更方便哦&#xff01;14.9 积分&#xfeff;盐城市2013年普通高校单独招生第一次调研考试计算机应用专业综合理论试卷第I卷(共…