HarmonyOs 笔记

1.路由

// 顶部引入路由
import { router } from '@kit.ArkUI'

使用
router.pushUrl({url:'需要跳转的路径'})

2.导航栏

Navigation()   // 导航栏
通过.titleMode(NavigationTitleMode.Mini) 设置标题栏模式

页面显示模式

mode(NavigatigonMode.Auto)  // 自适应模式

自适应模式下,当页面宽度大于等于一定阈值( API version 9及以前:520vp,API version 10及以后:600vp )时,Navigation组件采用分栏模式,反之采用单栏模式

Stack 单页面显示模式 (如果不是三折叠手机,基本使用单页面显示模式)

Split 分栏模式

2.1导航页

导航页可以通过hideNavBar进行隐藏

2.1.1标题栏

Navigation通过titleMode 设置标题栏

titlebar和菜单栏menu

2.1.2菜单栏

2.1.2内容区

Navigation 子组件

2.1.3工具栏

工具栏位于页面底部,通过toolBarConfiguration配置

2.2子页

2.3路由操作

Navigation路由操作基于页面栈NavPathStack提供的方法进行。

3.布局

链接:文档中心

3.1 stack 层叠布局

通过alignContent属性修改子元素布局,调整zIndex控制子元素层级

3.2 线性布局

3.2.1 row()

主轴默认为水平方向排列

VerticalAlign 在交叉轴上的排列

.alignItems(VerticalAlign.Center)

3.2.2 Column()

主轴默认为垂直方向排列

HorizontalAlign在水平方向上的排列 

.alignItems(HorizontalAlign.Start) // 水平方向上的排列

通过justifyContent属性改变row水平方向上的排列和Column交叉轴上的排列

space: 10  设置子元素之间的间距

自适应拉伸:

空白填充组件Blank()

权重比:layoutWeight()

自适应延伸使用scroll组件,滚动条解决一屏展示不全的效果

3.3 List列表

ListItemGroup 分组列表

scrollBar 滚动条显示,scrollBar属性API version 9及以下版本默认值为BarState.Off,从API version 10版本开始默认值为BarState.Auto

.scrollBar(BarState.Auto)

sticky列表粘性布局

.sticky(StickyStyle.Header)  // 设置吸顶,实现粘性标题效果

返回顶部,scrollToIndex修改数值为o即可

位置响应,侧滑,增加,删除,编辑,下拉刷新和上拉加载等功能

3.4 Scroll布局

scroll会限制子元素的宽高,由其设计决定的,其内部子元素的尺寸和位置需要由Scroll组件统一管理,以确保滚动时的界面效果。因此,子元素的宽度和高度会受到Scroll组件的限制。

在没有给定宽高的情况下,渲染性能会有所下降,但是如果需要兼容横屏情况下的展示,最好不要给固定宽高,需要做取舍。

scrollable(ScrollDirection.Vertical): 设置滚动方向

scrollBarColor: 设置滚动条的颜色

scrollBar: 滚动条是否可滑动和显示

scrollBarWidth: 滚动条宽度,不支持百分比

edgeEffect(edgeEffect.Spring): 物理回弹效果,继续滑动一段距离。

网络

在module.json5中添加网络配置

"requestPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      }
    ],

你可能感兴趣的:(harmonyos)