Layout Probleme

[Simon2202]

Hallo Community!

Ich habe mir eine TestApp erstellt. Man kann dort eine Zahl eingeben die unten in einem Toast ausgegeben wird.

Und ich habe mir in Android Studio das Layout erstellt (Screenshot der xml Datei unten angehängt) Sowie diesen xml Code dazu geschrieben: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" - Pastebin.com

Am Handy sieht das ganze jedoch komplett verschoben aus. Habt ihr Vorschläge wie ich das lösen kann bzw auch mir generelle Tipps für das erstellen von Layouts geben?

 

[Kardroid]

Hallo Simon,

wenn ich es richtig sehe, möchtest du einen RoundedCorners Hintergrund für dein Edittext haben, oder?
Ich habe dein Code mal importiert. Dein Background hat die RoundedCorners? Das finde ich falsch.

Es gibt mindestens zwei Möglichkeiten wie man es erstellen kann. Eine schnelle und eine richtige.
Die schnelle wäre:
Erstell noch ein RelativeLayout um dein Edittext und setz da als Background die RoundedCorners. Am besten als 9-Patch.

Die richtige wäre, du erstellst dir ein CustomEditText mit dem Background als 9-Patch. In diesem Background kannst du dann auch die Android Striche drin lassen.

Bei der ersten Methode solltest du auch ohne 9-Patch auskommen, bei der zweiten bleibt dir nichts anderes übrig.

Tips für ein Layout in Android gib es nicht direkt. Übung macht hier den Meister, man muss ein wenig in Schichten denken und auch die Möglichkeiten der Relative/Linear etc. Layouts kennen.
Auch ist es wichtig, direkt für alle Handy- und Tabletgrößen mitzudenken. Lieber etwas vertical scrollable machen, als feste verticale Positionen zu bestimmen. TextViews fast immer so programmieren, dass sie auch mehrzeilig funktionieren könnten etc.

 

[Simon2202]

@Kardroid

Hallo erstmal und danke für deine Antwort! Ich muss dazu sagen, was man aber wahrscheinlich bereits bemerkt hat, dass ich noch sehr am Anfang stehe!

1. Kannst du mir das mit 9-Patch erklären oder sollte ich das am besten online nachschauen?

2. Wenn der Button gedrückt wird soll eine zweite Version erscheinen die eben den gedrückten Button darstellt (hoffe du verstehst was ich da meine) wie kann ich das effektiv umsetzen?

lG Simon

 

[Kardroid]

Hallo Simon,

ich habe alleine ca. 3 Projekte gebraucht, bis ich 9-Patch wirklich verstanden habe. Im Grunde ist es ganz einfach, aber es ist wie bei vielen anderen Dingen. Es kommt einem schwer vor, aber wenn man es versteht ist es einfach

Das besondere an 9-Patch ist, dass diese Hintergründe sich an der Breite und Höhe des Vaters skallieren können.
Bei deinem Beispiel mit den RoundedCorners ist es nämlich so, dass die runden Ecken sich verzerren, wenn du von einem 360DP Gerät auf ein 320DP Gerät wechselst.
Bei einer 9-Patch-Datei bestimmst man selber, welcher Bereich skalliert werden darf, und welcher nicht. Dabei muss man einen 1 Pixel großen schwarzen Rand an genau den Stellen erstellen, an denen resized werden darf.
Es gibt noch eine kleine Besonderheit. Der obere und linke Rand ist für das Resizen, der untere und rechte für den Content.
Referenz: Draw 9-patch | Android Developers

Den Editor in Android Studio für 9-Patch finde ich auch nicht optimal. Ich benutze eine OpenSource-Alternative für den Mac. Falls du mit Windows arbeitest, wirst du sicher noch bessere Alternativen finden.

Du musst die 9-Patch Datei dann nur noch als android:background setzen und sie skalliert dann automatisch.

Bitte stell dir das Programmieren nicht zu einfach vor. Ich bin jetzt seit ca. 7 Jahren aus der Uni raus und habe seit dem fast jeden Tag programmiert. Trotzdem fällt es mir immer wieder schwer in eine neue Programmiersprache und deren Eigenheiten einzuarbeiten.

