1. Auxiliary class Base class

BaseWidget is a base class of a custom view that you can implement yourself. You can also refer to the base classes in my other article for direct copying

/** * Author: Zhangchenzhou * Time: 2020/7/21-12:01 * Description: * Oral audio playback view with progress bar * can be implemented as follows * 1. Pause * 2. Start * 3. Drag the progress bar to switch progress * 4. Public abstract class BaseAudioPlayView extends BaseWidget {AudioPlayHelper mPlayHelper; private PlayClickListener mOnClickListener; ImageView playBtn; SeekBar audioSeekBar; TextView audioTime; String playUrl; private boolean isSeekBarTracking = false; public BaseAudioPlayView(@NotNull Context context, @Nullable AttributeSet attrs) { super(context, attrs); disableClickAndTD(); mPlayHelper = AudioPlayHelper.getInstance(); } @Override public void initView() { playBtn = findViewById(R.id.playBtn); audioSeekBar = findViewById(R.id.audioSeekBar); audioTime = findViewById(R.id.audioTime); } @Override public void initInnerEvent() { playBtn.setOnClickListener(v->{ if(mOnClickListener! =null){ mOnClickListener.onPlayClick(); }}); audioSeekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener(){ @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { } @Override public void onStartTrackingTouch(SeekBar seekBar) { isSeekBarTracking=true; } @Override public void onStopTrackingTouch(SeekBar seekBar) { setProgress(seekBar.getProgress()); if(mOnClickListener! =null){ mOnClickListener.onPlayWithPos(seekBar.getProgress()); } isSeekBarTracking=false; }}); } public void setPlayUrl(String playUrl) { this.playUrl = playUrl; } public void setAllTime(String allTime){ audioTime.setText(allTime); } /** * display the playing interface */ abstract void showPlaying(); / / void showPause(); /** * display loading interface */ abstract void showLoading(); @param position public void setProgress(int position){if(! isSeekBarTracking){ audioSeekBar.setProgress(position); Public void setProgressMax(int Max){} public void setProgressMax(int Max){} public void setProgressMax(int Max) public void setOnPlayClickListener(PlayClickListener mOnClickListener) { this.mOnClickListener = mOnClickListener; } public interface PlayClickListener{ void onPlayClick(); void onPlayWithPos(int pos); } public void disableClickAndTD () {/ / disabled state audioSeekBar. SetClickable (false); audioSeekBar.setEnabled(false); audioSeekBar.setFocusable(false); } public void enableClickAndTD(){ audioSeekBar.setClickable(true); audioSeekBar.setEnabled(true); audioSeekBar.setFocusable(true); }}Copy the code
  1. Audio playback subclass implementation, so you can put the audio control directly into your interface, give him an address he can automatically play, while closing the page can automatically destroy the player
public class SpokenTopAudioPlayView extends BaseAudioPlayView { public static final String TAG_SPOKEN_TOP_AUDIO_VIEW = "SpokenTopAudioPlayView"; public SpokenTopAudioPlayView(@NotNull Context context, @Nullable AttributeSet attrs) { super(context, attrs); SetOnPlayClickListener (new PlayClickListener() {@override public void onPlayClick() {if(! TextUtils.isEmpty(playUrl)){ mPlayHelper.startPlay(TAG_SPOKEN_TOP_AUDIO_VIEW,playUrl,playUrl,mAudioPlayListener,-1); } } @Override public void onPlayWithPos(int pos) { mPlayHelper.startPlay(TAG_SPOKEN_TOP_AUDIO_VIEW,playUrl,playUrl,mAudioPlayListener,pos); }}); } @Override void showPlaying() { playBtn.setImageResource(R.drawable.spoken_top_audio_play); } @Override void showPause() { playBtn.setImageResource(R.drawable.spoken_top_audio_pause); } public void resetView(){ mPlayHelper.releaseByTag(TAG_SPOKEN_TOP_AUDIO_VIEW); audioSeekBar.setProgress(0); } @Override void showLoading() { playBtn.setImageResource(R.drawable.spoken_top_audio_play); } public void pendPlay(){ if(! TextUtils.isEmpty(playUrl)){ mPlayHelper.getMp3Length(playUrl, length -> { if(length! =-1){ mAudioPlayListener.allTimeInit(length*1000); }else{ mPlayHelper.pendPlay(playUrl,mAudioPlayListener); }}); } } @Override public int getLayoutId() { return R.layout.view_audioplay; } private AudioPlayHelper.EasyAudioPlayListener mAudioPlayListener = new AudioPlayHelper.EasyAudioPlayListener() { Public void onPreparing() {public void onPreparing() {public void onPreparing(); } @Override public void onPlaying() { showPlaying(); } @Override public void onPause() { showPause(); } @Override public void onRelease() { showPause(); audioSeekBar.setProgress(0); } @Override public void onError() { showPause(); } @Override public void onPositionChanged(long position) { audioSeekBar.setProgress((int)position); } @Override public void allTimeInit(long time) { audioSeekBar.setMax((int)time); setAllTime(TimeUtil.getMiaoFenOptional((int)time / 1000)); enableClickAndTD(); } @Override public void onCompletion() { showPause(); audioSeekBar.setProgress(audioSeekBar.getMax()); }}; @Override protected void onDetachedFromWindow() { super.onDetachedFromWindow(); mPlayHelper.release(TAG_SPOKEN_TOP_AUDIO_VIEW,playUrl); }}Copy the code

Layout view_audioplay. XML

<? The XML version = "1.0" encoding = "utf-8"? > <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:background="@drawable/bg_corner_e6e8f1_radius25" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/playBtn" android:layout_marginLeft="@dimen/x8" android:src="@drawable/spoken_top_audio_pause" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <com.k.ie.ui.DisableClickSeekBar android:id="@+id/audioSeekBar" android:layout_width="0dp" android:layout_height="wrap_content" android:maxHeight="@dimen/x2" android:minHeight="@dimen/x2" tools:progress="30" android:progressDrawable="@drawable/spoken_top_seekbar_bg" android:thumb="@drawable/spoken_top_seekbar_thumb" android:layout_weight="1" /> <TextView android:id="@+id/audioTime" tools:text="02'00" android:layout_marginRight="@dimen/x16" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout>Copy the code
  1. List in the play of the subclass implementation, this subclass needs to be combined with the actual logic in the list of play processing
public class SpokenListAudioPlayView extends BaseAudioPlayView { public SpokenListAudioPlayView(@NotNull Context context, @Nullable AttributeSet attrs) { super(context, attrs); } @Override public void showPlaying() { playBtn.setImageResource(R.drawable.spoken_list_audio_play); } @Override public void showPause() { playBtn.setImageResource(R.drawable.spoken_list_audio_pause); } @Override public void showLoading() { playBtn.setImageResource(R.drawable.spoken_list_audio_play); } @Override public void setProgressMax(int max) { audioSeekBar.setMax(max); enableClickAndTD(); } @Override public int getLayoutId() { return R.layout.view_audioplay_list; }}Copy the code

Corresponding layout view_audioplay_list.xml

<? The XML version = "1.0" encoding = "utf-8"? > <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:background="@drawable/bg_corner_e6e8f1_radius25" android:gravity="center_vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:id="@+id/playBtn" android:layout_marginLeft="@dimen/x10" android:padding="@dimen/x5" android:src="@drawable/spoken_list_audio_pause" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <com.k.ie.ui.DisableClickSeekBar android:id="@+id/audioSeekBar" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_marginLeft="-5dp" android:layout_marginRight="-5dp" android:maxHeight="@dimen/x2" android:minHeight="@dimen/x2" tools:progress="30" android:progressDrawable="@drawable/spoken_list_seekbar_bg" android:thumb="@drawable/spoken_list_seekbar_thumb" android:layout_weight="1" /> <TextView android:id="@+id/audioTime" tools:text="02'00" android:layout_marginRight="@dimen/x12" android:textColor="@color/C_FF32374E" android:textSize="@dimen/x12" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </LinearLayout>Copy the code
  1. Image resources