Hai un approccio migliore per implementare il menu FAB di animazione senza usare alcuna libreria o per scrivere un enorme codice XML per le animazioni. spero che questo possa aiutare in futuro per qualcuno che ha bisogno di un modo semplice per implementarlo.
Solo usando la animate().translationY()funzione, puoi animare qualsiasi vista su o giù come ho fatto nel mio codice qui sotto, controlla il codice completo in github . Nel caso in cui tu stia cercando lo stesso codice in kotlin, puoi controllare il repository animato del menu FAB di repo code kotlin .
per prima cosa definisci tutti i tuoi FAB nello stesso posto in modo che si sovrappongano, ricorda che il FAB dovrebbe essere che vuoi fare clic e mostrare altri. per esempio:
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab3"
android:layout_width="@dimen/standard_45"
android:layout_height="@dimen/standard_45"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/standard_21"
app:srcCompat="@android:drawable/ic_btn_speak_now" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab2"
android:layout_width="@dimen/standard_45"
android:layout_height="@dimen/standard_45"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/standard_21"
app:srcCompat="@android:drawable/ic_menu_camera" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab1"
android:layout_width="@dimen/standard_45"
android:layout_height="@dimen/standard_45"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/standard_21"
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:layout_margin="@dimen/fab_margin"
app:srcCompat="@android:drawable/ic_dialog_email" />
Ora nella tua classe Java basta definire tutto il tuo FAB ed eseguire il clic come mostrato di seguito:
FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab);
fab1 = (FloatingActionButton) findViewById(R.id.fab1);
fab2 = (FloatingActionButton) findViewById(R.id.fab2);
fab3 = (FloatingActionButton) findViewById(R.id.fab3);
fab.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if(!isFABOpen){
showFABMenu();
}else{
closeFABMenu();
}
}
});
Usa il animation().translationY()per animare il tuo FAB, preferisco che tu usi l'attributo di questo metodo in DP poiché solo usando un int influirà sulla compatibilità del display con una risoluzione più alta o più bassa. come mostrato di seguito:
private void showFABMenu(){
isFABOpen=true;
fab1.animate().translationY(-getResources().getDimension(R.dimen.standard_55));
fab2.animate().translationY(-getResources().getDimension(R.dimen.standard_105));
fab3.animate().translationY(-getResources().getDimension(R.dimen.standard_155));
}
private void closeFABMenu(){
isFABOpen=false;
fab1.animate().translationY(0);
fab2.animate().translationY(0);
fab3.animate().translationY(0);
}
Ora definisci la dimensione sopra menzionata in res-> valori-> dimens.xml come mostrato di seguito:
<dimen name="standard_55">55dp</dimen>
<dimen name="standard_105">105dp</dimen>
<dimen name="standard_155">155dp</dimen>
È tutta speranza che questa soluzione possa aiutare le persone in futuro, che sono alla ricerca di una soluzione semplice.
MODIFICATO
Se vuoi aggiungere un'etichetta sul FAB, prendi semplicemente un LinearLayout orizzontale e metti il FAB con textview come etichetta e animi i layout se trovi qualche problema facendo questo, puoi controllare il mio codice di esempio in github, ho gestito tutta la compatibilità con le versioni precedenti problemi in quel codice di esempio. controlla il mio codice di esempio per FABMenu in Github
per chiudere il FAB su Backpress, sovrascrivi onBackPress () come mostrato di seguito:
@Override
public void onBackPressed() {
if(!isFABOpen){
this.super.onBackPressed();
}else{
closeFABMenu();
}
}
Lo screenshot ha anche il titolo con il FAB, perché lo prendo dal mio ingithub app di esempio presente
