鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果原创

六合李欣

发布于 2021-2-12 22:11

2.3w浏览

2收藏

1.鸿蒙自定义滑动侧边栏的实现及效果通过对android侧边栏的重新实现和引入，实现效果如下：

鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果-鸿蒙开发者社区

通过滑动侧边栏图标，实现侧边视图的滑动弹出：

鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果-鸿蒙开发者社区

2.模块的引入和依赖，工程导航视图如下:

鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果-鸿蒙开发者社区

3.设置加载模块并依赖，通过settings.gradle

鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果-鸿蒙开发者社区

和工程目录下的build.gradle，添加工程依赖：

鸿蒙Java开发模式7:鸿蒙自定义滑动侧边栏的实现及效果-鸿蒙开发者社区

4.布局文件

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
                   ohos:width="match_parent"
                   ohos:height="match_parent">

    <Image
        ohos:height="300px"
        ohos:width="300px"
        ohos:image_src="$media:cb2"
        ohos:left_margin="-100px"
        ohos:top_margin="-50px"
        >

    </Image>
</DirectionalLayout>1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.

<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout xmlns:ohos="http://schemas.huawei.com/res/ohos"
                   ohos:width="match_parent"
                   ohos:height="match_parent"
                   ohos:orientation="vertical">




</DirectionalLayout>1.
2.
3.
4.
5.
6.
7.
8.
9.
10.

5.Java代码

package com.example.javahm4.slice;

import com.example.javahm4.MainAbility;
import com.example.javahm4.ResourceTable;
import com.huawei.menu.SlidingMenu;
import ohos.aafwk.ability.AbilitySlice;
import ohos.aafwk.content.Intent;
import ohos.agp.components.DirectionalLayout;
import ohos.agp.components.LayoutScatter;
import ohos.agp.components.Text;
import ohos.bundle.AbilityInfo;
import ohos.global.resource.NotExistException;
import ohos.global.resource.WrongTypeException;

import java.io.IOException;

public class MainAbilitySlice extends AbilitySlice {
    @Override
    public void onStart(Intent intent) {
        super.onStart(intent);
       // super.setUIContent(ResourceTable.Layout_ability_main);

        this.setDisplayOrientation(AbilityInfo.DisplayOrientation.PORTRAIT);
         //初始化一个directionalLayout（后面attachToAbility会用到，用来获取页面展示的根节点）
         DirectionalLayout directionalLayout = (DirectionalLayout) LayoutScatter.getInstance(this).
         parse(ResourceTable.Layout_ability_main,null,false);
         //把directionalLayout设置为Ability的主要UI布局
         setUIContent(directionalLayout);
         SlidingMenu slidingMenu = null;
         try {
         //初始化SlidingMenu实例
         slidingMenu = new SlidingMenu(this);

         } catch (IOException e) {
         e.printStackTrace();
         } catch (NotExistException e) {
         e.printStackTrace();
         }
         //设置菜单放置位置
         slidingMenu.setMode(SlidingMenu.LEFT);
         //设置滑动的触发范围
         slidingMenu.setTouchScale(60);


        //设置菜单布局
         slidingMenu.setMenu(ResourceTable.Layout_layout_left_menu);

         //设置菜单最大宽度
         slidingMenu.setMenuWidth(800);
         try {
         //关联Activity
         slidingMenu.attachToAbility(directionalLayout,
                 getAbility(), SlidingMenu.SLIDING_WINDOW);


         } catch (NotExistException e) {
         e.printStackTrace();
         } catch (WrongTypeException e) {
         e.printStackTrace();
         } catch (IOException e) {
         e.printStackTrace();
         }
    }

    @Override
    public void onActive() {
        super.onActive();
    }

    @Override
    public void onForeground(Intent intent) {
        super.onForeground(intent);
    }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.