Floating action-Menü, in einem anderen schwimmenden Menü Aktion

Möchte ich hinzufügen, dass eine schwebende Aktion im Menü innerhalb einer anderen schwimmenden Menü „Aktion“.ich möchte, dass meine Eltern floating-Menü „Aktion“ von unten nach oben und sub-floating action-Menü von rechts nach Links Richtung.Ich habe versucht, mit Bibliotheken, aber keine Bibliothek-Unterstützung ist die Unterstützung dieser Funktionalität. kann mir jemand helfen.

unten ist Bild von dem, was ich versuche zu bekommen

Floating action-Menü, in einem anderen schwimmenden Menü Aktion

  • Versuchen Sie, diese lib github.com/Clans/FloatingActionButton, Es ist einfach zu bedienen
  • ich habe versucht, mit, dass die Bibliothek, aber ich bin nicht in der Lage, implementieren Sie ein Menü in ein anderes Menü.
  • Eine Darstellung von dem, was Sie wollen, werden hilfsbereit
  • können Sie zeigen ein Bild von Ihr erwartete Ergebnis.
  • sicher, Aktie
  • ich habe anbei das Bild. bitte helfen Sie mir.
  • ich habe anbei das Bild. bitte helfen Sie mir.
  • prüfen Sie das stackoverflow.com/a/45100635/7666442 machen Sie einige änderungen, wie pro Ihre Anforderung, ich denke das wird dir helfen
  • also die einzige Möglichkeit ist das erstellen von benutzerdefinierten layout und Griff Sichtbarkeit?
  • kann sein, weil Sie brauchen, um zu erstellen Sie Ihre eigenen benutzerdefinierten Ansicht für Ihre Anforderung lassen Sie mich wissen, wenn einer Hilfe benötigt

InformationsquelleAutor Amrutha Saj | 2018-02-02



