Interfejs użytkownika

Dziś krótko o interfejsie użytkownika. Krótko, bo jak widzicie po screenshotach moich aplikacji, nie zjadłam jeszcze zębów na UI w Androidzie. Dlatego napiszę o tym, co do tej pory było mi potrzebne.

Interfejs użytkownika aplikacji jest zdefiniowany poprzez hierarchię obiektów z klas ViewGroup i View. Klasa ViewGroup to podklasa klasy View.  Obiekty z tej klasy, to takie „pudełka”, w których znajdują się inne obiekty z klasy View, takie jak przyciski i pola tekstowe. Szczególnym przykładem obiektów z klasy ViewGroup są layouty (różnego rodzaju układy) definiujące architekturę komponentów aplikacji (aktywności, widgetów). Hierarchie obiektów z klasy View mogą mieć różny stopień skomplikowania. Poniżej przykład hierarchii ze strony http://developer.android.com/guide/topics/ui/overview.html zestawiony z raczej nieskomplikowaną hierarchią Mojej Pierwszej Aplikacji:

Obiekty określające UI mogą być zdefiniowane w plikach XML lub mogą być inicjowane w kodzie, w trakcie działania aplikacji. W Mojej Pierwszej Aplikacji aktywności my activity odpowiadał  plik content_my_activity.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/activity_my_activity">
    <EditText
        android:id="@+id/edit_message"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:hint="@string/edit_message" />
    <Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/button_send"
        android:onClick="sendMessage"/>
</LinearLayout>

Każdy z obiektów klasy View ma ustalone atrybuty, jak na przykład layout_weight, layout_width, text. W szczególności każdy obiekt z tej klasy posiada atrybut id, który umożliwia odwołanie się do będącego liczbą całkowitą identyfikatora obiektu.  Dzięki niemu do każdego obiektu możemy odwołać się w kodzie aplikacji. I tak na przykład poniższa metoda wyślij wiadomość za pomocą metody findViewById() wydobywa tekst wpisany w polu EditText:

 

public void sendMessage(View view){
    Intent intent = new Intent(this, DisplayMessageActivity.class);
    EditText editText = (EditText) findViewById(R.id.edit_message);
    String message = editText.getText().toString();
    intent.putExtra(EXTRA_MESSAGE, message);
    startActivity(intent);
}
Reklamy

Skomentuj

Wprowadź swoje dane lub kliknij jedną z tych ikon, aby się zalogować:

Logo WordPress.com

Komentujesz korzystając z konta WordPress.com. Wyloguj / Zmień )

Zdjęcie z Twittera

Komentujesz korzystając z konta Twitter. Wyloguj / Zmień )

Facebook photo

Komentujesz korzystając z konta Facebook. Wyloguj / Zmień )

Google+ photo

Komentujesz korzystając z konta Google+. Wyloguj / Zmień )

Connecting to %s