Contoh App Android Gitar Tuner

halo selamat datang di blog yantwant. kali ini blog yantwant akan berbagi source code app android beserta sekilas tutorialnya. app gitar tuner yang saya buat khusus untuk platform android dengan menggunakan bahasa pemrograman java yang dicompile menggunakan IDE Android Studio. source code yang saya share dalam blog ini adalah source code yang dikembangkan lagi untuk link source code aslinya disinilink guitar tuner link library yang digunakan untuk pendukung pembuatan app android ini. disini jangan lupa baca readme yang tertera dibawah listnya. ikuti cara yang terdapat pada readme agar dapat mendownload semua filenya.

setelah proses download librarynya selesai kita lanjutkan dengan membuka android studio kemudian klik File > new project dan beri nama sesuai keinginan kalian.

setelah selesai memberi nama aplikasinya lanjut klik next kemudian pilih minimum SDK targetnya ke API10 klik next kemudian pilih blank layout dan klik next dan finish.

proses selanjutnya adalah menambahkan library yang telah kalian download tadi. dengan klik file > import module kemudian browse file library yang kalian download tadi dan arahkan cursor pada PdCore dan klik ok lalu finish. tunggu proses synchronize grandle selesai, dan  akan muncul pesan error. proses selanjutnya adalah kembali menambahkan module dengan cara klik file > import module kemudian browse file folder yang bernama AndroidMidi yang terdapat didalam file yang telah anda download pada folder midi.

proses berikutnya adalah mengkonfigurasi grandlenya, klik pada triview project klik drop pada module PdCore kemudian buka file build.grandle dan edit codenya.


buildscript { repositories { mavenCentral() } dependencies { classpath 'com.android.tools.build:gradle:1.1.0' } } apply plugin: 'android-library' dependencies { compile fileTree(dir: 'libs', include: '*.jar') compile project(':AndroidMidi') } group = 'org.puredata.android.service' archivesBaseName="PdCore" version = '1.0' android { compileSdkVersion 21 buildToolsVersion "21.1.2" defaultConfig { minSdkVersion 8 targetSdkVersion 21 } sourceSets { main { manifest.srcFile 'AndroidManifest.xml' java.srcDirs = ['src','jni/libpd/java'] resources.srcDirs = ['src'] aidl.srcDirs = ['src'] renderscript.srcDirs = ['src'] res.srcDirs = ['res'] assets.srcDirs = ['assets'] jniLibs.srcDirs = ['src', 'libs'] } instrumentTest.setRoot('tests') } }

selanjutnya adalah mengedit build.grandle yang terdapat pada module AndroidMidi.
buildscript { repositories { mavenCentral() } dependencies { classpath 'com.android.tools.build:gradle:1.1.0' } } apply plugin: 'android-library' dependencies { } android { compileSdkVersion 17 buildToolsVersion "21.1.2" defaultConfig { minSdkVersion 8 targetSdkVersion 8 } sourceSets { main { manifest.srcFile 'AndroidManifest.xml' java.srcDirs = ['src'] resources.srcDirs = ['src'] aidl.srcDirs = ['src'] renderscript.srcDirs = ['src'] res.srcDirs = ['res'] assets.srcDirs = ['assets'] } instrumentTest.setRoot('tests') } }
proses mengedit selesai berikutnya adalah klik button (icon pada urutan nomor lima sebelah kiri icon tanda tanya) syncronize grandle untuk mengecek error.
jika tidak terdapat error maka selanjutnya kita masuk dalam penambahan Icon, serta folder raw dengan drop triview folder app > ssrc > main > klik kanan pada res > new > directory dan beri nama raw. selanjutnya adalah menambahkan file yang diperlukan kedalam folder raw dengan cara manual copy file tuner.zip yang terdapat didalam folder file making music app yang telah kalian download sebelumnya. file tuner.zip tersebut terdapat di dalam folder android>guitartuner>res>raw. (ingat tambahkan secara manual) copy file tuner.zip dan pastekan pada folder raw dimana kalian menempatkan project yang kalian buat. berikutnya adalah menambahkan code berikut ke dalam build.grandle yang terdapat pada folder app

dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile project(':PdCore') }

letakkan kode ini dibagian paling bawah (jika sudah ada lewati langkah ini).

