基于OpenHarmony鸿蒙开发记事本APP

本文介绍了一个基于鸿蒙HarmonyOS开发的完整记事本应用。项目采用ArkTS声明式开发范式，实现了用户管理（注册/登录）、记事本CRUD操作、本地数据存储等核心功能。技术架构包含前端ArkTS组件和RdbStore SQLite数据库后端，采用单例模式管理数据。数据库设计包含用户表和记事本表，支持数据持久化。应用包含启动页、登录页、主页和编辑页等功能模块，提供了完整的记事本管理体验。

东晋谨慎的冬瓜

422人浏览 · 2026-01-28 10:53:33

东晋谨慎的冬瓜 · 2026-01-28 10:53:33 发布

文章目录

一、项目概述

本项目是一个完整的鸿蒙HarmonyOS记事本应用，实现了用户管理、记事本CRUD操作、本地数据存储等核心功能。项目采用ArkTS声明式开发范式，使用RdbStore SQLite数据库进行数据持久化。

二、已实现功能

1. 启动页

3秒倒计时启动动画
Logo展示和应用介绍

2. 用户管理

用户注册功能
用户登录验证
记住密码

3. 记事本功能

创建新记事本
编辑现有记事本
删除记事本
搜索记事本
按时间排序显示

4. 数据存储

使用RdbStore SQLite数据库
本地数据持久化
支持用户数据和记事本数据存储

三、技术架构

1. 前端技术

ArkTS声明式开发范式
HarmonyOS原生组件
响应式状态管理

2. 后端技术

RdbStore关系型数据库
SQLite数据存储
单例模式数据库管理

3. 项目结构

entry/src/main/ets/
├── pages/           # 页面组件
│   ├── Index.ets   # 启动页
│   ├── Login.ets   # 登录页
│   ├── Home.ets    # 主页（记事本列表）
│   └── EditNotepad.ets # 编辑记事本页
├── common/          # 公共组件
│   └── NotepadDatabase.ets # 数据库管理类
└── entryability/    # 应用入口
    └── EntryAbility.ets

四、数据库设计

1. 用户表 (users)

id: 主键
username: 用户名（唯一）
password: 密码
create_time: 创建时间

CREATE TABLE users (
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  username TEXT UNIQUE NOT NULL,
  password TEXT NOT NULL,
  create_time INTEGER NOT NULL
);

2. 记事本表 (notepads)

id: 主键
title: 标题
content: 内容
create_time: 创建时间
update_time: 更新时间

CREATE TABLE notepads (
  id INTEGER PRIMARY KEY AUTOINCREMENT,
  title TEXT NOT NULL,
  content TEXT NOT NULL,
  create_time INTEGER NOT NULL,
  update_time INTEGER NOT NULL
);

五、核心功能实现详解

1. 记住密码

  async initPreferences() {
    try {
      const context = getContext(this);
      const storage = await preferences.getPreferences(context, 'login_preferences');
      this.preferencesHelper = storage;

      // 读取保存的登录信息
      const savedUsername = await storage.get('username', '') as string;
      const savedPassword = await storage.get('password', '') as string;
      const savedRememberPassword = await storage.get('rememberPassword', false) as boolean;

      if (savedRememberPassword && savedUsername && savedPassword) {
        this.username = savedUsername;
        this.password = savedPassword;
        this.rememberPassword = true;
      }
    } catch (error) {
      console.info('-----------', '初始化偏好设置失败:', error);
    }
  }

2.保存用户信息

async saveLoginInfo() {
    if (!this.preferencesHelper) {
      return;
    }

    try {
      if (this.rememberPassword) {
        // 保存用户名、密码和记住密码状态
        await this.preferencesHelper.put('username', this.username);
        await this.preferencesHelper.put('password', this.password);
        await this.preferencesHelper.put('rememberPassword', true);
      } else {
        // 清除保存的密码，但保留用户名
        await this.preferencesHelper.delete('password');
        await this.preferencesHelper.put('rememberPassword', false);
      }

      // 刷新数据
      await this.preferencesHelper.flush();
    } catch (error) {
      console.info('-----------', '保存登录信息失败:', error);
    }
  }

3. 注册实现

async handleRegister() {
    if (!this.username.trim() || !this.password.trim() || !this.confirmPassword.trim()) {
      promptAction.showToast({ message: '请填写完整信息' });
      return;
    }

    if (this.password !== this.confirmPassword) {
      promptAction.showToast({ message: '两次密码输入不一致' });
      return;
    }

    if (this.password.length < 6) {
      promptAction.showToast({ message: '密码长度至少6位' });
      return;
    }

    this.isLoading = true;

    try {
      // 检查用户名是否已存在
      const existingUser = await this.database.getUserByUsername(this.username.trim());
      if (existingUser) {
        promptAction.showToast({ message: '用户名已存在' });
        return;
      }

      // 创建新用户
      const newUser: User = {
        username: this.username.trim(),
        password: this.password.trim(),
        createTime: Date.now()
      };

      await this.database.createUser(newUser);
      promptAction.showToast({ message: '注册成功' });

      // 注册成功，返回登录页面
      router.back();
    } catch (error) {
      console.info('-----------', '注册失败:', error);
      promptAction.showToast({ message: '注册失败，请重试' });
    } finally {
      this.isLoading = false;
    }
  }