# FloatingActionMenu-Animation

**Repository Path**: archermind-ti/floatingactionmenu-animation

## Basic Information

- **Project Name**: FloatingActionMenu-Animation
- **Description**: 点击按钮添加滚动处理程序和动画并展开
- **Primary Language**: Java
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2021-06-04
- **Last Updated**: 2021-10-12

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# FloatingActionMenu_Animation

## 功能介绍
此库为floatingActionMenu按钮添加滚动处理程序和动画。点击按钮，展开Button。

## 效果演示

![image](image/floatingactionmenu.gif)

### 安装教程

#### 方式一

1. 下载模块代码添加到自己的工程。
2. 关联使用。

```
dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar', '*.har'])

    implementation project(':floatingactionmenu')
	……
}
```

#### 方式二

1. 在module的build.gradle中添加依赖

   ```groovy
   dependencies {
       implementation fileTree(dir: 'libs', include: ['*.jar', '*.har'])
       ……
       implementation 'com.gitee.archermind-ti:floatingactionmenu:1.0.1'
   }
   ```
2. 在project的build.gradle中添加`mavenCentral()`的引用

   ``` groovy
   allprojects {
       repositories {
           ……
           mavenCentral()
       }
   }
   ```

## 使用说明

添加toan.ohos.floatingactionmenu.FloatingActionButton到你的XML中
```XML
<DependentLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    xmlns:app="http://schemas.huawei.com/app/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:background_element="#e5e5e5"
    ohos:orientation="vertical">

    <toan.ohos.floatingactionmenu.FloatingActionButton
        ohos:id="$+id:pink_icon"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:align_parent_bottom="true"
        ohos:bottom_margin="16vp"
        ohos:center_in_parent="true"
        ohos:horizontal_center="true"
        app:fab_colorNormal="#e91e63"
        app:fab_colorPressed="#ec407a"
        app:fab_image_src="$media:ic_star"
        />
```

### Floating action menu

```XML
   <toan.ohos.floatingactionmenu.FloatingActionMenu
        ohos:id="$+id:right_labels"
        ohos:height="match_content"
        ohos:width="match_content"
        ohos:above="$id:normal_plus"
        ohos:align_parent_left="true"
        ohos:align_parent_start="true"
        ohos:bottom_margin="16vp"
        ohos:left_margin="16vp"
        app:fab_size="1"
        >

        <toan.ohos.floatingactionmenu.FloatingActionButton
            ohos:height="match_content"
            ohos:width="match_content"
            app:fab_colorNormal="#fafafa"
            app:fab_colorPressed="#f1f1f1"
            app:fab_label="Lable on the right"
            app:fab_label_mode="right"
            />

        <toan.ohos.floatingactionmenu.FloatingActionButton
            ohos:height="match_content"
            ohos:width="match_content"
            app:fab_colorNormal="#fafafa"
            app:fab_colorPressed="#f1f1f1"
            app:fab_label="Another one on the right"
            app:fab_label_mode="right"
            app:fab_size="1"
            />

    </toan.ohos.floatingactionmenu.FloatingActionMenu>
```
### 也可在代码中动态添加

```java
 FloatingActionButton programFab1 = new FloatingActionButton(this);
        programFab1.setTextMode(FloatingActionButton.FAB_LABEL_MODE_RIGHT);
        programFab1.setLabelText("Added once");
        programFab1.setColorNormal("#ff0099cc");
        programFab1.setColorPressed("#ff0099cc");

        FloatingActionButton programFab2 = new FloatingActionButton(this);
        programFab2.setTextMode(FloatingActionButton.FAB_LABEL_MODE_RIGHT);
        programFab2.setLabelText("Added twice");
        programFab2.setColorNormal("#ff0099cc");
        programFab2.setColorPressed("#ff0099cc");
        rightLabelsMenu.addComponent(programFab1);
        rightLabelsMenu.addComponent(programFab2);
        createCustomAnimation();

注意：
     /**
     * 展开方向：up/向上，down/向下，默认为up
     */
    public static final String MENU_OPEN_DIRECTION = "menu_open_direction";

 /**
     * 文字内容位置：left/左边，right/右边，默认为right
     */
    public static final String MENU_TEXT_MODE = "menu_text_mode";
    public static final String FAB_TEXT_MODE_LEFT = "left";
    public static final String FAB_TEXT_MODE_RIGHT = "right";
    public static final String FAB_TEXT_MODE_NULL = "";
  /**
     * 按钮大小，0:正常大小，1:mini模式，默认为0
     */
    public static final String FAB_SIZE = "fab_size";

给menu设置背景图片需要在代码中设置，如下：
      private Element getIconElement() {
        PixelMapElement pixelMapElement = new PixelMapElement(ResUtil.getPixelMap(getContext(), ResourceTable.Graphic_fab_add).get());
        pixelMapElement.setColorMatrix(sGrayFilter);
        return pixelMapElement;
    }

此处给menu设置了3种展示和隐藏动画:具体动画实现过程可在源码中查看
 /**
     * 展示Menu
     *
     * @param type 动画类型：1/缩放，2/移动，3/透明度渐变
     */
    public void showMenu(int type) {
        if (getVisibility() == VISIBLE) {
            return;
        }
        switch (type) {
            case 1:
                startScaleAnimation(true);
                break;
            case 2:
                startTransAnimation(true);
                break;
            case 3:
                startAlphaAnimation(true);
                break;
            default:
                break;
        }
    }
```

## 版本迭代

* v1.0.1

## License

```
    Copyright (C) 2016 toanvc
    Copyright (C) 2014 str4d
    Copyright (C) 2014 Jerzy Chalupski
    
    Licensed under the Apache License, Version 2.0 (the "License");
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at
    
         http://www.apache.org/licenses/LICENSE-2.0
    
    Unless required by applicable law or agreed to in writing, software
    distributed under the License is distributed on an "AS IS" BASIS,
    WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
    See the License for the specific language governing permissions and
    limitations under the License.
```