FloatingActionButton增强版一个按钮跳出多个按钮第三方开源之FloatingActionButton
作者:Z2 时间:2023-06-18 13:28:22
FloatingActionButton项目在github上的主页:https://github.com/futuresimple/android-floating-action-button
FloatingActionButton使用简单,而且可以自定义颜色、大小、背景图片
项目构造:
下面是demo的代码(主要见sample):
布局:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:fab="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@color/background" >
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/pink_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="dp"
fab:fab_colorNormal="@color/pink"
fab:fab_colorPressed="@color/pink_pressed"
fab:fab_icon="@drawable/ic_fab_star" />
<TextView
style="@style/menu_labels_style"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/pink_icon"
android:layout_centerHorizontal="true"
android:layout_marginBottom="dp"
android:text="Text below button" />
<com.getbase.floatingactionbutton.AddFloatingActionButton
android:id="@+id/semi_transparent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/pink_icon"
android:layout_centerHorizontal="true"
android:layout_marginBottom="dp"
fab:fab_colorNormal="@color/blue_semi_transparent"
fab:fab_colorPressed="@color/blue_semi_transparent_pressed"
fab:fab_plusIconColor="@color/white" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/setter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/semi_transparent"
android:layout_centerHorizontal="true"
android:layout_marginBottom="dp" />
<com.getbase.floatingactionbutton.AddFloatingActionButton
android:id="@+id/normal_plus"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginBottom="dp"
android:layout_marginLeft="dp"
android:layout_marginStart="dp"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_plusIconColor="@color/half_black" />
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/right_labels"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/normal_plus"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_marginLeft="dp"
android:layout_marginStart="dp"
fab:fab_addButtonColorNormal="@color/white"
fab:fab_addButtonColorPressed="@color/white_pressed"
fab:fab_addButtonPlusIconColor="@color/half_black"
fab:fab_addButtonSize="mini"
fab:fab_labelStyle="@style/menu_labels_style"
fab:fab_labelsPosition="right" >
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_title="Label on the right" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_size="mini"
fab:fab_title="Another one on the right" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
<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_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginBottom="dp"
android:layout_marginEnd="dp"
android:layout_marginRight="dp"
fab:fab_addButtonColorNormal="@color/white"
fab:fab_addButtonColorPressed="@color/white_pressed"
fab:fab_addButtonPlusIconColor="@color/half_black"
fab:fab_labelStyle="@style/menu_labels_style" >
<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_colorPressed="@color/white_pressed"
fab:fab_title="Action A" />
<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_colorPressed="@color/white_pressed"
fab:fab_title="Action with a very long name that won\'t fit on the screen" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/multiple_actions_down"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_marginEnd="dp"
android:layout_marginRight="dp"
android:layout_marginTop="dp"
fab:fab_addButtonColorNormal="@color/white"
fab:fab_addButtonColorPressed="@color/white_pressed"
fab:fab_addButtonPlusIconColor="@color/half_black"
fab:fab_addButtonSize="mini"
fab:fab_expandDirection="down"
fab:fab_labelStyle="@style/menu_labels_style" >
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_size="mini" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/button_remove"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_title="Click to remove" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/button_gone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/action_enable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_title="Set bottom menu enabled/disabled" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
<com.getbase.floatingactionbutton.FloatingActionsMenu
android:id="@+id/multiple_actions_left"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginEnd="dp"
android:layout_marginRight="dp"
android:layout_marginTop="dp"
android:layout_toLeftOf="@+id/multiple_actions_down"
android:layout_toStartOf="@+id/multiple_actions_down"
fab:fab_addButtonColorNormal="@color/white"
fab:fab_addButtonColorPressed="@color/white_pressed"
fab:fab_addButtonPlusIconColor="@color/half_black"
fab:fab_addButtonSize="mini"
fab:fab_addButtonStrokeVisible="false"
fab:fab_expandDirection="left" >
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_size="mini" />
<com.getbase.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"
fab:fab_colorNormal="@color/white"
fab:fab_colorPressed="@color/white_pressed"
fab:fab_size="mini" />
</com.getbase.floatingactionbutton.FloatingActionsMenu>
<com.getbase.floatingactionbutton.FloatingActionButton
android:id="@+id/setter_drawable"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="@id/setter"
android:layout_centerHorizontal="true" />
</RelativeLayout>
JAVA代码:
package com.getbase.floatingactionbutton.sample;
import com.getbase.floatingactionbutton.FloatingActionButton;
import com.getbase.floatingactionbutton.FloatingActionsMenu;
import android.app.Activity;
import android.graphics.drawable.ShapeDrawable;
import android.graphics.drawable.shapes.OvalShape;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Toast;
public class MainActivity extends Activity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViewById(R.id.pink_icon).setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(MainActivity.this, "Clicked pink Floating Action Button", Toast.LENGTH_SHORT).show();
}
});
FloatingActionButton button = (FloatingActionButton) findViewById(R.id.setter);
button.setSize(FloatingActionButton.SIZE_MINI);
button.setColorNormalResId(R.color.pink);
button.setColorPressedResId(R.color.pink_pressed);
button.setIcon(R.drawable.ic_fab_star);
button.setStrokeVisible(false);
final View actionB = findViewById(R.id.action_b);
FloatingActionButton actionC = new FloatingActionButton(getBaseContext());
actionC.setTitle("Hide/Show Action above");
actionC.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
actionB.setVisibility(actionB.getVisibility() == View.GONE ? View.VISIBLE : View.GONE);
}
});
final FloatingActionsMenu menuMultipleActions = (FloatingActionsMenu) findViewById(R.id.multiple_actions);
menuMultipleActions.addButton(actionC);
final FloatingActionButton removeAction = (FloatingActionButton) findViewById(R.id.button_remove);
removeAction.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
((FloatingActionsMenu) findViewById(R.id.multiple_actions_down)).removeButton(removeAction);
}
});
ShapeDrawable drawable = new ShapeDrawable(new OvalShape());
drawable.getPaint().setColor(getResources().getColor(R.color.white));
((FloatingActionButton) findViewById(R.id.setter_drawable)).setIconDrawable(drawable);
final FloatingActionButton actionA = (FloatingActionButton) findViewById(R.id.action_a);
actionA.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
actionA.setTitle("Action A clicked");
}
});
// Test that FAMs containing FABs with visibility GONE do not cause crashes
findViewById(R.id.button_gone).setVisibility(View.GONE);
final FloatingActionButton actionEnable = (FloatingActionButton) findViewById(R.id.action_enable);
actionEnable.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View view) {
menuMultipleActions.setEnabled(!menuMultipleActions.isEnabled());
}
});
FloatingActionsMenu rightLabels = (FloatingActionsMenu) findViewById(R.id.right_labels);
FloatingActionButton addedOnce = new FloatingActionButton(this);
addedOnce.setTitle("Added once");
rightLabels.addButton(addedOnce);
FloatingActionButton addedTwice = new FloatingActionButton(this);
addedTwice.setTitle("Added twice");
rightLabels.addButton(addedTwice);
rightLabels.removeButton(addedTwice);
rightLabels.addButton(addedTwice);
}
}
colors:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="black_semi_transparent">#B2000000</color>
<color name="background">#e5e5e5</color>
<color name="half_black">#808080</color>
<color name="white">#fafafa</color>
<color name="white_pressed">#f1f1f1</color>
<color name="pink">#e91e63</color>
<color name="pink_pressed">#ec407a</color>
<color name="blue_semi_transparent">#805677fc</color>
<color name="blue_semi_transparent_pressed">#80738ffe</color>
</resources>
标签:floatingactionbutton,floating,button,按钮
![](/images/zang.png)
![](/images/jiucuo.png)
猜你喜欢
聊聊Java并发中的Synchronized
2022-07-26 03:19:24
![](https://img.aspxhome.com/file/2023/7/89567_0s.jpg)
详解SpringSecurity中的Authentication信息与登录流程
2022-01-20 21:36:22
![](https://img.aspxhome.com/file/2023/4/78864_0s.png)
Spring配置文件如何使用${username}
2021-07-26 22:40:27
Java中常见的编码集问题总结
2023-11-29 01:40:04
![](https://img.aspxhome.com/file/2023/5/60115_0s.png)
Android自定义EditText实现淘宝登录功能
2023-04-20 01:33:04
![](https://img.aspxhome.com/file/2023/6/139656_0s.png)
Android录制声音文件(音频)并播放
2023-07-04 06:31:19
![](https://img.aspxhome.com/file/2023/5/117135_0s.jpg)
C#实现无损压缩图片代码示例
2022-01-23 19:59:25
java中Statement 与 PreparedStatement接口之间的关系和区别
2023-11-25 03:11:11
![](https://img.aspxhome.com/file/2023/9/60029_0s.png)
Java语法基础之循环结构语句详解
2023-09-06 21:37:28
![](https://img.aspxhome.com/file/2023/1/79811_0s.jpg)
Java如何利用return结束方法调用
2022-05-20 19:58:35
![](https://img.aspxhome.com/file/2023/4/85884_0s.png)
Java实现图片验证码具体代码
2021-06-30 13:16:35
![](https://img.aspxhome.com/file/2023/9/60989_0s.jpg)
android时间选择控件之TimePickerView使用方法详解
2023-01-14 02:58:12
![](https://img.aspxhome.com/file/2023/0/138850_0s.jpg)
Java构造器与传值学习总结
2023-03-08 23:18:06
微信举报解除和微信解除限制的6个方法
2022-01-07 22:30:46
![](https://img.aspxhome.com/file/2023/4/137834_0s.png)
读写Android中assets目录下的文件的方法详解
2023-03-03 15:50:35
![](https://img.aspxhome.com/file/2023/7/92617_0s.png)
Spring中实现定时调度的几种方法
2021-08-29 13:04:44
C#加密解密类实例程序
2022-01-25 18:17:09
浅谈Java基准性能测试之JMH
2023-01-25 13:17:40
Android7.0自动更新适配 包解析异常
2022-02-13 11:21:00
C#实现绘制鼠标的示例代码
2023-06-11 04:40:54
![](https://img.aspxhome.com/file/2023/4/77234_0s.png)