0
내 앱에서 플로팅 액션 버튼 메뉴를 만들려고합니다. 그것은 물자 디자인 가이드 라인에 의해 표시되는 활성 FAB의 종류 Google 캘린더 앱에서 FAB,과 같아야합니다Google 캘린더와 같은 Android 전체 화면 차단보기 FAB
여기를 참조하십시오 : 부동 액션 버튼을 초점에 색상을 변경 "에서 https://material.io/guidelines/components/buttons-floating-action-button.html#buttons-floating-action-button-floating-action-button
선정 될 때 들어 올린다. " 2 개의 비디오가 있습니다. 오른쪽 메뉴는이 메뉴의 모습을 보여줍니다. 나는이 회색 배경을 완벽하게 작동하지만 내가 achive 수없는 것은 버튼과 같은 메뉴가 그 작업 및 작업 표시 줄과 블록 (경고 등) 전체 UI ...
일반 :
그리고 선택 : 당신이 볼 수 있듯이
는 재료 디자인 가이드 라인은 선택된 FAB 전체 UI를 차단해야한다고 우리에게 알려줍니다. 하지만 ... 어떻게
를 모르는 그래서 나는이 순간에 무엇을 :
<?xml version="1.0" encoding="utf-8"?>
<layout>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:id="@+id/fab_background"
android:visibility="gone">
</RelativeLayout>
<android.support.design.widget.FloatingActionButton
android:id="@+id/global_fab_mini"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="90dp"
android:layout_marginRight="24dp"
android:src="@drawable/ic_credentials_light"
android:theme="@style/Base.Widget.AppCompat.ImageButton"
android:visibility="gone"
app:backgroundTint="@color/cool_grey"
app:fabSize="mini" />
<android.support.design.widget.FloatingActionButton
android:id="@+id/global_fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_margin="@dimen/fab_margin"
android:src="@drawable/ic_add_light"
android:theme="@style/Base.Widget.AppCompat.ImageButton"
app:fabSize="normal"
android:visibility="visible" />
</RelativeLayout>
</layout>
이 FAB는 해당 뷰 그룹 클래스가 있습니다 내 두 개의 팹 보유 global_fab.xml 있습니다 :
package de.mycompany.ui.view;
import android.content.Context;
import android.databinding.DataBindingUtil;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.View;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.FrameLayout;
import com.mycompany.package.android.R;
import com.mycompany.package.android.databinding.GlobalFabBinding;
public class GlobalFABView extends FrameLayout implements IGlobalFABView {
private GlobalFabBinding globalFABViewBinding;
private Listener listener;
private boolean fabMenuOpen = false;
public GlobalFABView(Context context, AttributeSet attrs) {
super(context, attrs);
init(context);
}
public GlobalFABView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context);
}
private void init(Context context) {
globalFABViewBinding = DataBindingUtil.inflate(LayoutInflater.from(context), R.layout.global_fab, this, false);
addView(globalFABViewBinding.getRoot());
this.globalFABViewBinding.globalFab.setOnClickListener(this::globalFabClicked);
this.globalFABViewBinding.fabBackground.setOnClickListener(this::backgroundClicked);
}
private void globalFabClicked(View v) {
this.listener.mainFabClicked();
}
private void backgroundClicked(View v) {
this.listener.backgroundClicked();
}
@Override
public void show() {
}
@Override
public void hide() {
}
@Override
public void setListener(Listener listener) {
this.listener = listener;
}
@Override
public void toggleFabMenu() {
Animation fabAnimation = AnimationUtils.loadAnimation(this.getContext(), this.fabMenuOpen ?
R.anim.global_fab_close :
R.anim.global_fab_open);
final boolean fabMenuOpen = this.fabMenuOpen;
if (!fabMenuOpen) {
globalFABViewBinding.globalFabMini.setVisibility(VISIBLE);
}
globalFABViewBinding.fabBackground.setVisibility(
fabMenuOpen ? GONE : VISIBLE
);
fabAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
// Nothing to do.
}
@Override
public void onAnimationEnd(Animation animation) {
if (fabMenuOpen) {
globalFABViewBinding.globalFabMini.setVisibility(GONE);
globalFABViewBinding.globalFab.setSelected(!fabMenuOpen);
}
}
@Override
public void onAnimationRepeat(Animation animation) {
// Nothing to do.
}
});
globalFABViewBinding.globalFabMini.startAnimation(fabAnimation);
this.fabMenuOpen = !fabMenuOpen;
}
}
내 메뉴는 아무런 문제없이 열고 닫습니다 (이 경우 두 개의 anim xml이 있습니다). Background RelativeLayout (+id/fab_background)은 "아무 곳이나 클릭하여 메뉴 열기"이벤트를 처리합니다.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:id="@+id/fab_holder">
<include layout="@layout/app_bar_with_progress_bar" android:id="@+id/appbar"/>
<de.mycompany.ui.view.HomeView
android:id="@+id/home_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/appbar" />
<de.mycompany.ui.view.GlobalFABView
android:id="@+id/global_fab_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
'xml' 레이아웃을 게시 할 수 있습니까? –
@SanjayKakadiya가 내 XML 항목을 추가했습니다. –