Membuat "Speech To Text" dengan Android Studio

Tutorial kali ini kita akan membahas tentang fitur Speech To Text Android, dimana system ini akan menampilkan text apa yang telah kita ucapkan. Dengan ini kalian bisa menambahkan beberapa fitur keren untuk aplikasi kalian seperti  menambahkan Navigasi Suara, bermanfaat untuk komunikasi dengan orang-orang cacat, mengisi formulir dengan input suara.

Cara kerja sistem ini ialah menangkap suara kemudian dikirimkan ke server, pada server akan dikonversikan menjadi teks dan akhirnya teks akan dikirim kembali ke aplikasi kita.

Okey, sekarang kita coba membuat aplikasi sederhana...

Langkah pertama adalah buat projek baru, disini saya menggunakan Android Studio.

Selanjutnya adalah membuka file strings.xml pada lokasi root folder res -> values dan rubah kode menjadi berikut :

<resources>
    <string name="app_name">Android Speech</string>
    <string name="action_settings">Settings</string>
    <string name="hello_world">Hello world!</string>
    <string name="speech_prompt">Say something&#8230;</string>
    <string name="speech_not_supported">Sorry! Your device doesn\'t support speech input</string>
    <string name="tap_on_mic">Tap on mic to speak</string>
</resources>

Kemudian buka colors.xml di lokasi root folder res -> values dan tambahkan kode warna sehingga menjadi seperti dibawah ini. Jika pada projek tidak ada file colors.xml, maka buatlah file tersebut dengan cara Klik Kanan Folder Values -> New ->  Values Resources File.

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="white">#ffffff</color>
    <color name="bg_gradient_start">#31244e</color>
    <color name="bg_gradient_end">#6b394c</color>
</resources>

Buatlah file xml pada root folder drawable dengan cara Klik Kanan Folder drawable -> New Values Resources File. Kemudian namai file dengan nama bg_gradient dan tambahkan kode sehingga menjadi seperti :

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle" >

    <gradient
        android:angle="45"
        android:endColor="@color/bg_gradient_end"
        android:startColor="@color/bg_gradient_start"
        android:type="linear" />
</shape>

Download dan Copy gambar berikut ke folder drawable.

Sekarang buka file layout main activity (activity_main.xml) dan tambahkan kode hingga menjadi seperti ini:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg_gradient"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/txtSpeechInput"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="100dp"
        android:textColor="@color/white"
        android:textSize="26dp"
        android:textStyle="normal" />

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="60dp"
        android:gravity="center"
        android:orientation="vertical" >

        <ImageButton
            android:id="@+id/btnSpeak"
            android:layout_width="81dp"
            android:layout_height="81dp"
            android:background="@drawable/ico_mic"
            android:adjustViewBounds="false" />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:text="@string/tap_on_mic"
            android:textColor="@color/white"
            android:textSize="15dp"
            android:textStyle="normal" />
    </LinearLayout>

</RelativeLayout>

Terakhir, buka MainActivity.java dan lakukan beberapa perubahan kode. Cara simple ini cukup dengan 2 langkah.

Langkah 1 : Mulai RecognizerIntent

Pertama kita perlu membuat RecognizerIntent dengan mengatur Flags yang diperlukan seperti
ACTION_RECOGNIZE_SPEECH - MEngambil data input dan kembalikan ke activity yang sama.
LANGUAGE_MODEL_FREE_FROM - Menganggap input dalam bahasa Inggris.
EXTRA_PROMPT - Teks dialog muncul ke pengguna untuk menanyakan pengguna untuk berbicara.

Langkah 2 : Menerima Respon Suara
Setelah input suara dilakukan, maka kita harus menangkap respon tersebut di onActivityResult kemudian mengambil tindakan yang tepat.

package infinitylogicstudio.androidspeech;

import android.content.ActivityNotFoundException;
import android.content.Intent;
import android.os.Bundle;
import android.speech.RecognizerIntent;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageButton;
import android.widget.TextView;
import android.widget.Toast;

import java.util.ArrayList;
import java.util.Locale;

public class MainActivity extends AppCompatActivity {

    private TextView txtSpeechInput;
    private ImageButton btnSpeak;
    private final int REQ_CODE_SPEECH_INPUT = 100;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        txtSpeechInput = (TextView) findViewById(R.id.txtSpeechInput);
        btnSpeak = (ImageButton) findViewById(R.id.btnSpeak);

        btnSpeak.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                promptSpeechInput();
            }
        });
    }

    /**
    * MUNCULKAN DIALOG GOOGLE SPEECH INPUT
    * */
    private void promptSpeechInput() {
        Intent intent = new Intent(RecognizerIntent.ACTION_RECOGNIZE_SPEECH);
        intent.putExtra(RecognizerIntent.EXTRA_LANGUAGE_MODEL,
                RecognizerIntent.LANGUAGE_MODEL_FREE_FORM);
        intent.putExtra(RecognizerIntent.EXTRA_LANGUAGE, Locale.getDefault());
        intent.putExtra(RecognizerIntent.EXTRA_PROMPT,
                getString(R.string.speech_prompt));
        try {
            startActivityForResult(intent, REQ_CODE_SPEECH_INPUT);
        } catch (ActivityNotFoundException a) {
            Toast.makeText(getApplicationContext(),
                    getString(R.string.speech_not_supported),
                    Toast.LENGTH_SHORT).show();
        }
    }

    /**
     * TERIMA SPEECH INPUT
     * */
    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        switch (requestCode) {
            case REQ_CODE_SPEECH_INPUT: {
                if (resultCode == RESULT_OK && null != data) {

                    ArrayList<String> result = data
                            .getStringArrayListExtra(RecognizerIntent.EXTRA_RESULTS);
                    txtSpeechInput.setText(result.get(0));
                }
                break;
            }

        }
    }


}

Build dan install pada smartphone kalian, pastikan kalian mempunyai koneksi yang bagus untuk mencoba fitur ini. :D

Okey, cukup sekian dulu tutorial kita kali ini....
Kalau ada kesulitan, pertanyaan silahkan komntar dibawah ini.

Terima Kasih.

Share on Google Plus

About Unknown

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.