# FloatingMenu

**Repository Path**: OpenHarmony1/FloatingMenu

## Basic Information

- **Project Name**: FloatingMenu
- **Description**: OpenHarmony悬浮菜单
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-11-01
- **Last Updated**: 2023-05-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# FloatingMenu

#### 项目介绍
   该组件是一个OpenHarmony悬浮菜单组件（js）,后续会为该组件提供ets版本

#### 项目演示

![输入图片说明](./screenshot/demo_1.gif)


##### 基础用法
   ```java 
   //详细用法及说明请参照Demo
   <element src="../../../../../../../library/src/main/js/components/floatingmenu.hml" name="FloatingMenuComp" ></element>
   <FloatingMenuComp
            id="menu"
            @menu-click="menuClick"
            class="floatingmenu-style"
            main-normal-icon="/common/images/add.png"
            main-close-icon="/common/images/close.png"
            main-background="#db4437"
            main-size="48px"
            menu-size="48px"
            menu-info="{{ menuInfo }}"
            direction="V"
            title-size="16px"
            title-color="#999999"
            degree="90"></FloatingMenuComp>    
   

   ```   

#### 接口及属性
| **属性**                             | **必填** | **说明**                                                   |
| ------------------------------------ | :------: | --------------------------------------------------------- |
| menu-click:  Function       |    否    | 菜单被点击的事件回调                    |
| main-normal-icon: String    |    是    | 主菜单中心位置的正常时的图片路径          |
| main-close-icon: String     |    是    | 主菜单中心位置的关闭时的图片路径          |
| main-background: String     |    否    | 主菜单背景色，默认#db4437               |
| main-size: String           |    否    | 主菜单大小，默认48px                    |
| menu-size: String           |    否    | 展示的菜单大小，默认48px                 |
| menu-info: Object           |    是    | 菜单信息                                |
| menu-space: String          |    否    | 菜单间隔，默认10px                      |
| direction: String           |    否    | 展示方向，默认V                         |
| title-size: String          |    否    | 菜单标题文字大小，默认16px               |
| title-color: String         |    否    | 菜单标题文字颜色，默认#999999             |
| degree: String              |    否    | 主菜单展开的旋转角度，默认90             |


#### 版权和许可信息

```
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.
```