ToB企服应用市场:ToB评测及商务社交产业平台
标题:
鸿蒙Harmony应用开辟—ArkTS声明式开辟(根本手势:Select)
[打印本页]
作者:
十念
时间:
2024-8-13 19:00
标题:
鸿蒙Harmony应用开辟—ArkTS声明式开辟(根本手势:Select)
提供下拉选择菜单,可以让用户在多个选项之间选择。
说明:
该组件从API Version 8开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。
子组件
无
接口
Select(options: Array<SelectOption>)
参数:
参数名参数范例必填参数描述optionsArray<SelectOption>是设置下拉选项。
SelectOption对象说明
参数名参数范例必填参数描述valueResourceStr是下拉选项内容。iconResourceStr否下拉选项图片。
属性
除支持通用属性外,还支持以下属性:
名称参数范例描述selectednumber | Resource11+设置下拉菜单初始选项的索引,第一项的索引为0。
当不设置selected属性或设置异常值时,默认选择值为-1,菜单项不选中;当设置为undefined、null时,选中第一项。
从API version 10开始,该属性支持$$双向绑定变量。valueResourceStr11+设置下拉按钮本身的文本内容。当菜单选中时默认会替换为菜单项文本内容。
从API version 10开始,该参数支持$$双向绑定变量。fontFont设置下拉按钮本身的文本样式。
默认值:
{
size: '16fp',
weight: FontWeight.Medium
}
说明:
当size为0的时候,文本不表现,当size为负值的时候,文本的size按照默认值表现。fontColorResourceColor设置下拉按钮本身的文本颜色。
默认值:'#E5182431'selectedOptionBgColorResourceColor设置下拉菜单选中项的背景色。
默认值:'#33007DFF'selectedOptionFontFont设置下拉菜单选中项的文本样式。
默认值:
{
size: '16fp',
weight: FontWeight.Regular
}
说明:
当size为0的时候,文本不表现,当size为负值的时候,文本的size按照默认值表现。selectedOptionFontColorResourceColor设置下拉菜单选中项的文本颜色。
默认值:'#ff007dff'optionBgColorResourceColor设置下拉菜单项的背景色。
默认值:'#ffffffff'optionFontFont设置下拉菜单项的文本样式。
默认值:
{
size: '16fp',
weight: FontWeight.Regular
}
说明:
当size为0的时候,文本不表现,当size为负值的时候,文本的size按照默认值表现。optionFontColorResourceColor设置下拉菜单项的文本颜色。
默认值:'#ff182431'space10+Length设置下拉菜单项的文本与箭头之间的间距。
说明:
不支持设置百分比。arrowPosition10+ArrowPosition设置下拉菜单项的文本与箭头之间的对齐方式。
默认值:ArrowPosition.ENDmenuAlign10+alignType: MenuAlignType,
offset?: Offset设置下拉按钮与下拉菜单间的对齐方式。
-alignType: 对齐方式范例,必填。
默认值:MenuAlignType.START
-offset: 按照对齐范例对齐后,下拉菜单相对下拉按钮的偏移量。
默认值:{dx: 0, dy: 0}optionWidth11+Dimension | OptionWidthMode设置下拉菜单项的宽度。OptionWidthMode范例为摆列范例,OptionWidthMode决定下拉菜单是否继承下拉按钮宽度。
当设置为undefined、null、负数时,属性不生效,菜单项宽度设为默认值,即菜单默认宽度为2栅格。
当菜单项设置宽度小于最小宽度56vp时,菜单宽度回弹至2栅格。正常值范围大于等于0。
说明:
不支持设置百分比。optionHeight11+Dimension设置下拉菜单表现的最大高度。下拉菜单的默认最大高度是屏幕可用高度的80%,设置的菜单最大高度不能超过默认最大高度。
当设置为undefined、null、负数与零时,属性不生效,下拉菜单最大高度设为默认值,即下拉菜单最大高度默认值为屏幕可用高度的80%。
正常值范围大于0。如果下拉菜单所有选项的实际高度没有设定的高度大,下拉菜单的高度按实际高度表现。
说明:
不支持设置百分比。
OptionWidthMode11+摆列说明
名称描述FIT_CONTENT设置该值时,下拉菜单宽度按默认2栅格表现。FIT_TRIGGER设置下拉菜单继承下拉按钮宽度。
ArrowPosition10+摆列说明
名称描述END10+笔墨在前,箭头在后。START10+箭头在前,笔墨在后。
MenuAlignType10+摆列说明
名称描述START按照语言方向起始端对齐。CENTER居中对齐。END按照语言方向末了对齐。
事件
名称功能描述onSelect(callback: (index: number, value?: string) => void)下拉菜单选中某一项的回调。
index:选中项的索引。
value:选中项的值。
示例
// xxx.ets
@Entry
@Component
struct SelectExample {
@State text: string = "TTTTT"
@State index: number = 2
@State space: number = 8
@State arrowPosition: ArrowPosition = ArrowPosition.END
build() {
Column() {
Select([{ value: 'aaa', icon: $r("app.media.selecticon") },
{ value: 'bbb', icon: $r("app.media.selecticon") },
{ value: 'ccc', icon: $r("app.media.selecticon") },
{ value: 'ddd', icon: $r("app.media.selecticon") }])
.selected(this.index)
.value(this.text)
.font({ size: 16, weight: 500 })
.fontColor('#182431')
.selectedOptionFont({ size: 16, weight: 400 })
.optionFont({ size: 16, weight: 400 })
.space(this.space)
.arrowPosition(this.arrowPosition)
.menuAlign(MenuAlignType.START, {dx:0, dy:0})
.optionWidth(200)
.optionHeight(100)
.onSelect((index:number, text?: string | undefined)=>{
console.info('Select:' + index)
this.index = index;
if(text){
this.text = text;
}
})
}.width('100%')
}
}
复制代码
最后,有很多小同伴不知道学习哪些鸿蒙开辟技术?不知道必要重点把握哪些鸿蒙应用开辟知识点?而且学习时频繁踩坑,最终浪费大量时间。所以有一份实用的
鸿蒙(Harmony NEXT)资料
用来跟着学习是非常有须要的。
这份鸿蒙(Harmony NEXT)资料包罗了鸿蒙开辟必把握的核心知识要点,内容包罗了
(
ArkTS、ArkUI开辟组件、Stage模子、多端摆设、分布式应用开辟、音频、视频、WebGL、OpenHarmony
多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开辟、鸿蒙项目实战等等)鸿蒙(Harmony NEXT)
技术知识点。
希望这一份鸿蒙学习资料能够给各人带来帮助,有必要的小同伴自行领取,
限时开源,先到先得~无套路领取!!
获取这份完整版高清学习路线,请点击→
纯血版全套鸿蒙HarmonyOS学习资料
鸿蒙(Harmony NEXT)最新学习路线
HarmonOS根本技能
HarmonOS就业必备技能
HarmonOS多媒体技术
鸿蒙NaPi组件进阶
HarmonOS高级技能
初识HarmonOS内核
实战就业级设备开辟
有了路线图,怎么能没有学习资料呢,小编也准备了一份联合鸿蒙官方发布笔记整理收纳的一套系统性的
鸿蒙(OpenHarmony )学习手册(共计1236页)
与
鸿蒙(OpenHarmony )开辟入门教学视频
,内容包罗:
ArkTS、ArkUI、Web开辟、应用模子、资源分类…等知识点。
获取以上完整版高清学习路线,请点击→
纯血版全套鸿蒙HarmonyOS学习资料
《鸿蒙 (OpenHarmony)开辟入门教学视频》
《鸿蒙生态应用开辟V2.0白皮书》
《鸿蒙 (OpenHarmony)开辟根本到实战手册》
OpenHarmony北向、南向开辟情况搭建
《鸿蒙开辟根本》
ArkTS语言
安装DevEco Studio
运用你的第一个ArkTS应用
ArkUI声明式UI开辟
.……
《鸿蒙开辟进阶》
Stage模子入门
网络管理
数据管理
电话服务
分布式应用开辟
通知与窗口管理
多媒体技术
安全技能
任务管理
WebGL
国际化开辟
应用测试
DFX面向未来设计
鸿蒙系统移植和裁剪定制
……
《鸿蒙进阶实战》
ArkTS实践
UIAbility应用
网络案例
……
获取以上完整鸿蒙HarmonyOS学习资料,请点击→
纯血版全套鸿蒙HarmonyOS学习资料
总结
总的来说,华为鸿蒙不再兼容安卓,对中年步伐员来说是一个挑衅,也是一个时机。只有积极应对变化,不停学习和提升本身,他们才气在这个变革的期间中立于不败之地。
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
欢迎光临 ToB企服应用市场:ToB评测及商务社交产业平台 (https://dis.qidao123.com/)
Powered by Discuz! X3.4