软件工程综合实践实习报告.docxVIP

软件工程综合实践 实习报告 姓名 学号 班级 项目名称 个人网页 实习地点 J7-111 实习时间 2017.7.10-2017.7.18 实习成绩 指导教师签字 2017 年 7 月 18 日 软件工程综合实践生产实习报告 1.实习目的 （1）熟练掌握jsp，css，script，用它们编写网页等。 （2）掌握Photoshop，利用它对图片进行修改切片等。 （3）提高编程能力，熟练地使用各种相关编程语言。 2.实习过程 2.1 技术准备 系统开发平台：Sublime，Photoshop，WebStorm 运行平台：Windows xp/ Windows 2007/ Windows 2008 分辨率：最佳效果1024*768（600*768） 浏览器：火狐，谷歌 2.2 功能需求 根据用户需求，设计产品时有以下要求： （1）PC 1）首页：显示用户头像，用户要求的导航栏（可以跳转到其他页面，如：我的图集、我的文集，我的简介，我的音乐），以及主轮廓上要有主图和部分我的图集中的照片。 2）点击导航栏跳转到我的图集界面：显示所有图片列表，可以进行上一页下一页操作，点击某张图片可进入显示这张图片的详情的界面。 3）点击导航栏跳转到我的文集界面：显示所有文章列表，可以进行上一页下一页操作，点击某篇文章可进入显示这篇文章的详情的界面。 4）点击导航栏跳转到我的简介界面：直接显示用户简介。 5）点击导航栏跳转到我的音乐界面：显示所有音乐列表，可进行上一页下一页操作，点击某首音乐进入显示这首歌曲的详情的界面（显示歌词和mv）。 （2）mobile 1）首页：手机端主要以图片为主，布局简洁合理好看，导航栏以图标的形式显示（点击可以跳转到其他页面，如：我的图集、我的文集，我的简介，我的音乐）。 2）点击我的图集图标进入界面：显示所有图片列表，可以进行上一页下一页操作，点击某张图片可进入显示这张图片的详情的界面。 3）点击我的文集图标进入界面：显示所有文章列表，可以进行上一页下一页操作，点击某篇文章可进入显示这篇文章的详情的界面。 4）点击我的简介图标进入界面：直接显示用户简介。 5）点击我的音乐图标进入界面：显示所有音乐列表，可进行上一页下一页操作，点击某首音乐进入显示这首歌曲的详情的界面（显示歌词和mv）。 2.3 总体设计 2.3.1系统功能结构设计 系统功能模块的结构如图2.1所示。 首页 首页 我的简介 我 的 简 介 我 的 文 集 我 的 图 集 我 的 音 乐 音乐列表简介详情文章列表 音乐列表 简介详情 文章列表 图集列表 图片详情音乐详情文章 图片详情 音乐详情 文章详情 图2.1 系统功能结构图 页数文章列表详细文章开始结束开始结束2.3.2 页数 文章列表 详细文章 开始 结束 开始 结束 页数 页数 我的图集 我的图集 上/下一页上 上/下一页 上/下一页 图片详细页 图2.2 我的图集流程图 图2.3我的文章流程图 我的图集流程图和我的文章流程图分别如图2.2和图2.3所示。通过主页点击我的图集或我的文章进入，即可显示文章和图片列表，通过列表条目可点进详细页面。 首页 首页 我的音乐 结束 详情 页数首页我的简介 页数 首页 我的简介 结束 返回 返回 图2.4 我的简介流程图 图2.5 我的音乐流程图 我的简介流程图和我的音乐流程图分别如图2.4和图2.5所示。通过主页点击我的简介即可直接查看，若进入我的音乐则可以看见具体的音乐列表，通过列表条目可点进详细的音乐播放界面。 2.4详细设计与编码 （1）PC 如图图1.1是首页，用户进入的初始界面实现导航功能。 图1.1 首页 如图图2.21和图2.22进入我的图集，显示所有图片的列表，及从当前我的图集界面点击某图片进入的图片详情界面： 图1.21 我的图集 图1.22我的图集详情界面 如图图1.31和图1.32转到我的文集界面，显示所有文集的列表，及从当前我的文集界面点击某条目进入某文档详情界面： 图1.31 我的文集 图1.32我的文集详情界面 如图图1.4进入我的简介，显示详细简介： 图1.4 我的简介 如图图1.51和图1.52进入我的音乐界面，转到音乐界面，显示所有音乐的列表，及从当前我的音乐界面点击某条目进入某音乐详情界面： 图1.51我的音乐 图1.52 我的音乐详情界面 核心代码（css样式）： @charset=utf-8;/*保证中文不乱码*/ /*初始化所有界面保证不被初始化的样式影响*/ *{ margin:0px; padding: 0px; text-decoration: none; list-styl