Android自定义videoview仿抖音界面的示例分析

发布时间:2021-05-10 11:34:00 作者:小新
来源:亿速云 阅读:291

这篇文章主要介绍Android自定义videoview仿抖音界面的示例分析,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

Android是什么

Android是一种基于Linux内核的自由及开放源代码的操作系统,主要使用于移动设备,如智能手机和平板电脑,由美国Google公司和开放手机联盟领导及开发。

具体内容如下

1.效果图

和抖音的界面效果一模一样,而且可以自定义,需要什么页面,请自己定义

2.自定义videoview

package com.example.myapplication20;
 
 
import android.content.Context;
import android.util.AttributeSet;
import android.widget.VideoView;
 

public class CusVideoView extends VideoView {
    public CusVideoView(Context context) {
        super(context);
    }
 
    public CusVideoView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
 
    public CusVideoView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }
 
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int width = getDefaultSize(getWidth(), widthMeasureSpec);
        int height = getDefaultSize(getHeight(), heightMeasureSpec);
        setMeasuredDimension(width, height);
    }
}

3.xml界面

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/mRootView"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <ImageView
        android:id="@+id/mThumb"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clickable="false"
        android:focusable="false"
        android:scaleType="centerCrop"
        android:visibility="visible" />
 
    <ImageView
        android:id="@+id/mPlay"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:alpha="0"
        android:clickable="true"
        android:focusable="true"
        android:src="@drawable/play_arrow" />
 
 
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="10dp"
        android:layout_marginBottom="60dp"
        android:orientation="vertical">
 
        <TextView
            android:id="@+id/mTitle"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:lineSpacingExtra="5dp"
            android:textColor="@android:color/white"
            android:textSize="16sp"
            tools:text="测试测试数据哈哈哈哈\n家里几个垃圾了个两个垃圾" />
 
 
    </LinearLayout>
 
    <com.example.myapplication20.CusVideoView
        android:id="@+id/mVideoView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clickable="false"
        android:focusable="false" />
</RelativeLayout>

4.drawable

<vector android:alpha="0.61" android:height="24dp"
    android:viewportHeight="24.0" android:viewportWidth="24.0"
    android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
    <path android:fillColor="#99ffffff" android:pathData="M8,5v14l11,-7z"/>
</vector>

5.主界面设置地址,注意,本demo使用的是本地的视频文件,文件存储再../res/raw文件夹里面,请自行获取

package com.example.myapplication20;
 
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
 
 
import android.media.MediaPlayer;
import android.net.Uri;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;
 
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
 
/**
 * 作者:JArchie
 * 源码参考地址:https://github.com/JArchie/TiktokDemo
 */
 
public class MainActivity extends AppCompatActivity {
    CusVideoView mVideoView;
    private int[] videos = {R.raw.v1, R.raw.v2, R.raw.qi};
    TextView mTitle;
 
 
    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        mVideoView = findViewById(R.id.mVideoView);
        mTitle = findViewById(R.id.mTitle);
 
        String url = "android.resource://" + getPackageName() + "/" + videos[1];
        Log.e("TAG", "video_onCreate: " + url);
 
        mVideoView.setVideoURI(Uri.parse(url));
        mTitle.setText("@王燕\n一起来跳支舞吧");
    }
 
 
    @Override
    protected void onStart() {
        super.onStart();
        playVideo();
    }
 
    @Override
    protected void onDestroy() {
        super.onDestroy();
        releaseVideo();
    }
 
    //播放
    private void playVideo() {
 
        Log.e("TAG", "play_video");
 
        // View itemView = mRecycler.getChildAt(0);
        final CusVideoView mVideoView = findViewById(R.id.mVideoView);
        final ImageView mPlay = findViewById(R.id.mPlay);
        final ImageView mThumb = findViewById(R.id.mThumb);
        final MediaPlayer[] mMediaPlayer = new MediaPlayer[1];
        mVideoView.start();
 
        mVideoView.setOnInfoListener(new MediaPlayer.OnInfoListener() {
            @Override
            public boolean onInfo(MediaPlayer mp, int what, int extra) {
                mMediaPlayer[0] = mp;
                mp.setLooping(true);
                mThumb.animate().alpha(0).setDuration(200).start();
                return false;
            }
        });
 
        //暂停控制
        mPlay.setOnClickListener(new View.OnClickListener() {
            boolean isPlaying = true;
 
            @Override
            public void onClick(View v) {
                if (mVideoView.isPlaying()) {
                    mPlay.animate().alpha(1f).start();
                    mVideoView.pause();
                    isPlaying = false;
                } else {
                    mPlay.animate().alpha(0f).start();
                    mVideoView.start();
                    isPlaying = true;
                }
            }
        });
    }
 
    //释放
    private void releaseVideo() {
 
        Log.e("TAG", "releaseVideo_video");
 
        //  View itemView = mRecycler.getChildAt(index);
        final CusVideoView mVideoView = findViewById(R.id.mVideoView);
        final ImageView mThumb = findViewById(R.id.mThumb);
        final ImageView mPlay = findViewById(R.id.mPlay);
        mVideoView.stopPlayback();
        mThumb.animate().alpha(1).start();
        mPlay.animate().alpha(0f).start();
    }
 
 
}

以上是“Android自定义videoview仿抖音界面的示例分析”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注亿速云行业资讯频道!

推荐阅读:
  1. Android如何自定义View实现抖音飘动红心效果
  2. Android高仿抖音照片电影功能的实现代码

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

android videoview

上一篇:vscode编辑器如何设置图片背景

下一篇:html5移动端视频video中android兼容的示例分析

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》