Harmony鸿蒙实战开发-博客新闻app「首页、广场、体系、公众号、我的、登录注册、并可收藏进行查看」【源码在文末】-北京尧图网络

Harmony鸿蒙实战开发-博客新闻app「首页、广场、体系、公众号、我的、登录注册、并可收藏进行查看」【源码在文末】文章目录Harmony鸿蒙实战开发-博客新闻app「首页、广场、体系、公众号、我的、登录注册、并可收藏进行查看」【源码在文末】一、运行演示1、首页2、广场3、体系4-1、公众号界面4-2、公众号内容5、我的-未登录6、登录注册提醒7、登录注册8、我的-登录后9、收藏内容二、部分代码三、源码运行工具DevEco Studio一、运行演示1、首页2、广场3、体系4-1、公众号界面4-2、公众号内容5、我的-未登录6、登录注册提醒7、登录注册8、我的-登录后9、收藏内容二、部分代码import router from ohos.router import promptAction from ohos.promptAction import Api from ../net/Api import UserService, { User } from ../service/UserService import { LoadState, PageLoading } from ../widget/PageLoading import { TitleLayout } from ../widget/TitleLayout class UserInfo { name: string level: string rank: string point: string } Component export struct Mine { State loadState: LoadState LoadState.SUCCESS; State showLoading: boolean false; State title: string ; private unLoginInfo: UserInfo { name: 未登录, level: , rank: , point: } State userInfo: UserInfo this.unLoginInfo; State isLogin: boolean false; private userObserver (user?: User) { if (user) { this.isLogin true; this.userInfo { name: user.nickname, level: user.level, rank: user.rank, point: user.coinCount.toString() } } else { this.isLogin false; this.userInfo this.unLoginInfo } } aboutToAppear() { UserService.get().addUserObserver(this.userObserver); let user UserService.get().getUser(); this.userObserver(user); } aboutToDisappear() { UserService.get().removeUserObserver(this.userObserver); } clickUrl( url: string ) { router.pushUrl({ url: pages/WebPage, params: { url: url } }); } async logout() { let res await promptAction.showDialog({ title: 提示, message: 确认退出登录, buttons: [ { text: 确认, color: $r(app.color.main) }, { text: 取消, color: $r(app.color.text_h2) } ] }) if (res.index 0) { await Api.get().logout(); UserService.get().clearUser(); } } build() { PageLoading({ loadState: $loadState, showLoading: $showLoading }) { Column() { TitleLayout({ title: $title, isJustShowStatusBar: true }) Column() { Image($r(app.media.icon_fly)) .objectFit(ImageFit.Cover) .clip(new Circle({ width: 100, height: 100 })) // .borderWidth(20) // .borderColor(Color.Gray) // .borderRadius(20) .width(100) .height(100) Text(this.userInfo.name) .fontColor($r(app.color.text_h1)) .fontSize(17) .margin({ top: 16 }) Row({ space: 5 }) { Text(LV this.userInfo.level) .fontColor($r(app.color.white)) .fontSize(15) .backgroundColor($r(app.color.green)) .padding({ left: 4, top: 2, right: 4, bottom: 2 }) Text(排名 this.userInfo.rank) .fontColor($r(app.color.white)) .fontSize(15) .backgroundColor($r(app.color.blue)) .padding({ left: 4, top: 2, right: 4, bottom: 2 }) } .margin({ top: 16 }).visibility(Visibility.None) Row({ space: 5 }) { Text(博客地址) .fontColor($r(app.color.white)) .fontSize(15) .backgroundColor($r(app.color.green)) .padding({ left: 4, top: 2, right: 4, bottom: 2 }) //Text(Ddup this.userInfo.rank) //.fontColor($r(app.color.white)) //.fontSize(15) //.backgroundColor($r(app.color.blue)) //.padding({ left: 4, top: 2, right: 4, bottom: 2 }) } .onClick(() this.clickUrl(https://blog.csdn.net/m0_63324772)) .margin({ top: 16 }) Row({ space: 5 }) { Text(GitHub地址) .fontColor($r(app.color.white)) .fontSize(15) .backgroundColor($r(app.color.green)) .padding({ left: 4, top: 2, right: 4, bottom: 2 }) //Text(androideoe this.userInfo.rank) //.fontColor($r(app.color.white)) //.fontSize(15) //.backgroundColor($r(app.color.blue)) //.padding({ left: 4, top: 2, right: 4, bottom: 2 }) } .onClick(() this.clickUrl(https://blog.csdn.net/m0_63324772)) .margin({ top: 16 }) } .margin({ top: 30 }) .alignItems(HorizontalAlign.Center) .onClick((e) { UserService.get().checkLogin() }) Row() { Text(我的积分) .layoutWeight(1) .fontSize(15) .fontColor($r(app.color.text_h1)) Text(this.userInfo.point) .fontSize(15) .fontColor($r(app.color.text_h1)) } .width(100%) .height(50) .margin({ top: 50 }) .alignItems(VerticalAlign.Center) .padding({ left: 16, right: 16 }) .backgroundColor($r(app.color.white)) .onClick((e) { UserService.get().checkLogin() }) Row() .width(100%) .height(0.5) .backgroundColor($r(app.color.divider)) Row() { Text(我的收藏) .layoutWeight(1) .fontSize(15) .fontColor($r(app.color.text_h1)) Image($r(app.media.ic_arrow_right)) .fillColor($r(app.color.text_h1)) .width(20) .height(20) } .width(100%) .height(50) .alignItems(VerticalAlign.Center) .padding({ left: 16, right: 16 }) .backgroundColor($r(app.color.white)) .onClick((event) { UserService.get().checkLogin(() { router.pushUrl({ url: pages/CollectList }) }) }) if (this.isLogin) { Column() { Button(退出登录, { type: ButtonType.Capsule }) .width(100%) .fontSize(15) .fontColor($r(app.color.white)) .backgroundColor($r(app.color.red)) .onClick((e) { this.logout(); }) } .width(100%) .margin({ top: 50 }) .padding({ left: 16, right: 16 }) } } .width(100%) .height(100%) } } }三、源码相关鸿蒙项目点此专栏通过百度网盘分享的文件…zip 链接百度网盘请输入提取码文件已经加密请点击下方名片获取源码或Lvnvn0508

Harmony鸿蒙实战开发-博客新闻app「首页、广场、体系、公众号、我的、登录注册、并可收藏进行查看」【源码在文末】

相关推荐

AMCT PyTorch 蒸馏量化接口 create_distill_model 完全指南：将浮点模型改造为可蒸馏的量化压缩模型

Nacos 适配达梦和人大金仓：国产数据库方言与SPI插件落地

超声图像CNN分类实践：甲状腺结节良恶性诊断的完整工程流程

更多资讯

MiroFish：基于 Miro Web SDK 的协作白板多人养鱼应用

基于BP神经网络与SVM的生物炭土壤水分预测建模与MATLAB实现

flutter doctor 检查不过？Cursor 的模型通道改走 TaoToken 再排查鸿蒙环境

镜筒量产平面度一致性偏差：光学轮廓仪诊断与工艺整治

WinPE环境下360系统急救箱深度技术解析

5分钟上手Swift编程语言中文版：DocC本地预览与快速开始教程

今日更新

AReaL 调试指南：从 Agent Workflow 验证到分布式训练死锁诊断

MATLAB实现GPS L1 C/A信号仿真与二维捕获验证

彻底搞懂ASCII、Unicode与UTF-8：从乱码根源到编码实战

本周精选

AI驱动的自动化专利分析平台技术解析

LeetCode-Go 题解：1252. Cells with Odd Values in a Matrix（奇数值单元格计数）双解法剖析

在线答疑系统Java毕设实战：Spring Boot前后端分离与状态流转

本月热门

基于YOLO的焊缝缺陷检测：从数据标注到工业部署全流程实践

分布式服务的决策记录

创业产品的首版范围

读完文章，想聊聊您的网站？