Mobile 18 May 2021 253 views 0 komentar

Latihan 1 Pembuatan Calculator Sederhana di Android Studio

Latihan 1 Pembuatan Calculator Sederhana di Android Studio

Langkah 1: Desain Layout

Buat satu project android, kemudian silakan pilih berkas activity_main.xml pada workspace kamu(res/layout/activity_main.xml), dan ikutin coding seperti di bawah : 

<?xml version="1.0" encoding="utf-8"?></code><br /><code class="language-java"><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"</code><br /><code class="language-java">    xmlns:tools="http://schemas.android.com/tools"</code><br /><code class="language-java">    android:layout_width="match_parent"</code><br /><code class="language-java">    android:layout_height="match_parent"</code><br /><code class="language-java">    android:padding="16dp"</code><br /><code class="language-java">    android:orientation="vertical"></code><br /><code class="language-java"> </code><br /><code class="language-java">    <TextView</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:text="@string/length" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <EditText</code><br /><code class="language-java">        android:id="@+id/edt_length"</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:inputType="numberDecimal"</code><br /><code class="language-java">        android:lines="1" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <TextView</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:text="@string/width" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <EditText</code><br /><code class="language-java">        android:id="@+id/edt_width"</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:inputType="numberDecimal"</code><br /><code class="language-java">        android:lines="1" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <TextView</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:text="@string/height" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <EditText</code><br /><code class="language-java">        android:id="@+id/edt_height"</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:inputType="numberDecimal"</code><br /><code class="language-java">        android:lines="1" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <Button</code><br /><code class="language-java">        android:id="@+id/btn_calculate"</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:text="@string/calculate" /></code><br /><code class="language-java"> </code><br /><code class="language-java">    <TextView</code><br /><code class="language-java">        android:id="@+id/tv_result"</code><br /><code class="language-java">        android:layout_width="match_parent"</code><br /><code class="language-java">        android:layout_height="wrap_content"</code><br /><code class="language-java">        android:gravity="center"</code><br /><code class="language-java">        android:text="@string/result"</code><br /><code class="language-java">        android:textSize="24sp"</code><br /><code class="language-java">        android:textStyle="bold" /></code><br /><code class="language-java"></LinearLayout>

Penjelasan code di atas :
Layout yang digunakan adalah LinearLayout.
TextView wajib menambahkan attribut id untuk memanipulasi data dan attribut text wajib dimasukan ke berkas res/values/strings.xml atau tekan Alt+Enter pada bagian tanda warning yang muncul di attribut text dan dan extract string resource, isi sesuai dengan data dan akan otomatis masuk ke strings.xml

Langkah 2: Implementasi Logika Kalkulator

Selanjutnya setelah selesai, lanjutkan dengan membuka berkas MainActivity dan lanjutkan ngoding baris-baris di bawah ini :