Leider verstehe ich deine zweite Frage nicht. Ich weiß nicht, was passieren soll, wenn du den Button drückst.

 

[Jaiel]

Hallo,

Ja 9-Patch ist ein Thema für sich....
@Kardroid Ich glaube er möchte den Button einen neuen Background zuweisen....sry bin auch schon wieder weg

 

[Kardroid]

Achso. Aber soll der Button nur anzeigen, wenn ein Finger drauf ist, dass er auch wirklich drauf ist, oder ist das eine Zustandsänderung?

Bei einer Zustandsänderung musst du natürlich programmatisch den Zustand speichern und auch programmatisch den Background ändern.

Wenn du den Button ändern willst, dass es aussieht, als ob ein Finger drauf ist, ist es schon ein wenig schwieriger.
Dafür brauchst du eine XML als Drawable.

Wir benutzen so eine:

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

    <item android:state_window_focused="false" android:drawable="@color/transparent" />

    <!-- Even though these two point to the same resource, have two states so the drawable will invalidate itself when coming out of pressed state. -->
    <item android:state_focused="true"  android:state_enabled="false" android:state_pressed="true" android:drawable="@drawable/click_background_disabled" />
    <item android:state_focused="true"  android:state_enabled="false"                              android:drawable="@drawable/click_background_disabled" />
    <item android:state_focused="true"                                android:state_pressed="true" android:drawable="@drawable/click_background_transition" />
    <item android:state_focused="false"                               android:state_pressed="true" android:drawable="@drawable/click_background_transition" />
    <item android:state_focused="true"                                                             android:drawable="@drawable/click_background_focus" />

</selector>

Natürlich müssen dann noch die Drawables für die Zustände erstellt werden.
Ich weiß nicht mehr, wo ich es her habe.

Dieses Lösung ist auch PreMaterialDesign. Beim Material Design gibt es ja solche Animationen. Diese Animationen habe ich noch nie eingebaut.

 

[Simon2202]

@Kardroid

1. Wie erstelle ich einen Custom EditText ? finde den nicht in Android Studio ...

Tut mir leid, ich bin noch sehr am Anfang!

Keine Sorge ich stelle es mir nicht besonders einfach vor, werde noch lange brauchen bis ich es auch nur halbwegs verstanden habe.

Das mit dem Button meinte ich solange der Finger drauf ist, also wenn man ihn anklickt, solange man ihn anklickt, dass er anders aussieht.

Beispiel: Bei Whatsapp klickt man auf den Chat und er wird statt weiß grau.

 

[Kardroid]

Das findet man auch nicht "direkt" im Android Studio.
Eine Custom EditText ist eine Klasse, die von EditText erbt:
public class MyEditText extends EditText {..}

Ich habe gerade nochmal in meinen Code geschaut. Dort konnte ich meine Änderungen an der Edittext auf alle Edittexte in der App ausweiten.
Ich habe dafür eine Theme erstellt. (themes.xml in Values)
Und dort ein CustomEditText definiert:

<style name="MySchemaEditText"
        parent="@android:style/Widget.EditText">
        <item name="android:editTextBackground">@drawable/apptheme_edit_text_holo_light</item>
    </style>

Die Drawable konnte ich aus dem Android System klauen. Ist jetzt nicht mehr Versionsspezifisch, aber für den Kunden ist es so sicher auch besser.

Für dich wäre hier vielleicht doch der Ansatz eines Backgrounds eines Layouts, in welchem du das EditText drin hast.
Einen Unterschied sieht man am Ende sowieso nicht, wenn es richtig gemacht ist.

Ich habe mir gerade die neuste Version von WhatsApp angesehen.
Meinst du die kurze Farbänderung, wenn man in der Liste aller Chats auf einen klickt, welcher sich dann öffnet?
Bei WhatsApp ist es in der neusten Version eine Material Design Animation.
Das habe ich leider noch nie implementiert. Hier gibt es ein Video davon:

Meinst du das?

Nach ein wenig googlen habe ich das gefunden:
xgc1986/RippleViews · GitHub

Dort steht aber, dass der "Ripple"-Effekt nur für SDK >=21 geht, vielleicht kannst du die Library ja benutzen und hast damit beides erschlagen.
Viel Erfolg