新版本已经发布, 点击查看2.0版本 。
一开始叫我写这个新闻发布系统的时候其实我是拒绝的,因为我有事,我想去写我的考试系统,但是他们说这个有学分,写完之后毕业变得很简单、很轻松。duang~的一下就毕业了,我才答应开始写新闻发布系统。
我的java也只学了个初级阶段,这个项目要用jsp写,tomcat做服务器。那看来我只能拿出我这个学期学了一个学期的javaee的知识来解决这个问题了。
废话不多说,项目开始......
1.首先,我为数据库设计了一张表:新闻表(本系统唯一一张表),感觉本系统表设多了并没什么卵用。
2.把dao层的方法写出来,以便后期使用。
3.界面设计(参考了一些网站,本来html就只学了一点皮毛,做起网页来老费尽了,2,3天憋出一个网页)
(1)系统首页。功能:
提供了所有新闻的浏览
提供了新闻按类别查询
提供了新闻按关键字查询
(2)后台界面。功能:
提供了新闻的删除修改,以及发布。
(3)发布新闻界面(样式是网上下载的)
提供了发布新闻的功能,可以显示图片的缩略图。
把实现jsp页面内图片预览的代码在这mark一下,做个笔记:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="java.io.*,java.util.*" %>
<%@ page import="org.springframework.context.ApplicationContext"%>
<%@ page import="org.springframework.context.support.ClassPathXmlApplicationContext"%>
<%@ page import="com.lt.News.model.News"%>
<%@ page import="com.lt.News.service.NewsService"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>发布新闻</title>
<script>
function PreviewImage(imgFile) {
var pattern = /(\.*.jpg$)|(\.*.png$)|(\.*.jpeg$)|(\.*.gif$)|(\.*.bmp$)/;
if (!pattern.test(imgFile.value)) {
alert("系统仅支持jpg/jpeg/png/gif/bmp格式的照片!");
imgFile.focus();
}
path = URL.createObjectURL(imgFile.files[0]);
document.getElementById("imgPreview").innerHTML = "<img src='"+path+"' style='width:227px; height:130px;' />";
}
</script>
<style>
body {
margin-left:auto;
margin-right:auto;
max-width: 500px;
background: #F7F7F7;
padding: 25px 15px 25px 10px;
font: 12px Georgia, "Times New Roman", Times, serif;
color: #888;
text-shadow: 1px 1px 1px #FFF;
border:1px solid #E4E4E4;
}
h1 {
font-size: 25px;
padding: 0px 0px 10px 40px;
display: block;
border-bottom:1px solid #E4E4E4;
margin: -10px -15px 30px -10px;;
color: #888;
}
h1>span {
display: block;
font-size: 11px;
}
.basic-grey label {
display: block;
margin: 0px;
}
label>span {
float: left;
width: 20%;
text-align: right;
padding-right: 10px;
margin-top: 10px;
color: #888;
}
input[type="text"], input[type="email"], textarea, select {
border: 1px solid #DADADA;
color: #888;
height: 30px;
margin-bottom: 16px;
margin-right: 6px;
margin-top: 2px;
outline: 0 none;
padding: 3px 3px 3px 5px;
width: 70%;
font-size: 12px;
line-height:15px;
box-shadow: inset 0px 1px 4px #ECECEC;
-moz-box-shadow: inset 0px 1px 4px #ECECEC;
-webkit-box-shadow: inset 0px 1px 4px #ECECEC;
}
#pic
{
border: 1px solid #DADADA;
color: #888;
height: 150px;
margin-bottom: 16px;
margin-right: 6px;
margin-top: 2px;
margin-left:110px;
outline: 0 none;
padding: 3px 3px 3px 5px;
width: 70%;
font-size: 12px;
line-height:15px;
box-shadow: inset 0px 1px 4px #ECECEC;
-moz-box-shadow: inset 0px 1px 4px #ECECEC;
-webkit-box-shadow: inset 0px 1px 4px #ECECEC;
}
textarea{
padding: 5px 3px 3px 5px;
}
select {
background: #FFF url('down-arrow.png') no-repeat right;
background: #FFF url('down-arrow.png') no-repeat right);
appearance:none;
-webkit-appearance:none;
-moz-appearance: none;
text-indent: 0.01px;
text-overflow: '';
width: 72%;
height: 35px;
line-height: 25px;
}
textarea{
height:100px;
}
.button {
background: #E27575;
border: none;
padding: 10px 25px 10px 25px;
color: #FFF;
box-shadow: 1px 1px 5px #B6B6B6;
border-radius: 3px;
text-shadow: 1px 1px 1px #9E3F3F;
cursor: pointer;
}
.button:hover {
background: #CF7A7A
}
</style>
</head>
<body>
<%
String title = "";
String author= "";
String content = "";
String update = (String)session.getAttribute("update");
if(update!=null)
{
ApplicationContext ac = new ClassPathXmlApplicationContext("applicationContext.xml");
NewsService newsService = (NewsService) ac.getBean("NewsService");
News news = newsService.getNews(Integer.parseInt(update));
title = news.getTitle();
author = news.getAuthor();
content = news.getContent();
}
%>
<form action="PublishNews" method="post" class="STYLE-NAME">
<h1><%if(update==null || update.equals("0")){%>新闻发布<%}else{%>新闻修改<%} %>
<span>Please fill all the texts in the fields.</span>
</h1>
<label>
<span>标题 :</span>
<input id="name" type="text" name="title" value="<%=title %>" />
</label>
<label>
<span>作者 :</span>
<input id="email" type="text" name="author" value="<%=author %>" />
</label>
<label>
<span>内容 :</span>
<textarea id="message" name="content" ><%=content %></textarea>
</label>
<label>
<br /><span>图片 :</span>
<div id="pic">
<input type="file" name="pic" onchange='PreviewImage(this)'/>
<div id="imgPreview"> </div>
</div>
</label>
<label>
<span>类型 :</span>
<select name="type">
<option value="社会">社会</option>
<option value="娱乐">娱乐</option>
<option value="娱乐">军事</option>
<option value="娱乐">体育</option>
<option value="娱乐">财经</option>
</select>
</label>
<label>
<span> </span>
<input type="submit" class="button" value="发布" />
</label>
</form>
</body>
</html>
(4)修改新闻界面(和新闻发布界面一样,只是处理方式不同)
(5)显示新闻界面
显示了新闻有关信息,访问量,评论等。
学了这么久的java,只有这个项目才算是最完整的了,之前做了几个项目都是由于种种原因而中途夭折了。
整个项目单独完成,耗时一个星期,简直是慢的出奇了。应该是练得太少不够熟练。
这个暑假要开始java中级阶段的学习了,更要努力了。
这里放出源码,看到我这篇文章的朋友可以根据需要下载,欢迎多多批评指正!http://pan.baidu.com/s/1c0CXgnm