android 高仿抖音界面,2018-11-05 Android 仿抖音选择封面自定义控件
写在前头,抖音里面很多控件,效果很不错,但是,Android 跟iOS的表现形式以及实现方式,都是有区别的,这里实现Android左右拖拉控件进行视频封面选择。
public class ChoiceCover extends View {
private int mWidth;
private int mHeight;
private Paint mPaint;
private RectF rectF;
private RectF rectF2;
private int rectWidth;
private Bitmap bitmap;
private OnScrollBorderListener onScrollBorderListener;
private int minPx;
public ChoiceCover(Context context) {
super(context);
init();
}
public ChoiceCover(Context context, @Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public ChoiceCover(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
private void init() {
mPaint = new Paint();
mPaint.setAntiAlias(true);
int dp5 = (int) getResources().getDimension(R.dimen.pat_dimen_2);
mPaint.setStrokeWidth(dp5);
//bitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.video_thumbnail);
rectWidth = (int) getResources().getDimension(R.dimen.pat_dimen_2);
minPx = (int) getResources().getDimension(R.dimen.pat_dimen_28);
}
public void setMinInterval(int minPx) {
if (mWidth > 0 && minPx > mWidth) {
minPx = mWidth;
}
this.minPx = minPx;
}
public interface OnScrollBorderListener {
void OnScrollBorder(float start, float end);
void onScrollStateChange();
}
public void setOnScrollBorderListener(OnScrollBorderListener listener) {
this.onScrollBorderListener = listener;
}
public float getLeftInterval() {
return rectF.left;
}
public float getRightInterval() {
return rectF2.right;
}
@Override
protected void onLayout(boolean changed, int left, int top, int right, int bottom) {
super.onLayout(changed, left, top, right, bottom);
if (mWidth == 0) {
mWidth = getWidth();
mHeight = getHeight();
rectF = new RectF();
rectF.left = 0;
rectF.top = 0;
rectF.right = rectWidth;
rectF.bottom = mHeight;
rectF2 = new RectF();
rectF2.left = minPx + rectWidth;
rectF2.top = 0;
rectF2.right = (rectWidth * 2) + minPx;
rectF2.bottom = mHeight;
}
private float downX;
private boolean isScroll;
@Override
public boolean onTouchEvent(MotionEvent event) {
move(event);
return isScroll;
}
boolean scrollChange;
private boolean move(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
downX = event.getX();
if (downX > rectF.left && downX < rectF2.right) {
isScroll = true;
} else {
Log.e("downX", "downX = " + downX + " left*" + rectF.left + " right*" + rectF2.right);
rectF.left = (downX - minPx / 2) - rectWidth;
rectF.right = downX - minPx / 2;
rectF2.left = downX + minPx / 2;
rectF2.right = (downX + minPx / 2) + rectWidth;
//滑动到左边最大值
if (rectF.left < 0) {
rectF.left = 0;
rectF.right = rectWidth;
rectF2.left = minPx + rectWidth;
rectF2.right = (rectWidth * 2) + minPx;
}
//滑动至右边最大值
if (rectF2.right > mWidth) {
rectF2.right = mWidth;
rectF2.left = mWidth - rectWidth;
rectF.right = mWidth - minPx - rectWidth;
rectF.left = mWidth - minPx - (rectWidth * 2);
}
isScroll = true;
invalidate();
if (onScrollBorderListener != null) {
onScrollBorderListener.OnScrollBorder(rectF.left, rectF2.right);
}
}
break;
case MotionEvent.ACTION_MOVE:
float moveX = event.getX();
float scrollX = moveX - downX;
if (isScroll) {
rectF.left = rectF.left + scrollX;
rectF.right = rectF.right + scrollX;
rectF2.left = rectF2.left + scrollX;
rectF2.right = rectF2.right + scrollX;
//滑动到左边最大值
if (rectF.left < 0) {
rectF.left = 0;
rectF.right = rectWidth;
rectF2.left = minPx + rectWidth;
rectF2.right = (rectWidth * 2) + minPx;
}
//滑动至右边最大值
if (rectF2.right > mWidth) {
rectF2.right = mWidth;
rectF2.left = mWidth - rectWidth;
rectF.right = mWidth - minPx - rectWidth;
rectF.left = mWidth - minPx - (rectWidth * 2);
}
scrollChange = true;
invalidate();
if (onScrollBorderListener != null) {
onScrollBorderListener.OnScrollBorder(rectF.left, rectF2.right);// 回调选择的区域
}
}
downX = moveX;
break;
case MotionEvent.ACTION_CANCEL:
case MotionEvent.ACTION_UP:
downX = 0;
isScroll = false;
//invalidate();
if (onScrollBorderListener != null) {
onScrollBorderListener.onScrollStateChange();
}
scrollChange = false;
break;
}
return true;
}
@Override
protected void onDraw(Canvas canvas) {
//TODO 动图托框 绘制
mPaint.setColor(Color.RED);
canvas.drawLine(rectF.left, rectF.top, rectF.left, rectF.bottom, mPaint);
canvas.drawLine(rectF2.right, rectF2.top, rectF2.right, rectF2.bottom, mPaint);
canvas.drawLine(rectF.left, 0, rectF2.right, 0, mPaint);
canvas.drawLine(rectF.left, mHeight, rectF2.right, mHeight, mPaint);
/**
* 添加灰色图层
*/
mPaint.setColor(Color.parseColor("#99313133"));
RectF rectF3 = new RectF();
rectF3.left = 0;
rectF3.top = 0;
rectF3.right = rectF.left;
rectF3.bottom = mHeight;
canvas.drawRect(rectF3, mPaint);
RectF rectF4 = new RectF();
rectF4.left = rectF2.right;
rectF4.top = 0;
rectF4.right = mWidth;
rectF4.bottom = mHeight;
canvas.drawRect(rectF4, mPaint);
}
}
使用方法:直接在布局里面使用当前view,
//监听裁剪器滑动
coverView.setOnScrollBorderListener(new OnScrollBorderListener() {
@Override
public void OnScrollBorder(float start, float end) {
// 游标变更
int startTIme = (int) start;
float result = startTIme / (float) coverView.getWidth();
mCursor = (int) (result * mDuration);
startDurationTime = String.valueOf(start);
}
@Override
public void onScrollStateChange() {
}
});
这里实现原理,主要通过Paint绘制两个不同区域,一个是灰色图层区域,一个是选中封面的框的区域,通过滑动实时绘制改变选择的范围,这里有兴趣的话,可以了解下invalidView跟postInvalidView两者在线程绘制中的区别以及使用场景效率等。
注:可以在这个view的基础上进行延伸,设计改造成仿抖音裁剪视频片段的view。
有疑问可以底下留言,并点个喜欢,一起沟通下
android 高仿抖音界面,2018-11-05 Android 仿抖音选择封面自定义控件相关推荐
- 2018.11月Android优质开源项目
2019独角兽企业重金招聘Python工程师标准>>> 2018.11月Android优质开源项目 转载于:https://my.oschina.net/coderminer/blo ...
- 【仿写酷界面】【HenCoder】仿小米运动的运动记录界面
MISportsConnectWidget 项目地址:sickworm/MISportsConnectWidget 简介:[仿写酷界面][HenCoder]仿小米运动的运动记录界面 更多:作者 ...
- android实习日志_2016年3月11日Android实习日记
1.明天删除orthodotics_design_animation_content_gif.gif文件.(已完成) 2. 如何检测内存泄露? A: 可以通过一些性能监测分析工具,如 JProfile ...
- android仿tim主界面,WPF系列教程——(一)仿TIM QQ界面
TIM QQ 我们先来看一下TIM QQ长什么样,整体可以将界面分为三个部分 TIM QQ 1. 准备 阅读本文假设你已经有XAML布局的基础,所以只对部分布局进行说明. 界面上的图标均来自 Mate ...
- android 漂亮的表单界面,面向ArcGIS for Android的表单界面生成器的设计与实现
孙俊英 陈忠超 摘 要:基于ArcGIS for Android的采集系统作为当下主要的野外采样方式之一,被广泛的应用于各类场景,针对不同采集内容,采集系统的主要差异在于采样的属性数据所有不同,使用传 ...
- android studio 布局设计,Andriod界面设计适配和Android Studio中的资源
Android的碎片化已经被喷了好多年,随着国内手机厂商的崛起,碎片化也越来越严重,根据OpenSignal的最新调查,2014年市面上有18796种不同的Android设备,作为开发者,一个无法回避 ...
- android自动登录不过登陆界面,【教程】Android 记住密码和自动登录界面的实现
该楼层疑似违规已被系统折叠 隐藏此楼查看此楼 登录界面源码: LoginActivity.java public class LoginActivity extends Activity { priv ...
- vue整合uniapp_uni-app仿微信App界面|vue+uniapp聊天室|仿微信朋友圈
项目简介 基于uni-app+vue+vuex+uniPop+swiper等技术开发的仿微信聊天室uniapp-chatroom项目,类似vue及小程序api语法使开发更加方便,实现了发送图文消息.表 ...
- 2018.11.05 NOIP模拟 规避(最短路计数)
传送门 正难则反. 考虑计算两人相遇的方案数. 先正反跑一遍最短路计数. 然后对于一条在最短路上的边(u,v)(u,v)(u,v),如果(dis(s,u)*2<total&&di ...
最新文章
- 有赞统一日志平台初探
- maven工程下 读取resource下配置文件
- ASP.NET文件下载
- 一个redis的连接库的实现
- EditPlus连接远程Linux虚拟机
- mysql横向扩展_高可用MySQL学习笔记-面向横向扩展的MYSQL复制
- TypeScript_学习笔记
- 《统计学习方法》P179页10.22前向后向算法公式推导
- CMake Error at CMakeLists.txt:52 (PROJECT): No CMAKE_CXX_COMPILER could be found.
- mysql 书名_深入理解MySQL
- zzulioj1039答案C语言,ZZULIOJ 1037~1045(C语言)
- 【51单片机】矩阵键盘
- 本地视频做成html网页,使用HTML和JavaScript播放本地的媒体(视频音频)文件的方法...
- dtu连接虚拟服务器,DTU连接HTTP网页
- 尾行4攻略女仆计算机密码,【尾行4攻略女仆不动】尾行2,攻略(共10篇)
- 深入理解Java内存模型的volatile语义
- gcc警告选项汇总 转
- General Algorithm
- 解决数组转对象后,key自动排序
- 基于RT-Thread+RA6M4的远程开机助手
热门文章
- 语音速记怎么做?录音转文字助手转文字,轻松帮你快速记录
- c51抢答器程序汇编语言,单片机八路抢答器proteus仿真带汇编语言源程序 原理图...
- oracle修改db_recocery_USE_DB_RECOVERY_FILE_DEST的使用详解(转载)
- Visual Studio 2022 c#中很实用的VS默认快捷键和原生功能
- 几种常用的UE4粒子材质制作(雨水,烟雾,闪星)
- linux设备驱动归纳总结(三):6.poll和sellct【转】
- Vulnhub靶场渗透测试系列DC-2(wpscan使用和git提权)
- 戴眼镜检测和识别2:Pytorch实现戴眼镜检测和识别(含戴眼镜数据集和训练代码)
- 绘画大师、音乐达人……AI如何重新定义艺术?
- Python调用outlook发送邮件,发送给多人、抄送给多人并带上附件