6.10鸿蒙

EntryComponentstruct TextInputDemo {build() {Column({ space: 30 }) {Text(用户登录).fontSize(28).fontWeight(FontWeight.Bold)TextInput({ placeholder: 请输入学号/手机号码 }).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)TextInput({ placeholder: 请输入密码 }).type(InputType.Password).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)Row({ space: 20 }) {Button(登录).height(50).width(100).fontSize(25)Button(注册).height(50).width(100).fontSize(25)}}.width(100%).height(100%).justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}}效果图二、信息操作界面EntryComponentstruct ButtonDemo1{build() {Column({space:30}){//常见的用于登录、提交的按钮Button(确认提交).width(300).height(50).backgroundColor(0x007DFF).fontSize(20).borderRadius(8)//灰色按钮用于取消/返回使用Row({space:10}){Button(取消操作).width(150).height(50).backgroundColor(0x999999).fontSize(20).borderRadius(8)Button(删除数据).width(150).height(50).backgroundColor(Color.Red).fontSize(20).borderRadius(8)}}.height(100%).width(100%).justifyContent(FlexAlign.Center)}}三、个人信息EntryComponentstruct TextInputDemo {build() {Column({ space: 30 }) {Text(完善个人信息).fontSize(28).fontWeight(FontWeight.Bold)TextInput({ placeholder: 姓名 }).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)TextInput({ placeholder: 班级 }).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)TextInput({ placeholder: 联系方式 }).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)/*Row({ space: 20 }) {Button(确定).height(50).width(100).fontSize(25)Button(注册).height(50).width(100).fontSize(25)}*/}.width(100%).height(100%).justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}}四、注册界面EntryComponentstruct TextInputDemo {build() {Column({ space: 30 }) {Text(用户注册).fontSize(28).fontWeight(FontWeight.Bold)TextInput({ placeholder: 请输入学号/手机号码 }).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)TextInput({ placeholder: 请输入密码 }).type(InputType.Password).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)TextInput({ placeholder: 请再次输入密码 }).type(InputType.Password).width(320).height(50).backgroundColor(0xf5f5f5).fontSize(20).borderRadius(10)}.width(100%).height(100%).justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Center)}}五、轮播展示import { radio } from kit.TelephonyKitEntryComponentstruct TextInputDemo {build() {Column({ space: 30 }) {Text(河北软件职业技术学院).fontSize(28).fontWeight(FontWeight.Bold)// 本地图片轮播 1.jpg ~ 5.jpgSwiper() {Image($r(app.media.1)).width(100%).height(200%).objectFit(ImageFit.Cover)Image($r(app.media.2)).width(100%).height(200%).objectFit(ImageFit.Cover)Image($r(app.media.3)).width(100%).height(200%).objectFit(ImageFit.Cover)Image($r(app.media.4)).width(100%).height(200%).objectFit(ImageFit.Cover)Image($r(app.media.5)).width(100%).height(200%).objectFit(ImageFit.Cover)}.width(100%).height(180).autoPlay(true).loop(true).interval(3000).borderRadius(25).shadow({radius:100,color:0xcccccc,offsetX:2,offsetY:2})}.width(100%).height(100%).justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Center)}}六、个人中心界面EntryComponentstruct UserCardDemo{build() {Column({space:20}){Text(欢迎来到我的个人中心).fontSize(30).fontWeight(FontWeight.Bolder)Row({space:20}){Image($r(app.media.1)).width(50%).borderRadius(100)Text(QY-T).width(30%).fontSize(30)}.height(100).width(100%).padding({left:20})}.width(100%).height(100%).justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}}七Entry Component struct Index { private videoCtrl: VideoController new VideoController() build() { Column({ space: 40 }) { Text(本地视频播放器) .fontSize(24) .width(100%) .textAlign(TextAlign.Center) Video({ src: $rawfile(sd.mp4), controller: this.videoCtrl, previewUri: $r(app.media.background) }) .width(100%) .height(220) .controls(false) .autoPlay(false) .loop(true) .muted(false) .objectFit(ImageFit.Contain) Row({ space: 30 }) { Button(播放) .onClick(() { this.videoCtrl.start() }) Button(暂停) .onClick(() { this.videoCtrl.pause() }) } } .width(100%) .height(100%) .padding(15) .justifyContent(FlexAlign.Center) } }