0.0.5

Cool wave visualization
adrielcafe · Aug 17, 2016 · 37df90d · 37df90d
1 parent 82848a6
commit 37df90d
Show file tree

Hide file tree

Showing 8 changed files with 109 additions and 57 deletions.
diff --git a/README.md b/README.md
@@ -51,17 +51,20 @@ repositories {
 }
 
 dependencies {
-  compile 'com.github.adrielcafe:AndroidAudioRecorder:0.0.4'
+  compile 'com.github.adrielcafe:AndroidAudioRecorder:0.0.5'
 }
 ```
 
 ## TODO
+- [X] Record audio
+- [X] Tint images to black when background color is too bright
+- [X] Wave visualization based on this [player concept](https://dribbble.com/shots/2369760-Player-Concept)
 - [ ] Pause audio
 - [ ] Play recorded audio
-- [X] Tint images to black when background color is too bright
 
 ## Dependencies
 * [OmRecorder](https://github.com/kailash09dabhi/OmRecorder)
+* [WaveInApp](https://github.com/Cleveroad/WaveInApp)
 
 ## License
 ```

diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml
@@ -4,6 +4,6 @@
     <color name="colorPrimaryDark">#303F9F</color>
     <color name="colorAccent">#FF4081</color>
 
-    <color name="recorder_bg">#2196F3</color>
+    <color name="recorder_bg">#039BE5</color>
 
 </resources>
