Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Floating Action Button at the end of a CoordinatorLayout

I'm trying to move my button in a CoordinatorLayout but without good result.

Notice: It's not a single fab button! There are 2 more invisible in the background. There are also a cardview that is invisible, and in that situation my fab button isnt't in the bottom right corner.

What I've tryed: I've tryed to follow CoordinatorLayout, FAB and container layout conflict

enter image description here

Layout

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

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/cardview_default_margin">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="@dimen/padding_detail_card">

                    <!-- Nominativo -->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_nominativo"
                        style="@style/AppTheme.NoActionBar.Text.Primary"/>

                    <!-- Identificativo -->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_identificativo"
                        style="@style/AppTheme.NoActionBar.Text.Primary"/>

                    <!-- Data -->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_data"
                        style="@style/AppTheme.NoActionBar.Text.Primary"/>

                    <!-- Indirizzo -->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_indirizzo"
                        style="@style/AppTheme.NoActionBar.Text.Primary" />

                    <!-- Telefono -->
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_telefono"
                        style="@style/AppTheme.NoActionBar.Text.Primary" />
                </LinearLayout>
            </android.support.v7.widget.CardView>
            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/cardview_default_margin">

                <!-- Colli -->
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="@dimen/padding_detail_card">

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_colli"
                            android:textStyle="bold"/>

                        <EditText
                            android:layout_width="70dp"
                            android:layout_height="wrap_content"
                            android:inputType="number"
                            style="@style/AppTheme.NoActionBar.EditText.Primary"
                            android:id="@+id/et_colli"/>

                    </LinearLayout>

                    <!-- Pallet ritiro -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_pallet"
                            android:textStyle="bold"/>

                        <EditText
                            android:layout_width="70dp"
                            android:layout_height="wrap_content"
                            android:inputType="number"
                            style="@style/AppTheme.NoActionBar.EditText.Primary"
                            android:id="@+id/et_pallet_ritiro"/>

                    </LinearLayout>

                    <!-- Pallet consegne -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_pallet_consegne"
                            android:textStyle="bold"/>

                        <EditText
                            android:layout_width="70dp"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.EditText.Primary"
                            android:id="@+id/et_pallet_consegne"/>

                    </LinearLayout>
                </LinearLayout>
            </android.support.v7.widget.CardView>
            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/cardview_default_margin">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:paddingStart="@dimen/padding_detail_card">

                    <!-- Note documento-->
                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:id="@+id/tv_note_documento"
                        style="@style/AppTheme.NoActionBar.Text.Primary"/>

                    <!-- Note fisse -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_note"
                            android:textStyle="bold"/>

                        <Spinner
                            android:layout_width="250dp"
                            android:layout_height="wrap_content"
                            android:id="@+id/sp_note"
                            android:background="@drawable/spinner_gradient"/>

                    </LinearLayout>

                    <!-- Note operative -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_note_operative"
                            android:textStyle="bold"/>

                        <EditText
                            android:layout_width="70dp"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.EditText.Primary"
                            android:id="@+id/et_note_operative"/>
                    </LinearLayout>

                    <!-- Note destinazione -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="horizontal">

                        <TextView
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.Text.Secondary"
                            android:text="@string/card_note_destinazione"
                            android:textStyle="bold"/>

                        <EditText
                            android:layout_width="70dp"
                            android:layout_height="wrap_content"
                            style="@style/AppTheme.NoActionBar.EditText.Primary"
                            android:id="@+id/card_note_destinazione"/>
                    </LinearLayout>
                </LinearLayout>
            </android.support.v7.widget.CardView>
            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/card_consegne"
                android:layout_margin="@dimen/cardview_default_margin">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="16dp">


                    <!-- NOMINATIVO RICEVENTE -->
                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:orientation="vertical">

                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="horizontal">

                            <TextView
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:text="@string/card_nome_ricevente"
                                style="@style/AppTheme.NoActionBar.Text.Secondary"/>

                            <EditText
                                android:layout_width="200dp"
                                android:layout_height="wrap_content"
                                style="@style/AppTheme.NoActionBar.EditText.Primary"
                                android:id="@+id/et_nome_ricevente"/>

                        </LinearLayout>

                        <!-- COGNOME RICEVENTE -->
                        <LinearLayout
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:orientation="vertical">

                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal">

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="@string/card_cognome_ricevente"
                                    style="@style/AppTheme.NoActionBar.Text.Secondary"/>

                                <EditText
                                    android:layout_width="200dp"
                                    android:layout_height="wrap_content"
                                    style="@style/AppTheme.NoActionBar.EditText.Primary"
                                    android:id="@+id/et_cognome_ricevente"/>

                            </LinearLayout>

                            <!-- DATA CONSEGNA -->
                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal">

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="@string/card_data_consegna"
                                    style="@style/AppTheme.NoActionBar.Text.Secondary"/>

                                <EditText
                                    android:layout_width="200dp"
                                    android:layout_height="wrap_content"
                                    style="@style/AppTheme.NoActionBar.EditText.Primary"
                                    android:id="@+id/et_data_consegna" />

                                <Button
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:id="@+id/current_date"
                                    android:text="@string/action_set"
                                    style="@style/AppTheme.NoActionBar.Button.Set"/>

                            </LinearLayout>

                            <LinearLayout
                                android:layout_width="match_parent"
                                android:layout_height="wrap_content"
                                android:orientation="horizontal">

                                <CheckBox
                                    android:layout_width="50dp"
                                    android:layout_height="wrap_content"
                                    android:id="@+id/cb_pagamento_consegna"
                                    android:buttonTint="@color/colorPrimary"/>

                                <TextView
                                    android:layout_width="wrap_content"
                                    android:layout_height="wrap_content"
                                    android:text="@string/card_pagamento_consegna"
                                    style="@style/AppTheme.NoActionBar.Text.Secondary" />
                            </LinearLayout>
                        </LinearLayout>
                    </LinearLayout>
                </LinearLayout>
            </android.support.v7.widget.CardView>
        </LinearLayout>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_salva"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="160dp"
            android:layout_gravity="bottom|end"
            android:layout_marginEnd="@dimen/fab_margin"
            android:visibility="invisible"
            app:backgroundTint="@color/colorAccent"
            app:elevation="6dp"
            app:pressedTranslationZ="12dp"
            android:src="@drawable/ic_document_salva" />
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_firma"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="90dp"
            android:layout_gravity="bottom|end"
            android:layout_marginEnd="@dimen/fab_margin"
            android:visibility="invisible"
            app:elevation="6dp"
            app:backgroundTint="@color/colorAccent"
            app:pressedTranslationZ="12dp"
            android:src="@drawable/ic_document_firma" />
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab_action"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            app:elevation="6dp"
            app:backgroundTint="@color/colorAccent"
            app:pressedTranslationZ="12dp"
            android:layout_margin="@dimen/fab_margin"
            android:src="@drawable/ic_document_fab" />

    </android.support.design.widget.CoordinatorLayout>
