显示内容

---

@Entry

@Component

struct StatesDemo3{

@State inputText:string=""

build() {

Column({space:20}){

Text(`你输入的内容是: ${this.inputText}`)

.fontSize(26)

TextInput({text:this.inputText,placeholder:"请输入任意内容"})

.width('100%')

.height(50)

.padding({left:20})

.onChange((value: string) => {

this.inputText = value

})

}

.width('100%')

.height('100%')

.padding(30)

}

}

效果图：

个人信息

@Entry

@Component

struct TextInputDemo{

  build() {

    Column({space:30}){

      Text('完善个人信息')

        .fontSize(28)

        .fontWeight(FontWeight.Bolder)

        .margin({bottom:20})

      TextInput({placeholder:"请输入真实姓名"})

        .width(320)

        .height(80)

        .backgroundColor(0xf8f8f8)

        .borderRadius(15)

      TextInput({placeholder:"请输入所在班级"})

        .width(320)

        .height(80)

        .backgroundColor(0xf8f8f8)

        .borderRadius(15)

      TextInput({placeholder:"请输入联系方式"})

        .width(320)

        .height(80)

        .backgroundColor(0xf8f8f8)

        .borderRadius(15)

    }

    . width('100%')

    .height('100%')

    .justifyContent(FlexAlign.Center)

    .alignItems(HorizontalAlign.Center)

  }

}

效果图：

个人简历

@Entry

@Component

struct ResumePage {

build() {

Column(){

Text("个人简历")

.width("100%")

.fontSize(25)

.fontWeight(FontWeight.Bold)

.textAlign(TextAlign.Center)

.padding(15)

.border({width:1,color:Color.Black})

Row(){

Column(){

Row(){

Text("姓名：QY-T")

.fontSize(12)

.width("46%")

Text("性别：男")

.fontSize(12)

.width("27%")

Text("年龄：20")

.fontSize(12)

.width("27%")

}

.width("100%")

.padding(20)

.border({width:1,color:Color.Black}).height(80)

Row({space:10}){

Text("毕业学校：河软")

.fontSize(12)

.width("40%")

Text("专业：计应")

.fontSize(12)

.width("27%")

Text("学历：博士")

.fontSize(12)

.width("27%")

}

.width("100%")

.padding(12)

.border({width:1,color:Color.Black}).height(80)

}

.width("70%")

Image($r("app.media.1"))

.width("30%")

.height(160)

.objectFit(ImageFit.Cover)

.border({width:1,color:Color.Black})

}

.width("100%")

Row(){

Text("电话：888888888")

.fontSize(12)

.width("50%")

.padding(20)

.border({width:1,color:Color.Black})

Text("邮箱：tuu123@qq.com")

.fontSize(12)

.width("50%")

.padding(20)

.border({width:1,color:Color.Black})

}

.width("100%")

Column(){

Text("个人简介")

.fontSize(12)

.fontWeight(FontWeight.Bold)

.padding(15)

Text("计算机专业在校学生，掌握SQL数据库、Web基础、计算机基础、python等，具备项目开发与团队协作经验，热爱编程，学习能力强。")

.fontSize(12)

.padding({left:20,right:20,bottom:30})

}

.width("100%")

.border({width:1,color:Color.Black})

Column(){

Text("主修课程")

.fontSize(12)

.fontWeight(FontWeight.Bold)

.padding(15)

Text("计算机基础、数据库SQL、Web前端开发、鸿蒙应用开发、计算机网络、操作系统、数据结构")

.fontSize(12)

.padding({left:20,right:20,bottom:30})

}

.width("100%")

.border({width:1,color:Color.Black})

Column(){

Text("求职意向")

.fontSize(12)

.fontWeight(FontWeight.Bold)

.padding(15)

Text("前端开发工程师 / 后端开发工程师 / 软件编程")

.fontSize(12)

.padding({left:20,right:20,bottom:30})

}

.width("100%")

.border({width:1,color:Color.Black})

Column(){

Text("自我评价")

.fontSize(12)

.fontWeight(FontWeight.Bold)

.padding(15)

Text("具备扎实计算机专业基础，熟练使用ArkTS完成鸿蒙页面搭建，拥有社团项目开发经验；逻辑清晰，善于沟通，能快速学习新技术，可独立完成基础功能开发，愿意从基层岗位积累成长。")

.fontSize(12)

.padding({left:20,right:20,bottom:30})

}

.width("100%")

.border({width:1,color:Color.Black})

}

.width("100%")

.height("100%")

.backgroundColor(0xF0F0F0)

}

}

注册信息

@Entry

@Component

struct TextInputDemo{

  build() {

    Column({space:30}){

      Text('用户注册')

        .fontSize(28)

        .fontWeight(FontWeight.Bolder)

        .margin({bottom:20})

      TextInput({placeholder:"请输入用户名"})

        .width(320)

        .height(60)

        .backgroundColor(0xf5f5f5)

        .fontSize(20)

        .borderRadius(10)

      TextInput({placeholder:"请输入学号/手机号码"})

        .width(320)

        .height(60)

        .backgroundColor(0xf5f5f5)

        .fontSize(20)

        .borderRadius(10)

      TextInput({placeholder:"请输入密码"})

        .type(InputType.Password)

        .width(320)

        .height(60)

        .backgroundColor(0xf5f5f5)

        .fontSize(20)

        .borderRadius(10)

      TextInput({placeholder:"请再次输入密码"})

        .type(InputType.Password)

        .width(320)

        .height(60)

        .backgroundColor(0xf5f5f5)

        .fontSize(20)

        .borderRadius(10)

      Button('注册')

        .height(50)

        .width(200)

        .fontSize(25)

    }

    . width('100%')

    .height('100%')

    .justifyContent(FlexAlign.Center)

    .alignItems(HorizontalAlign.Center)

  }

}

效果图：

注册与登录跳转

import router from '@ohos.router';

@Entry

@Component

struct RouterLogin{

  build() {

    Column({space:25}){

      Image($r('app.media.baan2'))

        .width(120)

        .height(120)

        .borderRadius(60)

      Text("登 录")

        .fontSize(32)

        .fontWeight(FontWeight.Bold)

      Row({space:15}){

        Text("账 号")

          .fontSize(26)

        TextInput()

          .width("70%")

          .height(50)

      }

      Row({space:15}){

        Text("密 码")

          .fontSize(26)

        TextInput()

          .width("70%")

          .height(50)

          .type(InputType.Password)

      }

      Text("没有账号，立即注册")

        .fontSize(22)

        .fontColor(0xababab)

        .onClick(()=>{

          router.pushUrl({

            url:"pages/RouterRegister"

          })

        })

      Button("立 即 登 录")

        .width('100%')

        .height(50)

        .fontSize(24)

    }

    .width('100%')

    .height('100%')

    .padding(15)

  }

}

效果图: