How to implement Menu display on Extended Floating Action Button click android

我们两清 提交于 2020-08-10 19:29:26

问题


I want to implement the Extended FAB button in the format mentioned on the material website (https://kstatic.googleusercontent.com/files/8f9b57829c943c97be7c4b2485cf678f041dfe7c7ef523cfb2e97f1aeee21431f83d98cc07befeeed904fabb258298e3a7ac95f9da5d3da7a4adcff658cea851)

https://material.io/components/buttons-floating-action-button#types-of-transitions

Kindly help on how to achieve the same.


回答1:


You can use the Material motion and the Transition between Views.

For example define in your layout:

<androidx.coordinatorlayout.widget.CoordinatorLayout 
      android:id="@+id/root"
      ..>

    <com.google.android.material.card.MaterialCardView
        android:id="@+id/end_card"
        android:visibility="gone" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        .. />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Then just define the MaterialContainerTransform:

    fab.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            showEndView(fab);
        }
    });

with:

private void showEndView(View startView) {


        // Construct a container transform transition between two views.
        MaterialContainerTransform transition = new MaterialContainerTransform();
        transition.setScrimColor(Color.TRANSPARENT);
        transition.setInterpolator(new FastOutSlowInInterpolator());
        //set the duration....

        //Define the start and the end view
        transition.setStartView(startView);
        transition.setEndView(endCard);
        transition.addTarget(startView);

        // Trigger the container transform transition.
        TransitionManager.beginDelayedTransition(root, transition);
        if (startView != null) {
            startView.setVisibility(View.INVISIBLE);
        }
        if (endCard != null) {
            endCard.setVisibility(View.VISIBLE);
        }
    }

Note: it requires at least the version 1.3.0-alpha01.



来源:https://stackoverflow.com/questions/62436242/how-to-implement-menu-display-on-extended-floating-action-button-click-android

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!