membuat java class CromaticView dengan cara drop folder main>java > klik kanan pada package > new pilih class dan beri nama CromaticView > OK

package com.example.irwant.myapplication; /** * Created by irwant on 3/3/15. */ import android.R.color; import android.content.Context; import android.graphics.Bitmap; import android.graphics.BitmapFactory; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.graphics.Path.Direction; import android.graphics.drawable.BitmapDrawable; import android.graphics.drawable.Drawable; import android.os.Bundle; import android.util.AttributeSet; import android.view.View; import android.widget.ImageView; public class CromaticView extends View{ private float centerPitch, currentPitch; private int width, height; private final Paint paint = new Paint(); private Path circle; private Paint cPaint; private Paint tPaint; private Bitmap mBackgroundImage; public CromaticView(Context context) { super(context); // TODO Auto-generated constructor stub //mBackgroundImage = BitmapFactory.decodeResource(context.getResources(),R.drawable.dial); } public CromaticView(Context context, AttributeSet attrs) { super (context, attrs); } public CromaticView(Context context, AttributeSet attrs, int defStyle) { super(context, attrs, defStyle); } public void setCenterPitch(float centerPitch) { this.centerPitch = centerPitch; invalidate(); } public void setCurrentPitch(float currentPitch) { this.currentPitch = currentPitch; invalidate(); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); width = w; height = h; } @Override protected void onDraw(Canvas canvas) { float halfWidth = width / 2; float halfHeigt = height / 8; float separuh = width / 7; float sedikit = width /3; float sedikitlagi = width /2.2f; paint.setStrokeWidth(7.0f); paint.setColor(Color.rgb(255, 158, 30)); canvas.drawLine(halfWidth, 0, halfWidth,halfHeigt, paint); //canvas.drawLine(halfWidth, halfWidth, halfWidth + height * 0.9f, height - height * 0.9f, paint); //bulet circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setStyle(Paint.Style.STROKE); cPaint.setColor(Color.WHITE); cPaint.setStrokeWidth(3); canvas.drawCircle(halfWidth, halfWidth, 30, cPaint); //bulet circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setColor(Color.RED); cPaint.setStrokeWidth(3); canvas.drawCircle(separuh,separuh,8 , cPaint); canvas.drawCircle(separuh+halfWidth*1.4f+10,separuh,8 , cPaint); //bulet circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setColor(Color.WHITE); cPaint.setStrokeWidth(3); canvas.drawCircle(sedikit,separuh*0.3f,5 , cPaint); canvas.drawCircle(sedikit+sedikit,separuh*0.3f,5 , cPaint); //bulet circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setColor(Color.WHITE); cPaint.setStrokeWidth(3); canvas.drawCircle(sedikitlagi,separuh*0.1f,5 , cPaint); canvas.drawCircle(sedikit+sedikit*0.6f+6,separuh*0.1f,5 , cPaint); float dx = (currentPitch - centerPitch) / 2 ; if (dx< 1 && dx > -1){ paint.setStrokeWidth(4.0f); paint.setColor(Color.rgb(255, 158, 30)); circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setStyle(Paint.Style.STROKE); cPaint.setColor(Color.rgb(255, 158, 30)); cPaint.setStrokeWidth(3); canvas.drawCircle(halfWidth, halfWidth, 30, cPaint); } else { circle = new Path(); circle.addCircle(150, 150, 100, Direction.CW); cPaint = new Paint(Paint.ANTI_ALIAS_FLAG); cPaint.setStyle(Paint.Style.STROKE); cPaint.setColor(Color.RED); cPaint.setStrokeWidth(3); paint.setStrokeWidth(4.0f); paint.setColor(Color.RED); canvas.drawCircle(halfWidth, halfWidth, 30, cPaint); dx = (dx < 0) ? -1 : 1; } double phi = dx * Math.PI / 12; canvas.drawLine(halfWidth, halfWidth, halfWidth + (float)Math.sin(phi) * height * 0.9f, height - (float)Math.cos(phi) * height * 0.9f, paint); } }

setelah itu melanjutkan membuat layoutnya. activity_main.xml
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="fill_parent" android:layout_height="fill_parent" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" android:paddingBottom="@dimen/activity_vertical_margin" tools:context=".MainActivity" android:orientation="vertical" android:weightSum="1" android:keepScreenOn="true"> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="E Standard" android:id="@+id/stringButton" android:layout_gravity="center_horizontal" android:background="@drawable/button" android:layout_weight="0.02" android:textColor="#F64E0B" /> <HorizontalScrollView android:layout_width="fill_parent" android:layout_height="50dp" android:id="@+id/horizontalScrollView" > <LinearLayout android:orientation="horizontal" android:layout_width="fill_parent" android:layout_height="50dp"> <RadioGroup android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="horizontal" android:id="@+id/radiogrup" android:clickable="false"> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="E2" android:id="@+id/radioButton" android:checked="true" android:tag="40" android:onClick="onRadioButtonClicked" /> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="A2" android:id="@+id/radioButton2" android:tag="45" android:onClick="onRadioButtonClicked" /> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="D3" android:id="@+id/radioButton3" android:tag="50" android:onClick="onRadioButtonClicked" /> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="G3" android:id="@+id/radioButton4" android:tag="55" android:onClick="onRadioButtonClicked" /> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="B3" android:id="@+id/radioButton5" android:tag="59" android:onClick="onRadioButtonClicked" /> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="e4" android:id="@+id/radioButton6" android:tag="64" android:onClick="onRadioButtonClicked" /> </RadioGroup> </LinearLayout> </HorizontalScrollView> <com.example.irwant.myapplication.CromaticView android:id="@+id/pitch_view" android:layout_width="fill_parent" android:layout_height="wrap_content" android:layout_span="3"> </com.example.irwant.myapplication.CromaticView> </LinearLayout>

* baca pesan error agar mudah memperbaikinya.

proses selanjutnya adalah menambahkan item pada folder menu dan buka file menu_main.xml
tambahkan code berikut :

<item android:id="@+id/e_std" android:title="E standard" ></item> <item android:id="@+id/drop_d" android:title="drop d"></item> <item android:id="@+id/open_a" android:title="open a"></item> <item android:id="@+id/open_c" android:title="open c"></item> <item android:id="@+id/open_g" android:title="open g"></item>
setelah itu beralih menambahkan beberapa code pada Android permision dan activity library PdCore. hingga seperti ini
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.irwant.myapplication" > <uses-permission android:name="android.permission.RECORD_AUDIO"/> <uses-permission android:name="android.permission.READ_PHONE_STATE"/> <application android:allowBackup="true" android:icon="@drawable/agtuner" android:label="@string/app_name" android:theme="@style/AppTheme"> <activity android:name=".MainActivity" android:launchMode="singleTask" android:label="@string/app_name" android:screenOrientation="portrait"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <service android:name="org.puredata.android.service.PdService" /> </application> </manifest>

dan terakhir adalah koding MainActivity karena pada pengembangan source code yang telah ada sebelumnya hanya menggunakan tuning standart saja maka perubahannya hanya pada penambahan tuning serta button utuk mengganti nada tuningnya.

package com.example.irwant.myapplication; import java.io.File; import java.io.IOException; import org.puredata.android.io.AudioParameters; import org.puredata.android.service.PdService; import org.puredata.android.utils.PdUiDispatcher; import org.puredata.core.PdBase; import org.puredata.core.PdListener; import org.puredata.core.utils.IoUtils; import com.example.irwant.myapplication.R; import android.annotation.SuppressLint; import android.annotation.TargetApi; import android.app.Activity; import android.content.ComponentName; import android.content.Context; import android.content.Intent; import android.content.ServiceConnection; import android.opengl.GLES20; import android.os.Build; import android.os.Bundle; import android.os.IBinder; import android.telephony.PhoneStateListener; import android.telephony.TelephonyManager; import android.util.Log; import android.view.KeyEvent; import android.view.Menu; import android.view.MenuItem; import android.view.View; import android.widget.Button; import android.widget.RadioButton; import android.widget.RadioGroup; import android.widget.TextView; import android.view.View.OnClickListener; import android.widget.PopupMenu; import android.widget.PopupMenu.OnMenuItemClickListener; @TargetApi(Build.VERSION_CODES.HONEYCOMB) @SuppressLint("NewApi") public class MainActivity extends Activity { private static final String TAG = "AG Tuner"; public RadioGroup rbg; public RadioButton rb; public RadioButton rb2; private PdUiDispatcher dispatcher; private float targetFrequency; private CromaticView cromaticView; private Button stingButton; private PdService pdService=null; private final ServiceConnection pdConnection = new ServiceConnection() { @Override public void onServiceDisconnected(ComponentName name) { // TODO Auto-generated method stub } @Override public void onServiceConnected(ComponentName name, IBinder service) { // TODO Auto-generated method stub pdService = ((PdService.PdBinder)service).getService(); try { initPd(); loadPatch(); }catch (IOException e){ Log.e(TAG, e.toString()); finish(); } } }; private void initPd() throws IOException{ AudioParameters.init(this); int sampleRate = AudioParameters.suggestSampleRate(); pdService.initAudio(sampleRate, 1, 2, 10.0f); start(); dispatcher = new PdUiDispatcher(); PdBase.setReceiver(dispatcher); dispatcher.addListener("pitch", new PdListener.Adapter(){ @Override public void receiveFloat(String source, final float x){ cromaticView.setCurrentPitch(x); } }); } private void start() { // TODO Auto-generated method stub if (!pdService.isRunning()){ Intent intent = new Intent(MainActivity.this,MainActivity.class); pdService.startAudio(intent, R.drawable.lgitartuner, "Guitar Tuner", "Return to Guitar Tuner"); } } private void loadPatch()throws IOException{ File dir = getFilesDir(); IoUtils.extractZipResource(getResources().openRawResource(R.raw.tuner), dir,true); File patchFile = new File(dir,"tuner.pd"); PdBase.openPatch(patchFile.getAbsolutePath()); } private void initSystemServices(){ TelephonyManager telephonyManager = (TelephonyManager)getSystemService(Context.TELEPHONY_SERVICE); telephonyManager.listen(new PhoneStateListener(){ @Override public void onCallStateChanged(int state, String incomingNumber){ if(pdService == null)return; if(state == TelephonyManager.CALL_STATE_IDLE){ start(); } else { pdService.stopAudio(); } } }, PhoneStateListener.LISTEN_CALL_STATE); } @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); cromaticView = (CromaticView)findViewById(R.id.pitch_view); //cromaticView.setCenterPitch(40); rb = (RadioButton)findViewById(R.id.radioButton); rb2 = (RadioButton)findViewById(R.id.radioButton2); rbg = (RadioGroup)findViewById(R.id.radiogrup); //stingButton = (Button)findViewById(R.id.stringButton); //onRadioButtonClicked(); updateTargetFrequency(); // initGui(); initSystemServices(); bindService(new Intent(this,PdService.class), pdConnection, BIND_AUTO_CREATE); // code dibawah untuk popup menu button diambil dari website resmi developer android final Button btn = (Button) findViewById(R.id.stringButton); OnClickListener listener = new OnClickListener() { @SuppressLint("NewApi") public void onClick(View v) { /** Instantiating PopupMenu class */ PopupMenu popup = new PopupMenu(getApplicationContext(),v); /** Adding menu items to the popumenu */ popup.getMenuInflater().inflate(R.menu.menu_main, popup.getMenu()); /** Defining menu item click listener for the popup menu */ popup.setOnMenuItemClickListener(new OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { RadioButton rb; switch (item.getItemId()) { case R.id.e_std: rb = (RadioButton)findViewById(R.id.radioButton); rb.setChecked(true); stingButton = (Button)findViewById(R.id.stringButton); stingButton.setText("E Standard"); rb = (RadioButton)findViewById(R.id.radioButton); rb.setText("E2"); rb.setTag("40"); rb = (RadioButton)findViewById(R.id.radioButton2); rb.setText("A2"); rb.setTag("45"); rb = (RadioButton)findViewById(R.id.radioButton3); rb.setText("D3"); rb.setTag("50"); rb =(RadioButton)findViewById(R.id.radioButton4); rb.setText("G3"); rb.setTag("55"); rb = (RadioButton)findViewById(R.id.radioButton5); rb.setText("B3"); rb.setTag("59"); rb = (RadioButton)findViewById(R.id.radioButton6); rb.setText("e4"); rb.setTag("64"); updateTargetFrequency(); break; case R.id.drop_d: stingButton =(Button)findViewById(R.id.stringButton); stingButton.setText("Drop D"); rb = (RadioButton)findViewById(R.id.radioButton); rb.setText("D2"); rb.setTag("38"); rb = (RadioButton)findViewById(R.id.radioButton2); rb.setText("A2"); rb.setTag("45"); rb = (RadioButton)findViewById(R.id.radioButton3); rb.setText("D3"); rb.setTag("50"); rb =(RadioButton)findViewById(R.id.radioButton4); rb.setText("G3"); rb.setTag("55"); rb = (RadioButton)findViewById(R.id.radioButton5); rb.setText("B3"); rb.setTag("59"); rb = (RadioButton)findViewById(R.id.radioButton6); rb.setText("e4"); rb.setTag("64"); updateTargetFrequency(); break; case R.id.open_a: stingButton =(Button)findViewById(R.id.stringButton); stingButton.setText("Open A"); rb = (RadioButton)findViewById(R.id.radioButton); rb.setText("E2"); rb.setTag("40"); rb = (RadioButton)findViewById(R.id.radioButton2); rb.setText("A2"); rb.setTag("45"); rb = (RadioButton)findViewById(R.id.radioButton3); rb.setText("E3"); rb.setTag("52"); rb =(RadioButton)findViewById(R.id.radioButton4); rb.setText("A3"); rb.setTag("57"); rb = (RadioButton)findViewById(R.id.radioButton5); rb.setText("C#4"); rb.setTag("61"); rb = (RadioButton)findViewById(R.id.radioButton6); rb.setText("e4"); rb.setTag("64"); updateTargetFrequency(); break; case R.id.open_c: stingButton=(Button)findViewById(R.id.stringButton); stingButton.setText("Open C"); rb = (RadioButton)findViewById(R.id.radioButton); rb.setText("C2"); rb.setTag("36"); rb = (RadioButton)findViewById(R.id.radioButton2); rb.setText("G2"); rb.setTag("43"); rb = (RadioButton)findViewById(R.id.radioButton3); rb.setText("C3"); rb.setTag("48"); rb =(RadioButton)findViewById(R.id.radioButton4); rb.setText("G3"); rb.setTag("55"); rb = (RadioButton)findViewById(R.id.radioButton5); rb.setText("C4"); rb.setTag("60"); rb = (RadioButton)findViewById(R.id.radioButton6); rb.setText("e4"); rb.setTag("64"); updateTargetFrequency(); break; case R.id.open_g: stingButton =(Button)findViewById(R.id.stringButton); stingButton.setText("Open G"); rb = (RadioButton)findViewById(R.id.radioButton); rb.setText("G2"); rb.setTag("43"); rb = (RadioButton)findViewById(R.id.radioButton2); rb.setText("B2"); rb.setTag("41"); rb = (RadioButton)findViewById(R.id.radioButton3); rb.setText("D3"); rb.setTag("50"); rb =(RadioButton)findViewById(R.id.radioButton4); rb.setText("G3"); rb.setTag("55"); rb = (RadioButton)findViewById(R.id.radioButton5); rb.setText("B3"); rb.setTag("59"); rb = (RadioButton)findViewById(R.id.radioButton6); rb.setText("D4"); rb.setTag("62"); updateTargetFrequency(); break; default: break; } return true; } }); /** Showing the popup menu */ popup.show(); } }; btn.setOnClickListener(listener); } private void updateTargetFrequency() { RadioGroup rg = (RadioGroup) findViewById(R.id.radiogrup); int selected = rg.getCheckedRadioButtonId(); RadioButton rb = (RadioButton) findViewById(selected); targetFrequency = Float.parseFloat((String)rb.getTag()); PdBase.sendFloat("midinote",targetFrequency); PdBase.sendBang("trigger"); cromaticView.setCenterPitch(targetFrequency); } public void onRadioButtonClicked(View view) { RadioButton rb = (RadioButton)view; targetFrequency = Float.parseFloat((String) rb.getTag()); PdBase.sendFloat("midinote",targetFrequency); PdBase.sendBang("trigger"); cromaticView.setCenterPitch(targetFrequency); } @Override public void onDestroy(){ super.onDestroy(); unbindService(pdConnection); } }
jika terdapat error itu disesbabkan ada beberapa file image yang harus dilengkapi misal icon serta background button. silahkan kalian download full source codenya disini
untuk file apknya bisa langsung di google playstore