3 Replies
  1. 3

    Keine Bibliothek unterstützt diese Funktionalität, da geht es gegen Material-Design-Richtlinien.

    Nicht setzen overflow-Menüs in den floating action button Aktionen. Es sollte bei den meisten zwei Hähne aus dem ersten Bildschirm, um die beabsichtigte Ziel.

    Ich schlage vor, Sie überdenken das design, erinnere mich an eine floating-action-button muss Sie verwandeln sich in Verwandte Aktionen. Sie bewegen könnte, es so haben Sie zwei floating-action-Schaltflächen, oder verschieben Sie die sekundäre Menü zu einem überlauf-Menü.

  2. 0

    Wenn Sie nicht wollen, zu verwenden, Bibliothek , können Sie versuchen, diese mit einem benutzerdefinierten
    layout und

    <?xml version="1.0" encoding="utf-8"?>

    <LinearLayout
        android:id="@+id/fab1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:layout_gravity="bottom|end"
        android:layout_marginRight="8dp"
        android:layout_marginBottom="90dp"
        android:layout_marginEnd="8dp"
        android:orientation="horizontal">
    
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardBackgroundColor="@color/white"
            app:cardCornerRadius="@dimen/cardCornerRadius"
            app:cardElevation="@dimen/cardElevation"
            app:cardUseCompatPadding="true" >
            <TextView
                android:id="@+id/fab1_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Bookmark category"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:textStyle="bold"
                android:textColor="@color/black_dark"
                android:paddingRight="@dimen/cardview_horizontal_padding"
                android:paddingLeft="@dimen/cardview_horizontal_padding"
                android:paddingBottom="@dimen/cardview_vertical_padding"
                android:paddingTop="@dimen/cardview_vertical_padding" />
        </android.support.v7.widget.CardView>
    
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab1_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:elevation="0dp"
            app:srcCompat="@drawable/ic_star_border_black_24dp"
            app:backgroundTint="@color/colorPrimaryDark"
            app:fabSize="mini" />
    
    </LinearLayout>
    
    <LinearLayout
        android:id="@+id/fab2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:layout_gravity="bottom|end"
        android:layout_marginRight="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="140dp"
        android:orientation="horizontal">
    
        <android.support.v7.widget.CardView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:cardBackgroundColor="@color/white"
            app:cardCornerRadius="@dimen/cardCornerRadius"
            app:cardElevation="@dimen/cardElevation"
            app:cardUseCompatPadding="true" >
    
            <TextView
                android:id="@+id/fab2_text"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Add post "
                android:textColor="@color/black_dark"
                android:textAppearance="?android:attr/textAppearanceSmall"
                android:textStyle="bold"
                android:paddingRight="@dimen/cardview_horizontal_padding"
                android:paddingLeft="@dimen/cardview_horizontal_padding"
                android:paddingBottom="@dimen/cardview_vertical_padding"
                android:paddingTop="@dimen/cardview_vertical_padding" />
    
        </android.support.v7.widget.CardView>
    
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab2_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:elevation="0dp"
            app:srcCompat="@drawable/ic_add_white_24dp"
            app:backgroundTint="@color/blue"
            app:fabSize="mini" />
    
    </LinearLayout>
    
    
    
    <LinearLayout
        android:id="@+id/layoutFabSettings"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_vertical"
        android:layout_gravity="bottom|end"
        android:layout_marginBottom="16dp"
        android:orientation="horizontal">
    
        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fabSetting"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            app:elevation="0dp"
            app:srcCompat="@drawable/ic_close_black_24dp"
            app:backgroundTint="@color/colorPrimary"
            app:fabSize="normal" />
    
    </LinearLayout>

    Und in Ihre Klasse-Datei, die Sie verwenden können,

         private FloatingActionButton fabSettings;
            private LinearLayout fab1;
            private LinearLayout fab2;
    
     fabSettings = this.findViewById(R.id.fabSetting);
        fab1 = this.findViewById(R.id.fab1);
        fab2 = this.findViewById(R.id.fab2);
    
        fab1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
    
            }
        });
    
        fab2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
    
            }
        });
    
        //When main Fab (Settings) is clicked, it expands if not expanded already.
        //Collapses if main FAB was open already.
        //This gives FAB (Settings) open/close behavior
        fabSettings.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                if (fabExpanded == true){
                    closeSubMenusFab();
                } else {
                    openSubMenusFab();
                }
            }
        });
    
        //Only main FAB is visible in the beginning
        closeSubMenusFab();
    
     //closes FAB submenus
        private void closeSubMenusFab(){
            fab1.setVisibility(View.INVISIBLE);
            fab2.setVisibility(View.INVISIBLE);
    
            fabSettings.setImageResource(R.drawable.ic_star_border_black_24dp);
            fabExpanded = false;
        }
    
        //Opens FAB submenus
        private void openSubMenusFab(){
            fab1.setVisibility(View.VISIBLE);
            fab2.setVisibility(View.VISIBLE);
    
            //Change settings icon to 'X' icon
            fabSettings.setImageResource(R.drawable.ic_close_black_24dp);
            fabExpanded = true;
        }

    Sieht es so aus

    Floating action-Menü, in einem anderen schwimmenden Menü Aktion

    • Sie können das layout wie pro Ihre Anforderung , und wie Sie bereits erwähnt haben gleichen design hergestellt werden konnte ,mithilfe der oben beschriebenen Methode , und Sie können auch hinzufügen einer animation auf Sie, um die besser Aussehen
  3. 0

    Tha layout-Datei

    <android.support.design.widget.CoordinatorLayout 
    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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".FloatingActivity">
    
    
    
    
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_marginBottom="90dp"
        android:layout_marginRight="70dp"
        android:visibility="invisible"
        app:backgroundTint="@color/colorAccent"
        app:elevation="6dp"
        app:pressedTranslationZ="12dp"
        app:srcCompat="@android:drawable/ic_menu_camera" />
    
    
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:layout_marginBottom="90dp"
        android:layout_marginRight="@dimen/fab_margin"
        android:visibility="invisible"
        app:backgroundTint="@color/colorAccent"
        app:elevation="6dp"
        app:pressedTranslationZ="12dp"
    
        app:srcCompat="@android:drawable/ic_dialog_map" />
    
    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|end"
        android:src="@android:drawable/ic_dialog_email"
        app:backgroundTint="@color/colorAccent"
        app:elevation="6dp"
        android:layout_margin="@dimen/fab_margin"
        app:pressedTranslationZ="12dp" />
     </android.support.design.widget.CoordinatorLayout>

    In Ihrer Aktivität,

      private FloatingActionButton fab, fab1,  fab3;
    private boolean isFABOpen = false;
    private Animation fab_open, fab_close, rotate_forward, rotate_backward;
    private boolean isfab3Open = false;
    
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_floating);
        fab = findViewById(R.id.fab);
        fab1 = findViewById(R.id.fab1);
        fab3 = findViewById(R.id.fab3);
        fab_open = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fab_open);
        fab_close = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fab_close);
        rotate_forward = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate_forward);
        rotate_backward = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate_backward);
    
        fab.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                animateFAB();
            }
           });
           fab1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                animateFab3();
            }
        });
       }
    
         private void animateFab3() {
           if (isfab3Open) {
            // fab1.startAnimation(rotate_backward);
            fab3.startAnimation(fab_close);
            fab3.setClickable(false);
            isfab3Open = false;
          } else {
         //  fab1.startAnimation(rotate_forward);
            fab3.startAnimation(fab_open);
            fab3.setClickable(true);
            isfab3Open = true;
        }
       }
    
         public void animateFAB() {
    
        if (isFABOpen) {
    
            fab.startAnimation(rotate_backward);
            fab1.startAnimation(fab_close);
            fab1.setClickable(false);
            isFABOpen = false;
    
        } else {
    
            fab.startAnimation(rotate_forward);
            fab1.startAnimation(fab_open);
            fab1.setClickable(true);
            isFABOpen = true;
    
        }    }   }

    Und die Animationen sind,
    fab_close.xml

     <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillAfter="true">
    <scale
        android:duration="300"
        android:fromXScale="0.8"
        android:fromYScale="0.8"
        android:interpolator="@android:anim/linear_interpolator"
        android:toXScale="0.0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toYScale="0.0" />
    <alpha android:fromAlpha="1.0"
        android:toAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:duration="300"/>
      </set>

    fab_open

     <?xml version="1.0" encoding="utf-8"?>
     <set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillAfter="true">
    <scale
        android:duration="300"
        android:fromXScale="0.0"
        android:fromYScale="0.0"
        android:interpolator="@android:anim/linear_interpolator"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toXScale="0.8"
        android:toYScale="0.8" />
    <alpha
        android:duration="300"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0" />
     </set>

    rotate_backward

    <?xml version="1.0" encoding="utf-8"?>
    <set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillAfter="true" >
    <rotate android:fromDegrees="45"
        android:toDegrees="0"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="300"
        android:interpolator="@android:anim/linear_interpolator"/>
    </set>

    rotate_forward

      <?xml version="1.0" encoding="utf-8"?>
      <set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillAfter="true" >
    <rotate android:fromDegrees="0"
        android:toDegrees="45"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="300"
        android:interpolator="@android:anim/linear_interpolator"/>
        </set>
    • lassen Sie mich versuchen, Ihre Antwort
    • ich habe versucht, Ihr code aber. das Problem ist, ich will die fabclose animation übersetzen nach unten in Richtung der fab-Taste. gibt es eine Möglichkeit, dies zu tun?
    • code njan razeem inu koduthat und
    • fab1.animieren().translationY(-getResources().getDimension(R. dimen.standard_55)); hier müssen Sie angeben, um die Höhe zu springen dimens.xml

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.