草庐IT

Android float 按钮和背景叠加

coder 2023-12-04 原文

我已经搜索过但没有找到任何教程或库,说明如何像下面在 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里做的事情

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

最佳答案

所以有一些库可以用来做这件事,这里有一个这样的库可以做你想做的: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

关于Android float 按钮和背景叠加,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33282756/

有关Android float 按钮和背景叠加的更多相关文章

  1. ruby-on-rails - 使用 Sublime Text 3 突出显示 HTML 背景语法中的 ERB? - 2

    所以我在关注Railscast,我注意到在html.erb文件中,ruby代码有一个微弱的背景高亮效果,以区别于其他代码HTML文档。我知道Ryan使用TextMate。我正在使用SublimeText3。我怎样才能达到同样的效果?谢谢! 最佳答案 为SublimeText安装ERB包。假设您安装了SublimeText包管理器*,只需点击cmd+shift+P即可获得命令菜单,然后键入installpackage并选择PackageControl:InstallPackage获取包管理器菜单。在该菜单中,键入ERB并在看到包时选择

  2. ruby-on-rails - 使用 Rmagick 或 ImageMagick 在背景上放置标题 - 2

    我有一张背景图片,我想在其中添加一个文本框。我想弄清楚如何将标题放置在其顶部的正确位置。(我使用标题是因为我需要自动换行功能)。现在,我只能让文本显示在左上角,但我需要能够手动定位它的开始位置。require'RMagick'require'Pry'includeMagicktext="Loremipsumdolorsitamet"img=ImageList.new('template001.jpg')img 最佳答案 这是使用convert的ImageMagick命令行的答案。如果你想在Rmagick中使用这个方法,你必须自己移植

  3. ruby-on-rails - Rails 单选按钮 - 模型中多列的一种选择 - 2

    我希望用户从一个模型的三个选项中选择一个。即我有一个模型视频,可以被评为正面/负面/未知目前我有三列bool值(pos/neg/unknown)。这是处理这种情况的最佳方式吗?为此,表单应该是什么样的?目前我有类似的东西但显然它允许多项选择,而我试图将它限制为只有一个..怎么办? 最佳答案 如果要使用字符串列,让我们说rating。然后在你的表单中:#...#...它只允许一个选择编辑完全相同但使用radio_button_tag: 关于ruby-on-rails-Rails单选按钮-模

  4. ruby-on-rails - 如何从按钮或链接单击的 View 调用 Rails 方法 - 2

    基本上,我试图在用户单击链接(或按钮或某种类型的交互元素)时执行Rails方法。我试着把它放在View中:但这似乎没有用。它最终只是在用户甚至没有点击“添加”链接的情况下调用该函数。我也用link_to试过了,但也没用。我开始认为没有一种干净的方法可以做到这一点。无论如何,感谢您的帮助。附言。我在ApplicationController中定义了该方法,它是一个辅助方法。 最佳答案 View和Controller是相互独立的。为了使链接在Controller内执行函数调用,您需要对应用程序中的端点执行ajax调用。该路由应调用rub

  5. ruby-on-rails - 如何在 Rails 中添加禁用的提交按钮 - 2

    我在ruby​​表单中有一个提交按钮f.submitbtn_text,class:"btnbtn-onemgt12mgb12",id:"btn_id"我想在不使用任何javascript的情况下通过ruby​​禁用此按钮 最佳答案 添加disabled:true选项。f.submitbtn_text,class:"btnbtn-onemgt12mgb12",id:"btn_id",disabled:true 关于ruby-on-rails-如何在Rails中添加禁用的提交按钮,我们在St

  6. ruby-on-rails - 从 ActiveAdmin has_many 表单助手中删除 "Add new"按钮 - 2

    我在事件管理员编辑页面中有嵌套资源,但我只想允许管理员编辑现有资源的内容,而不是添加新的嵌套资源。我的代码看起来像这样:formdo|f|f.inputsdof.input:authorf.input:contentf.has_many:commentsdo|comment_form|comment_form.input:contentcomment_form.input:_destroy,as::boolean,required:false,label:'Remove'endendf.actionsend但它在输入下添加了“添加新评论”按钮。我怎样才能禁用它,并只为主窗体保留f.ac

  7. ruby - 按 Enter 键而不是用鞋子单击按钮(Ruby) - 2

    正如标题所暗示的那样,我只是在寻找一种无需单击即可按下Shoes中的按钮的方法。我已经搜索了论坛,但不幸的是找不到任何东西。谢谢 最佳答案 这在Windows下的红色鞋子中不起作用,因为Windows控件窃取了所有事件。不过,我设法在window下穿着绿鞋工作。举个例子['green_shoes'].each(&method(:require))Shoes.app{e=edit_linebutton("Clickme!"){alert("Youclickedme.")}keypress{|k|alert("YoupressedEnt

  8. ruby-on-rails - 在所有页面上使用 Prawn 的背景图像 - 2

    我在View中有这段代码prawn_document(:page_size=>"A4",:top_margin=>80,:bottom_margin=>40,:background=>"public/uploads/1.png")do|pdf|creation_date=Time.now.strftime('%d-%m-%Y')posts=@posts.eachdo|post|pdf.pad(10)dopdf.textpost.titlepdf.textpost.textendendpdf.page_count.timesdo|i|pdf.go_to_page(i+1)pdf.draw

  9. ruby - 如何使用 Mechanize 保存通过单击按钮下载的文件 - 2

    我正在尝试使用Mechanize来模拟点击网页上的按钮,然后会在浏览器中启动文件下载。这是我的代码片段form=page.forms.first#=>Mechanize::Formform=agent.page.form_with(:name=>"aspnetForm")button=form.button_with(:value=>"GPXfile")ppbuttonagent.submit(form,button)pp按钮的输出是这样显示的,这意味着它是右键:#但是在发出“agent.submit(form,button)”之后,我怎样才能让Mechanize检索单击该按钮时将发送

  10. ruby-on-rails - 将 Bootstrap 图标添加到 Ruby on Rails 中的按钮 - 2

    我想在RubyonRails中为按钮添加图标。目前我尝试了以下方法:"),{:controller=>'events',:action=>"upvoteEvent",:method=>"put",:id=>@event.id,:uid=>current_user.id},{:class=>"btnbtn-success"}%>生成以下html:"/>我遵循了此处发布的解决方案:https://stackoverflow.com/a/10468935/1385324,但这对我不起作用。我还测试了BootstrapCSS是否正常工作,只需在网站的其他任何地方插入一个图标即可。感谢您的帮助!

随机推荐