Android Entwicklung Teil 3 [Tutorial]

Im dritten Teil dieser Serie befassen wir uns mit einer etwas komplexeren App und festigen unser zuletzt erworbenes Wissen über Eclipse und die grundlegende App-Programmierung. 

Du wirst gleich deine erste „richtige“ App erstellen. Sie wird zwar simpel sein, aber immerhin komplexer als die erste „Hello World“ App. Wir werden einen Namen in ein Textfeld eingeben können und anschließend (nach Klick auf einen Button) einen Text mit diesem Namen wieder ausgegeben bekommen.

Die Logik

Die App soll folgende Funktionsweise haben:

  1. Auslesen des Textfeldes nach Klick auf einen Button
  2. Text in einer Variablen abspeichern
  3. Text aus Variable verändern
  4. Modifizierten Text in einem TextView ausgeben

Dafür benötigen wir lediglich eine einzige Methode, nämlich jene, die den Klick auf den Button bearbeitet.

Der Code

Wenn du die App aus dem ersten Tutorial noch hast, kannst du diese einfach weiterverwenden. Wenn nicht, erstelle folgende Klasse(passe jedoch Klassen-und Paketnamen an, sollten diese abweichen):
package de.mobilethingsblog.test;

import android.app.Activity;
import android.os.Bundle;
import android.view.View;
import android.widget.EditText;
import android.widget.TextView;

public class MainActivity extends Activity {

@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}
Nun wechseln wir in unser Layout „activity_main“ und fügen einen Button und ein EditText (Textfeld) hinzu. Anschließend verändern wir den Text der TextView. Insgesamt sollte dies nun so aussehen:
RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="de.mobilethingsblog.test.MainActivity"
tools:ignore="MergeRootFrame" >

<Button
android:id=“@+id/btn_clickme“
android:layout_width=“wrap_content“
android:layout_height=“wrap_content“
android:layout_centerHorizontal=“true“
android:layout_centerVertical=“true“
android:text=“Klick mich!“
android:onClick=“btn_clickme“ />

<TextView
android:id=“@+id/textView_yourtext“
android:layout_width=“wrap_content“
android:layout_height=“wrap_content“
android:layout_alignParentBottom=“true“
android:layout_centerHorizontal=“true“
android:layout_marginBottom=“45dp“
android:text=“Dein Text wird hier erscheinen :)“
android:textAppearance=“?android:attr/textAppearanceMedium“ />

<EditText
android:id=“@+id/editText_personname“
android:layout_width=“wrap_content“
android:layout_height=“wrap_content“
android:layout_alignParentTop=“true“
android:layout_centerHorizontal=“true“
android:layout_marginTop=“71dp“
android:hint=“Dein Name hierhin“
android:ems=“10″
android:inputType=“textPersonName“ >

<requestFocus />
</EditText>

</RelativeLayout
Interessant für uns sind die IDs, welche wir vergeben haben (btn_clickmetextView_yourtext und editText_personname) sowie die onClick ID des Buttons (btn_clickme). Diese benötigen wir gleich in der Codearbeit.

Die Klasse MainActivity

In die MainActivity schreiben wir nun die Funktion, welche den Klick auf den Button und all das bearbeitet, was folgt. Dafür müssen wir unserer App erst einmal sagen, welchen Button wir überhaupt meinen(zwar gibt es in diesem Projekt nur eine, aber das ändert sich später noch). Dies machen wir wie folgt:

 

public void btn_clickme (View view){

}
Dabei müssen wir beachten, dass wir „View“ importieren. Dies erfolgt, indem wir unseren Mauszeiger über „View“ bewegen und „import View“ aus dem aufpoppenden Menü auswählen.

Nun weiß die App zwar welchen Buton wir meinen, jedoch nicht, was darauf folgen soll. Ich habe den Code mal vorbereitet und werde ihn anschließend erklären:

 

Alles, was hinter zwei „//“ steht, ist ein Kommentar und für die Funktionsweise der App vollkommen unrelevant.

Die zweite und dritte Zeile weißt sowohl den EditText als auch die TextView als Name_Feld bzw. Ausgabe aus. Dies ist einfacher so zu handhaben, denn sonst müsste man jedesmal, wenn man beispielsweise den EditText ansprechen möchte die gesamte ID verwenden. So haben wir dies einmal festgelegt und können die Widgets Methodenweit verwenden.

Die fünfte Zeile sagt dem Gerät, dass der String „Benutzer_Name“ (eine Variable) das selbe zu sein hat, wie der Inhalt des in Zeile 2 festgelegten EditTextsName_Feld„.

In der sechsten Zeile schließlich verändern wir den Text aus der Variable. Wir hängen ein „Hallo“ vor den Benutzernamen und ein Ausrufezeichen sowie „Wie geht´s?“ dahinter. Die Ausgabe lautet dann in meinem Fall so: „Hallo Henrik! Wie geht´s?„.

Natürlich ist das ganze noch nicht reif für den Play Store (wer sowas braucht, müsste ziemlich einsam sein :).

Das war jetzt deine erste „richtige“ App 😉 Ich würde mich freuen, wenn du am Ball bleiben würdest und die nächste Folge ebenfalls beachtest. Dann werden wir diese App optimieren und unter anderem erfahren, was ein Toast ist, und was das mit Android zu tun hat. Wenn du fragen hast, darfst du sie gerne in den Kommentaren stellen!

Zum nächsten Tutorial dieser Serie

Zum letzten Tutorial dieser Serie

Ein Kommentar

  1. Martin 3. Oktober 2016

Was denkst du darüber?