</ScrollView>
like image 585
G. Ciardini Avatar asked Dec 11 '22 06:12

G. Ciardini


1 Answers

You must set the CoordinatorLayout as Parent Layout with a match_parent height and then the ScrollView as a child (with your content inside) and your FAB oustide the ScrollView (in the CoordinatorLayout) like :

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <android.support.v7.widget.CardView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="@dimen/cardview_default_margin">
            </android.support.v7.widget.CardView>

            ... Other content ...

        </LinearLayout>

    </ScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_salva"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="160dp"
        android:layout_gravity="bottom|end"
        android:layout_marginEnd="@dimen/fab_margin"
        android:visibility="invisible"
        app:backgroundTint="@color/colorAccent"
        app:elevation="6dp"
        app:pressedTranslationZ="12dp"
        android:src="@drawable/ic_document_salva" />
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_firma"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="90dp"
        android:layout_gravity="bottom|end"
        android:layout_marginEnd="@dimen/fab_margin"
        android:visibility="invisible"
        app:elevation="6dp"
        app:backgroundTint="@color/colorAccent"
        app:pressedTranslationZ="12dp"
        android:src="@drawable/ic_document_firma" />
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab_action"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        app:elevation="6dp"
        app:backgroundTint="@color/colorAccent"
        app:pressedTranslationZ="12dp"
        android:layout_margin="@dimen/fab_margin"
        android:src="@drawable/ic_document_fab" />
</android.support.design.widget.CoordinatorLayout>
like image 99
Bubu Avatar answered Jan 12 '23 20:01

Bubu