啥前端框架可以做网站首页,高清设计网站推荐,专门做汽车内饰的网站,十大高端网站设计.ets文件结构
//页面入口
Entry
//组件
Component
struct test{//页面结构build(){//容器 **一个页面只能有一个根容器#xff0c;父容器要有大小设置**}1、Column 组件 沿垂直方向布局的组件#xff0c;可以包含子组件 接口 Column({space}) space的参数为string | numbe….ets文件结构
//页面入口
Entry
//组件
Component
struct test{//页面结构build(){//容器 **一个页面只能有一个根容器父容器要有大小设置**}1、Column 组件 沿垂直方向布局的组件可以包含子组件 接口 Column({space}) space的参数为string | number 除了通用属性外还支持 alignItems(HorizontalAlign):子组件水平方向对齐 justifyContent(FlexAlign) 子组件垂直方向对齐
####2、Row组件 沿水平方向布局容器 接口Row({space:25}) pace的参数为string | number 除了通用属性外还支持 alignItems(VertialAlign):子组件垂直方向对齐 justifyContent(FlexAlign) 子组件水平方向对齐
justifyContent(FlexAlign) 和组件本身描述的方向一直
3、Button组件 创建不同样式的按钮可以包含单个子组件 接口 Button(options:{type?:ButtonType,stateEffect?:boolean}) ButtonType: 按钮样式 Capaule(胶囊) Circle(圆形)Normal(普通按钮) stateEffect: 是否显示按下效果 如果使用lable标签就不能再包含其他组件 Button(ok).width(50) √Button(ok){} ×4、Text组件 用于展示文本文本内容需要写在标签内容区支持转义字符 \ 记住常用的 fontSize,fontColor,fontWight等
5、TextInput组件 单行文本输入框 接口 TextInput(value?:{placeholder?: ResourceStr, text?: ResourceStr, controller?: TextInputController}) placeholder:提示文本 text:设置输入框当前文本输入内容 controller:控制器
6、Image组件 使用图片的三种方式 image(“url”) image(“图片名称”) //图片在ets目录下 image($r(‘图片名称’))
7、Flex组件 弹性方式布局的容器组件 接口 Flex(value?: { direction?: FlexDirection, wrap?: FlexWrap, justifyContent?: FlexAlign, alignItems?: ItemAlign, alignContent?: FlexAlign }) direction:子组件的排列方向 wrap:单行排列还是多行排列 justifyContent:子组件在主轴的对齐方向主轴方向由direction确定 alignItems:交叉轴上的对齐方式 alignContent:多行内容的对齐方式在wrap下生效
8、走马灯 Marquee 滚动展示一段单行文本只有当文本宽度超过跑马灯组件宽度滚动 Marquee(value: { start: boolean, step?: number, loop?: number, fromStart?: boolean, src: string }) start控制跑马灯是否进入播放 step:动画滚动步长 loop:滚动次数小于等于0无限循环 fromStart:设置从开头滚动还是反向滚动 src:需要滚动的文本 属性 allowScale:是否允许文本缩放 事件 onStart:开始滚动时触发回调 onBounce:完成一次滚动时触发 onFinish:滚动结束触发
9、路由跳转 通过不同的url访问不同的页面包括跳转到应用内的指定页面、用应用内的某个页面替换当前页面、返回上一页面或指定的页面等。 导入模块 pushUrl(options: RouterOptions): Promise options:跳转页面详细信息 Promise异常返回结果
