Android float 按钮和背景叠加

Question

我已经搜索过但没有找到任何教程或库，说明如何像下面在 Skype 中使用的那样使用带背景的 float 按钮。

我使用这些关于制作 float 按钮的教程来学习本教程。

https://github.com/codepath/android_guides/wiki/Floating-Action-Buttons , https://www.bignerdranch.com/blog/floating-action-buttons-in-android-l/ , https://github.com/codepath/android_guides/wiki/Design-Support-Library

已编辑请阅读!

根据@Simon 的说法，我能够使用 https://github.com/futuresimple/android-floating-action-button实现 float 按钮布局的库。但是现在我不得不让背景变暗，因为我无法从库函数内部设置相对布局背景颜色。

请参阅下面的 float 按钮的工作 Java 代码，我已经删除了其他按钮，使 Skype 看起来很相似。

public class FloatButtonActivity extends Activity {

    RelativeLayout brl;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_float_button);

        //final View actionB = findViewById(R.id.action_b);

        ShapeDrawable drawable = new ShapeDrawable(new OvalShape());
        drawable.getPaint().setColor(getResources().getColor(R.color.white));


        /* Button 3 */
        final FloatingActionButton actionA = (FloatingActionButton) findViewById(R.id.action_a);
        actionA.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(FloatButtonActivity.this, "Clicked on this button 3", Toast.LENGTH_LONG).show();


            }
        });

        /* Button 2 */
        final FloatingActionButton actionB = (FloatingActionButton) findViewById(R.id.action_b);
        actionB.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(FloatButtonActivity.this, "Clicked on this button 2", Toast.LENGTH_LONG).show();
            }
        });


        /* Button 1 */
        FloatingActionButton actionC = new FloatingActionButton(getBaseContext());
        actionC.setTitle("Button 1");
        actionC.setOnClickListener(new OnClickListener() {
            @Override
            public void onClick(View v) {
                Toast.makeText(FloatButtonActivity.this, "Clicked on this button 1", Toast.LENGTH_LONG).show();
            }
        });

        final FloatingActionsMenu menuMultipleActions = (FloatingActionsMenu) findViewById(R.id.multiple_actions);
        menuMultipleActions.addButton(actionC);

    }

}

这是下面的 XML 布局

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fab="http://schemas.android.com/apk/res-auto"
    android:background="@color/background"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

<RelativeLayout
    android:id="@+id/floatbutton_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.getbase.floatingactionbutton.FloatingActionsMenu
        android:id="@+id/multiple_actions"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"
        fab:fab_addButtonColorNormal="@color/white"
        fab:fab_addButtonColorPressed="@color/white_pressed"
        fab:fab_addButtonPlusIconColor="@color/half_black"
        fab:fab_labelStyle="@style/menu_labels_style"
        android:layout_marginBottom="16dp"
        android:layout_marginRight="16dp"
        android:layout_marginEnd="16dp">

        <com.getbase.floatingactionbutton.FloatingActionButton
            android:id="@+id/action_a"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            fab:fab_colorNormal="@color/white"
            fab:fab_title="Button 3"
            fab:fab_colorPressed="@color/white_pressed"/>

        <com.getbase.floatingactionbutton.FloatingActionButton
            android:id="@+id/action_b"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            fab:fab_colorNormal="@color/white"
            fab:fab_title="Button 2"
            fab:fab_colorPressed="@color/white_pressed"/>

    </com.getbase.floatingactionbutton.FloatingActionsMenu>


</RelativeLayout>

</RelativeLayout>

问题:

有一个 FloatingActionsMenu Action 类，它有一个 OnClickListener 设置为初始化按钮的 toggle()。 我不允许在类中设置背景颜色，因为它不是相对布局的 Activity 。请问我该怎么做？

mAddButton.setOnClickListener(new OnClickListener() {
      @Override
      public void onClick(View v) {
        toggle(); //This calls the other float buttons
        Log.d("MSG: ", "In FloatingActionsMenu Class");
      }
    });

但是我想实现在skype的APP里做的事情

我希望获得有关如何实现下面正在做的事情的分步指南。

Answer 1

所以有一些库可以用来做这件事，这里有一个这样的库可以做你想做的:https://github.com/futuresimple/android-floating-action-button

但是，如果您想以旧方式进行操作，也可以按照以下步骤实现:

1. 您可以创建一个带有 onClickListener 设置的 FAB 按钮。一旦用户点击 FAB，屏幕就会变暗。为此，您可以通过 windowManager 类在窗口上获取处理程序，然后将标志设置为 FLAG_DIM_BEHIND (WindowManager.LayoutParams.FLAG_DIM_BEHIND)。执行此操作的代码是:

        WindowManager wm = (WindowManager) getActivity().getSystemService(Context.WINDOW_SERVICE);
        WindowManager.LayoutParams p = (WindowManager.LayoutParams) parent.getLayoutParams();
        p.flags = WindowManager.LayoutParams.FLAG_DIM_BEHIND;
        p.dimAmount = 0.4f;
        wm.updateViewLayout(parent, p);

1. 您需要通过为每个图标的 translateY 设置动画来在另一个 FAB 中设置动画，以便在您单击主 FAB 时它会立即“飞”起来。

2. 然后，您可以为现在出现在屏幕上的每个新 FAB 设置 onClickListeners，以便在用户点击它们时它们具有逻辑。

这可能需要一些工作，所以如果您采用旧时尚方式，请准备好做一些研究 - 我会改用图书馆，它的思考要少得多。

还有其他指南可为您提供有关 FAB 的更多信息:https://guides.codepath.com/android/Floating-Action-Buttons