Материал ФАБ морфинг - PullRequest
0 голосов
/ 18 декабря 2018

Согласно material.io Плавающая кнопка действия может быть превращена в меню действий, например this .Есть ли способ сделать это, используя только библиотеку материалов (без сторонних библиотек)?

Я пробовал эту библиотеку, но она закрывает потрясающую позицию в соответствии с нижней панелью приложения после закрытия меню.

Вот что я получил в результате Fab menu

Код:

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
    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">
    <com.google.android.material.appbar.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <androidx.appcompat.widget.Toolbar
            app:layout_scrollFlags="scroll|enterAlways|snap"
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?actionBarSize"/>
    </com.google.android.material.appbar.AppBarLayout>
    <androidx.viewpager.widget.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>
    <com.google.android.material.bottomappbar.BottomAppBar
        android:id="@+id/bottomBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:fabAlignmentMode="end"
        app:backgroundTint="?colorPrimary"
        android:layout_gravity="bottom">
        <com.google.android.material.tabs.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@android:color/transparent"/>
    </com.google.android.material.bottomappbar.BottomAppBar>
    <com.google.android.material.floatingactionbutton.FloatingActionButton
        app:useCompatPadding="true"
        app:layout_anchor="@id/bottomBar"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/fab"/>
    <View
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#53000000"
        android:visibility="invisible"
        android:id="@+id/overlay"/>
    <io.codetail.widget.RevealFrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <io.files.view.MenuCardView
            android:id="@+id/menu"
            android:visibility="invisible"
            android:layout_margin="56dp"
            android:layout_gravity="bottom|end"
            android:layout_width="wrap_content"
            app:cardUseCompatPadding="true"
            app:menu="@menu/new_tab_options"
            android:layout_height="wrap_content"/>
    </io.codetail.widget.RevealFrameLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>

MainActivity.kt

import android.os.Bundle
import android.view.View
import androidx.appcompat.app.AppCompatActivity
import com.konifar.fab_transformation.FabTransformation
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        overlay.setOnClickListener {
            FabTransformation.with(fab)
                .setOverlay(it)
                .transformFrom(menu)
        }
        fab.setOnClickListener {
            FabTransformation.with(it)
                .setOverlay(overlay)
                .transformTo(menu)
        }
    }

    override fun onBackPressed() {
        if(menu.visibility== View.VISIBLE){
            FabTransformation.with(fab)
                .setOverlay(overlay)
                .transformFrom(menu)
        }else super.onBackPressed()
    }
}

1 Ответ

0 голосов
/ 21 декабря 2018

Только что найдено решение: используйте com.google.android.material.transformation.FabTransformationSheetBehavior для макета листа и com.google.android.material.transformation.FabTransformationScrimBehavior для вида наложения.Для поддержки хорошей анимации используйте com.google.android.material.transformation.TransformationChildCard или com.google.android.material.transformation.TransformationChildLayout для корневого просмотра листа.Чтобы преобразовать fab в лист, установите isExpanded для fab в true и для преобразования его в обратном направлении установите isExpanded в false

...