diff --git a/lib/build.gradle b/lib/build.gradle
@@ -21,4 +21,5 @@ android {
 dependencies {
     compile 'com.android.support:appcompat-v7:24.1.1'
     compile 'com.kailashdabhi:om-recorder:1.0.1'
+    compile 'com.cleveroad:audiovisualization:0.9.4'
 }
diff --git a/lib/src/main/java/cafe/adriel/androidaudiorecorder/AndroidAudioRecorder.java b/lib/src/main/java/cafe/adriel/androidaudiorecorder/AndroidAudioRecorder.java
@@ -12,7 +12,7 @@ public class AndroidAudioRecorder {
     private Activity activity;
 
     private String filePath = Environment.getExternalStorageDirectory() + "/audio.wav";
-    private int color = Color.BLACK;
+    private int color = Color.parseColor("#546E7A");
     private int requestCode = 0;
 
     private AndroidAudioRecorder(Activity activity) {

diff --git a/lib/src/main/java/cafe/adriel/androidaudiorecorder/AudioRecorderActivity.java b/lib/src/main/java/cafe/adriel/androidaudiorecorder/AudioRecorderActivity.java
@@ -3,18 +3,17 @@
 import android.graphics.Color;
 import android.graphics.PorterDuff;
 import android.graphics.drawable.ColorDrawable;
-import android.graphics.drawable.Drawable;
 import android.os.Bundle;
 import android.support.v7.app.AppCompatActivity;
-import android.util.Log;
 import android.view.Menu;
 import android.view.MenuItem;
 import android.view.View;
 import android.widget.ImageButton;
-import android.widget.ImageView;
 import android.widget.RelativeLayout;
 import android.widget.TextView;
 
+import com.cleveroad.audiovisualization.GLAudioVisualizationView;
+
 import java.io.File;
 import java.util.Timer;
 import java.util.TimerTask;
@@ -24,18 +23,21 @@
 import omrecorder.PullTransport;
 import omrecorder.Recorder;
 
-public class AudioRecorderActivity extends AppCompatActivity {
+public class AudioRecorderActivity extends AppCompatActivity implements PullTransport.OnAudioChunkPulledListener {
 
     private Recorder recorder;
+    private VisualizerHandler visualizerHandler;
+
     private Timer timer;
     private MenuItem selectMenuItem;
-    private int secondsRecorded;
-    private boolean isRecording;
     private String filePath;
+    private int secondsRecorded;
     private int color;
+    private boolean isRecording;
+
     private RelativeLayout contentLayout;
+    private GLAudioVisualizationView audioVisualizationView;
     private TextView timerView;
-    private ImageView micView;
     private ImageButton recordView;
 
     @Override
@@ -50,42 +52,62 @@ protected void onCreate(Bundle savedInstanceState) {
             getSupportActionBar().setHomeButtonEnabled(true);
             getSupportActionBar().setDisplayHomeAsUpEnabled(true);
             getSupportActionBar().setDisplayShowTitleEnabled(false);
+            getSupportActionBar().setElevation(0);
             getSupportActionBar().setBackgroundDrawable(
                     new ColorDrawable(Util.getDarkerColor(color)));
             getSupportActionBar().setHomeAsUpIndicator(
                     getResources().getDrawable(R.drawable.ic_clear));
         }
 
+        audioVisualizationView = new GLAudioVisualizationView.Builder(this)
+                .setLayersCount(1)
+                .setWavesCount(5)
+                .setWavesHeight(R.dimen.wave_height)
+                .setWavesFooterHeight(R.dimen.footer_height)
+                .setBubblesPerLayer(16)
+                .setBubblesSize(R.dimen.bubble_size)
+                .setBubblesRandomizeSize(true)
+                .setBackgroundColor(Util.getDarkerColor(color))
+                .setLayerColors(new int[]{color})
+                .build();
+
         contentLayout = (RelativeLayout) findViewById(R.id.content);
         timerView = (TextView) findViewById(R.id.timer);
-        micView = (ImageView) findViewById(R.id.mic);
         recordView = (ImageButton) findViewById(R.id.record);
 
-        // to get drawable resources of check icon and clear icon
-        Drawable clear = getResources().getDrawable(R.drawable.ic_clear);
-        Drawable check = getResources().getDrawable(R.drawable.ic_check);
+        contentLayout.setBackgroundColor(Util.getDarkerColor(color));
+        contentLayout.addView(audioVisualizationView, 0);
 
-        contentLayout.setBackgroundColor(color);
+        visualizerHandler = new VisualizerHandler();
+        audioVisualizationView.linkTo(visualizerHandler);
 
-        // check to set tint of images
         if(Util.isBrightColor(color)) {
-            micView.setColorFilter(Color.BLACK);
             recordView.setColorFilter(Color.BLACK);
             timerView.setTextColor(Color.BLACK);
-            clear.setColorFilter(Color.BLACK, PorterDuff.Mode.SRC_ATOP);
-            check.setColorFilter(Color.BLACK, PorterDuff.Mode.SRC_ATOP);
+            getResources().getDrawable(R.drawable.ic_clear)
+                    .setColorFilter(Color.BLACK, PorterDuff.Mode.SRC_ATOP);
+            getResources().getDrawable(R.drawable.ic_check)
+                    .setColorFilter(Color.BLACK, PorterDuff.Mode.SRC_ATOP);
         }
     }
 
+    @Override
+    public void onResume() {
+        super.onResume();
+        audioVisualizationView.onResume();
+    }
+
     @Override
     protected void onPause() {
         stopRecoding();
+        audioVisualizationView.onPause();
         super.onPause();
     }
 
     @Override
     protected void onDestroy() {
         setResult(RESULT_CANCELED);
+        audioVisualizationView.release();
         super.onDestroy();
     }
 
@@ -108,6 +130,12 @@ public boolean onOptionsItemSelected(MenuItem item) {
         return super.onOptionsItemSelected(item);
     }
 
+    @Override
+    public void onAudioChunkPulled(AudioChunk audioChunk) {
+        float amplitude = isRecording ? (float) audioChunk.maxAmplitude() : 0f;
+        visualizerHandler.onDataReceived(amplitude);
+    }
+
     public void toggleRecord(View v) {
         if (isRecording) {
             stopRecoding();
@@ -128,12 +156,8 @@ private void startRecoding() {
         timerView.setText("00:00:00");
 
         recorder = OmRecorder.wav(
-                new PullTransport.Default(Util.getMic(), new PullTransport.OnAudioChunkPulledListener() {
-                    @Override
-                    public void onAudioChunkPulled(AudioChunk audioChunk) {
-                        animateMic(audioChunk.maxAmplitude());
-                    }
-                }), new File(filePath));
+                new PullTransport.Default(Util.getMic(), this),
+                new File(filePath));
         recorder.startRecording();
 
         secondsRecorded = 0;
@@ -153,6 +177,10 @@ private void stopRecoding() {
         }
         recordView.setImageResource(R.drawable.ic_play);
 
+        if(visualizerHandler != null) {
+            visualizerHandler.stop();
+        }
+
         if (recorder != null) {
             recorder.stopRecording();
             recorder = null;
@@ -161,17 +189,6 @@ private void stopRecoding() {
         if (timer != null) {
             timer.cancel();
         }
-
-        animateMic(0);
-    }
-
-    private void animateMic(double amplitude) {
-        float peak = (float) (amplitude / 150);
-        micView.animate()
-                .scaleX(1 + peak)
-                .scaleY(1 + peak)
-                .setDuration(5)
-                .start();
     }
 
     private void updateTimer() {

diff --git a/lib/src/main/java/cafe/adriel/androidaudiorecorder/VisualizerHandler.java b/lib/src/main/java/cafe/adriel/androidaudiorecorder/VisualizerHandler.java
@@ -0,0 +1,27 @@
+package cafe.adriel.androidaudiorecorder;
+
+import com.cleveroad.audiovisualization.DbmHandler;
+
+public class VisualizerHandler extends DbmHandler<Float> {
+
+    @Override
+    protected void onDataReceivedImpl(Float amplitude, int layersCount, float[] dBmArray, float[] ampsArray) {
+        amplitude = amplitude / 100;
+        if(amplitude <= 0.5){
+            amplitude = 0.0f;
+        } else if(amplitude > 0.5 && amplitude <= 0.6){
+            amplitude = 0.2f;
+        } else if(amplitude > 0.6 && amplitude <= 0.7){
+            amplitude = 0.6f;
+        } else if(amplitude > 0.7){
+            amplitude = 1f;
+        }
+        dBmArray[0] = amplitude;
+        ampsArray[0] = amplitude;
+    }
+
+    public void stop() {
+        calmDownAndStopRendering();
+    }
+
+}
diff --git a/lib/src/main/res/layout/activity_audio_recorder.xml b/lib/src/main/res/layout/activity_audio_recorder.xml
@@ -14,30 +14,28 @@
         android:layout_alignParentTop="true"
         android:layout_centerHorizontal="true"
         android:layout_marginTop="40dp"
-        android:textSize="40sp"
+        android:textSize="60sp"
         android:textColor="@android:color/white"
+        android:fontFamily="sans-serif-thin"
         android:text="00:00:00"/>
 
-    <ImageView
-        android:id="@+id/mic"
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_centerInParent="true"
-        android:scaleType="center"
-        android:src="@drawable/ic_mic"/>
+    <RelativeLayout
+        android:layout_width="match_parent"
+        android:layout_height="@dimen/footer_height"
+        android:layout_alignParentBottom="true">
 
-    <ImageButton
-        android:id="@+id/record"
-        android:layout_width="80dp"
-        android:layout_height="80dp"
-        android:layout_alignParentBottom="true"
-        android:layout_centerHorizontal="true"
-        android:layout_marginBottom="40dp"
-        android:padding="10dp"
-        android:scaleType="fitCenter"
-        android:src="@drawable/ic_play"
-        android:onClick="toggleRecord"
-        style="@style/Widget.AppCompat.Button.Borderless"/>
+        <ImageButton
+            android:id="@+id/record"
+            android:layout_width="80dp"
+            android:layout_height="80dp"
+            android:layout_centerInParent="true"
+            android:layout_marginTop="50dp"
+            android:padding="10dp"
+            android:scaleType="fitCenter"
+            android:src="@drawable/ic_play"
+            android:onClick="toggleRecord"
+            style="@style/Widget.AppCompat.Button.Borderless"/>
 
+    </RelativeLayout>
 
 </RelativeLayout>
diff --git a/lib/src/main/res/values/dimens.xml b/lib/src/main/res/values/dimens.xml
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <dimen name="wave_height">60dp</dimen>
+    <dimen name="bubble_size">25dp</dimen>
+    <dimen name="footer_height">200dp</dimen>
+</resources>