Estoy empezando a trabajar con los botones flotantes (Fab) y me gustaría resolver una duda.
A la hora de implementarlos no tengo problemas, pero si que me gustaría cambiar la disposición de los botones al pulsar el botón principal.
Adjunto una imagen para explicarme mejor:
Esto es lo que he codificado hasta ahora:
- Java
Para ello, he seguido el siguiente código
public void creacion_fab() {
fab_rankit = (FloatingActionButton) findViewById(R.id.fab_rankit);
fab_buscar = (FloatingActionButton) findViewById(R.id.fab_buscar);
fab_cambioActividad = (FloatingActionButton) findViewById(R.id.fab_cambioActividad);
fab_home = (FloatingActionButton) findViewById(R.id.fab_home);
FabOpen = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fab_open);
FabClose = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.fab_close);
FabClockwise = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate_anticlockwise);
FabAnticlockwise = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.rotate_clockwise);
fab_rankit.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (isOpen) {
fab_home.startAnimation(FabClose);
fab_cambioActividad.startAnimation(FabClose);
fab_buscar.startAnimation(FabClose);
fab_rankit.startAnimation(FabClockwise);
fab_home.setClickable(false);
fab_buscar.setClickable(false);
fab_cambioActividad.setClickable(false);
isOpen = false;
} else {
fab_home.startAnimation(FabOpen);
fab_cambioActividad.startAnimation(FabOpen);
fab_buscar.startAnimation(FabOpen);
fab_rankit.startAnimation(FabAnticlockwise);
fab_home.setClickable(true);
fab_buscar.setClickable(true);
fab_cambioActividad.setClickable(true);
isOpen = true;
}
}
}); } }
XML
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/id_principalActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="mario.rankit.Principal_Activity">
<include layout="@layout/content_principal_" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_home"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:backgroundTint="#0089D5"
android:elevation="6dp"
android:src="@drawable/home"
android:visibility="invisible"
app:fabSize="normal"
app:layout_anchor="@+id/fab_buscar"
app:layout_anchorGravity="top"
app:pressedTranslationZ="12dp"
/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_buscar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:backgroundTint="#0089D5"
android:elevation="6dp"
android:src="@drawable/fab_buscar"
android:visibility="invisible"
app:fabSize="normal"
app:layout_anchor="@+id/fab_cambioActividad"
app:layout_anchorGravity="top"
app:pressedTranslationZ="12dp"
/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_cambioActividad"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:backgroundTint="#0089D5"
android:elevation="6dp"
android:src="@drawable/fab_publicar"
android:visibility="invisible"
app:fabSize="normal"
app:layout_anchor="@+id/fab_rankit"
app:layout_anchorGravity="top"
app:pressedTranslationZ="12dp" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_rankit"
android:layout_width="75dp"
android:layout_height="74dp"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/fab_margin"
android:backgroundTint="#0089D5"
android:elevation="6dp"
android:icon="@mipmap/ic_launcher"
android:src="@drawable/logofinal"
app:fabSize="normal"
app:pressedTranslationZ="12dp"
/>
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="@style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorToolbar"
android:title="@string/titulo_principal"
app:popupTheme="@style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<ImageView
android:layout_width="42dp"
android:layout_height="42dp"
android:layout_marginLeft="310dp"
android:layout_marginTop="6dp"
android:background="@drawable/buscar" />
<ImageView
android:id="@+id/bt_alertas"
android:layout_width="42dp"
android:layout_height="42dp"
android:layout_marginLeft="250dp"
android:layout_marginTop="6dp"
app:srcCompat="@drawable/alertas" />
Sin embargo, lo que estoy buscando es la siguiente disposición de botones: (lo que adjunto no es sino tan sólo una imagen diseñada a través de Paint. No esta codificado)
¿Alguno sabe como implementarla? Gracias