public class MainActivity extends AppCompatActivity implements View.OnClickListener {</code><br /><code class="language-java">    private EditText edtWidth, edtHeight, edtLength;</code><br /><code class="language-java">    private Button btnCalculate;</code><br /><code class="language-java">    private TextView tvResult;</code><br /><code class="language-java"> </code><br /><code class="language-java">    @Override</code><br /><code class="language-java">    protected void onCreate(Bundle savedInstanceState) {</code><br /><code class="language-java">        super.onCreate(savedInstanceState);</code><br /><code class="language-java">        setContentView(R.layout.activity_main);</code><br /><code class="language-java"> </code><br /><code class="language-java">        edtWidth = findViewById(R.id.edt_width);</code><br /><code class="language-java">        edtHeight = findViewById(R.id.edt_height);</code><br /><code class="language-java">        edtLength = findViewById(R.id.edt_length);</code><br /><code class="language-java">        btnCalculate = findViewById(R.id.btn_calculate);</code><br /><code class="language-java">        tvResult = findViewById(R.id.tv_result);</code><br /><code class="language-java"> </code><br /><code class="language-java">        btnCalculate.setOnClickListener(this);</code><br /><code class="language-java">    }</code><br /><code class="language-java"> </code><br /><code class="language-java">    @Override</code><br /><code class="language-java">    public void onClick(View v) {</code><br /><code class="language-java">        if (v.getId() == R.id.btn_calculate) {</code><br /><code class="language-java">            String inputLength = edtLength.getText().toString().trim();</code><br /><code class="language-java">            String inputWidth = edtWidth.getText().toString().trim();</code><br /><code class="language-java">            String inputHeight = edtHeight.getText().toString().trim();</code><br /><code class="language-java"> </code><br /><code class="language-java">            boolean isEmptyFields = false;</code><br /><code class="language-java"> </code><br /><code class="language-java">            if (TextUtils.isEmpty(inputLength)) {</code><br /><code class="language-java">                isEmptyFields = true;</code><br /><code class="language-java">                edtLength.setError("Field ini tidak boleh kosong");</code><br /><code class="language-java">            }</code><br /><code class="language-java"> </code><br /><code class="language-java">            if (TextUtils.isEmpty(inputWidth)) {</code><br /><code class="language-java">                isEmptyFields = true;</code><br /><code class="language-java">                edtWidth.setError("Field ini tidak boleh kosong");</code><br /><code class="language-java">            }</code><br /><code class="language-java"> </code><br /><code class="language-java">            if (TextUtils.isEmpty(inputHeight)) {</code><br /><code class="language-java">                isEmptyFields = true;</code><br /><code class="language-java">                edtHeight.setError("Field ini tidak boleh kosong");</code><br /><code class="language-java">            }</code><br /><code class="language-java"> </code><br /><code class="language-java">            if (!isEmptyFields) {</code><br /><code class="language-java">                double volume = Double.valueOf(inputLength) * Double.valueOf(inputWidth) * Double.valueOf(inputHeight);</code><br /><code class="language-java">                tvResult.setText(String.valueOf(volume));</code><br /><code class="language-java">            }</code><br /><code class="language-java">        }</code><br /><code class="language-java">    }</code><br /><code class="language-java">}

Penjelasan code di atas :
Pertama elemen kosong harus di declare-kan terlebih dahulu.
Kemudian set element dengan textView pada event onCreate dan memberikan perintah untuk action pada button.
Lalu buat event Onclick untuk melakukan perintah, dengan urutan pengambilan data, pengecekan data jika kosong dan memproses data lalu menampilkan pada textView.

Langkah 3: Menangani Perubahan Orientasi

untuk mengatasi data hilang ketika perubahan orientasi tambahkan script ini :

public class MainActivity extends AppCompatActivity implements View.OnClickListener{</code><br /><code class="language-java">    private EditText edtWidth;</code><br /><code class="language-java">    private EditText edtHeight;</code><br /><code class="language-java">    private EditText edtLength;</code><br /><code class="language-java">    private Button btnCalculate;</code><br /><code class="language-java">    private TextView tvResult;</code><br /><code class="language-java"> </code><br /><code class="language-java">    private static final String STATE_RESULT = "state_result";</code><br /><code class="language-java"> </code><br /><code class="language-java">    @Override</code><br /><code class="language-java">    protected void onCreate(Bundle savedInstanceState) {</code><br /><code class="language-java">        ...</code><br /><code class="language-java">    }</code><br /><code class="language-java"> </code><br /><code class="language-java">    @Override</code><br /><code class="language-java">    protected void onSaveInstanceState(Bundle outState) {</code><br /><code class="language-java">        super.onSaveInstanceState(outState);</code><br /><code class="language-java">        outState.putString(STATE_RESULT, tvResult.getText().toString());</code><br /><code class="language-java">    }</code><br /><code class="language-java"> </code><br /><code class="language-java">    ...</code><br /><code class="language-java">}

Dan tambahkan juga di dalam onCreate

@Override</code><br /><code class="language-java">protected void onCreate(Bundle savedInstanceState) {</code><br /><code class="language-java">    super.onCreate(savedInstanceState);</code><br /><code class="language-java">    setContentView(R.layout.activity_main);</code><br /><code class="language-java"> </code><br /><code class="language-java">    ...</code><br /><code class="language-java"> </code><br /><code class="language-java">    if (savedInstanceState != null) {</code><br /><code class="language-java">        String result = savedInstanceState.getString(STATE_RESULT);</code><br /><code class="language-java">        tvResult.setText(result);</code><br /><code class="language-java">    }</code><br /><code class="language-java">}

Kesimpulan

*Update Android Studio 4.1
Selamat mencoba, terima kasih

Tags Artikel: #Latihan

Bagikan artikel ini:

Komentar (0)

Belum ada komentar. Jadilah yang pertama memberikan tanggapan!

Tinggalkan Komentar