Wie kann ich die neuen " Floating Action -Taste" zwischen zwei Widgets / Layouts hinzufügen

? Waza_Be @ | Original: StackOverFlow
---

Ich denke, Sie die neue Android- Design-Richtlinien gesehen haben, mit dem neuen " Floating Action -Taste " aka " FAB "

Zum Beispiel diese rote Taste :

Wie kann ich die neuen " Floating Action -Taste" zwischen zwei Widgets / Layouts hinzufügen

Meine Frage klingt blöd, und ich habe schon viele Dinge ausprobiert, aber was ist der beste Weg, um auf diese Schaltfläche, an der Kreuzung von zwei Layouts zu setzen?

Im obigen exemple, ist diese Schaltfläche perfekt zwischen dem, was wir uns vorstellen können, ein Imageview und eine relativeLayout sein gelegt .

Ich habe bereits eine Menge Verbesserungen versucht, aber ich bin überzeugt, es gibt eine richtige Art und Weise, es zu tun .

Vielen Dank für den Austausch von Ideen .

---

Top 5 Antwort

1Dre @

Ich habe gerade gesehen das folgende Rede und denke, es kann den Prozess zu erklären.

https://www.youtube.com/watch?v=ctzWKRlTYHQ?t=18m44s

Die oberste Imageview folgt einem keyline daher die Anordnung der Schaltflächen kann leicht getan werden . Z.B. die oberste Imageview ist 112dp auf mobilen ( 56dp x 2) . Wenn der FAB 56dp dann muss layout_marginTop von 56dp (Höhe des FAB) + 28dp (die Hälfte der Höhe des zweiten 56dp box ) = 84dp haben .

Das ist genau das, was ich verstanden habe . Ich hoffe, dass es Sinn macht, und hilft Ihnen, irgendwie .

2Oleksii Kropachov @

Versuchen https://github.com/shamanland/floating-action-button ( http://shamanland.github.io/floating-action-button/com/shamanland/fab/FloatingActionButton.html ) :

dependencies {
    compile 'com.shamanland:fab:0.0.5'
}

Sie bietet Single -Widget mit der Möglichkeit, sie über Themen, XML oder Java - Code anpassen.

Wie kann ich die neuen " Floating Action -Taste" zwischen zwei Widgets / Layouts hinzufügen  Wie kann ich die neuen " Floating Action -Taste" zwischen zwei Widgets / Layouts hinzufügen

Es ist sehr einfach zu bedienen. Es stehen zur Verfügung normal und mini Umsetzung nach http://www.google.com/design/spec/patterns/promoted-actions.html Muster.

<com.shamanland.fab.FloatingActionButton
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:src="@drawable/ic_action_my"
    app:floatingActionButtonColor="@color/my_fab_color"
    app:floatingActionButtonSize="mini"
    />

Versuchen Sie, die https://github.com/shamanland/floating-action-button kompilieren. Es gibt erschöpfende Beispiel: hell und dunkel Themen, mit mit ListView, richten Sie zwischen zwei Ansichten .

3nathandrake @

Ich stieß auf dieses Post, während ich versuchte, es in meinem Projekt http://www.bignerdranch.com/blog/floating-action-buttons-in-android-l/ implementieren was Ich mag über sie ist, es tut Benutzung fremder Bibliotheken erforderlich .

4Hugh Jeffner @

Scheint, wie der sauberste Weg ist in diesem Beispiel auf :

Use a RelativeLayout Position the 2 adjacent views one below the other Align the FAB to the parent right/end and add a right/end margin Align the FAB to the bottom of the header view and add a negative margin, half the size of the FAB including shadow

Beispiel (aus shamanland Umsetzung angepasst), übernehmen FAB ist 64dp Hoch einschließlich Schatten

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

    <View
        android:id="@+id/header"
        android:layout_width="match_parent"
        android:layout_height="120dp"
    />

    <View
        android:id="@+id/body"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@id/header"
    />

    <whatever.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignBottom="@id/header"
        android:layout_marginBottom="-32dp"
        android:layout_marginRight="20dp"
    />

</RelativeLayout>
5Dalvik VM @

Sie können das Beispielprojekt von Google in Android Studio, indem Sie auf Datei> Importieren Beispiel importieren ...

Wie kann ich die neuen " Floating Action -Taste" zwischen zwei Widgets / Layouts hinzufügen

Dieses Beispiel enthält eine FloatingActionButton anzeigen, die von FrameLayout erbt .