制作一个页面,页面的背景颜色及文字大小,字体和颜色可以根据用户的选择来实施,用下拉列表,,用java bean
时间: 2023-11-17 11:07:07 浏览: 90
java 编写的 颜色选择器 案例 网页制作
5星 · 资源好评率100%
首先,我们需要创建一个 Java Bean 来处理用户的选择。在这个 Bean 中,我们需要定义三个属性:背景颜色、文字大小和字体颜色。我们可以使用 Java 的内置颜色类来处理颜色,例如 Color.RED、Color.BLUE 等等。
下面是一个简单的 Java Bean 示例:
```java
public class PageStyleBean {
private Color backgroundColor;
private int fontSize;
private Color fontColor;
public Color getBackgroundColor() {
return backgroundColor;
}
public void setBackgroundColor(Color backgroundColor) {
this.backgroundColor = backgroundColor;
}
public int getFontSize() {
return fontSize;
}
public void setFontSize(int fontSize) {
this.fontSize = fontSize;
}
public Color getFontColor() {
return fontColor;
}
public void setFontColor(Color fontColor) {
this.fontColor = fontColor;
}
}
```
接下来,我们需要创建一个 JSP 页面来展示用户的选择。这个页面包含一个下拉列表,用户可以通过选择不同的选项来改变页面的样式。
下面是一个简单的 JSP 页面示例:
```html
<%@ page import="java.awt.Color" %>
<%@ page import="com.example.PageStyleBean" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Page Style Example</title>
</head>
<body style="background-color: <%= pageStyleBean.getBackgroundColor().getRGB() %>;">
<h1 style="font-size: <%= pageStyleBean.getFontSize() %>px; color: <%= pageStyleBean.getFontColor().getRGB() %>;">Welcome to my page!</h1>
<form action="<%= request.getContextPath() %>/pageStyle" method="post">
<label for="bgColor">Background Color:</label>
<select name="bgColor" id="bgColor">
<option value="<%= Color.WHITE.getRGB() %>" <%= pageStyleBean.getBackgroundColor().equals(Color.WHITE) ? "selected" : "" %>>White</option>
<option value="<%= Color.LIGHT_GRAY.getRGB() %>" <%= pageStyleBean.getBackgroundColor().equals(Color.LIGHT_GRAY) ? "selected" : "" %>>Light Gray</option>
<option value="<%= Color.GRAY.getRGB() %>" <%= pageStyleBean.getBackgroundColor().equals(Color.GRAY) ? "selected" : "" %>>Gray</option>
<option value="<%= Color.DARK_GRAY.getRGB() %>" <%= pageStyleBean.getBackgroundColor().equals(Color.DARK_GRAY) ? "selected" : "" %>>Dark Gray</option>
<option value="<%= Color.BLACK.getRGB() %>" <%= pageStyleBean.getBackgroundColor().equals(Color.BLACK) ? "selected" : "" %>>Black</option>
</select><br>
<label for="fontSize">Font Size:</label>
<select name="fontSize" id="fontSize">
<option value="12" <%= pageStyleBean.getFontSize() == 12 ? "selected" : "" %>>12px</option>
<option value="16" <%= pageStyleBean.getFontSize() == 16 ? "selected" : "" %>>16px</option>
<option value="20" <%= pageStyleBean.getFontSize() == 20 ? "selected" : "" %>>20px</option>
<option value="24" <%= pageStyleBean.getFontSize() == 24 ? "selected" : "" %>>24px</option>
<option value="28" <%= pageStyleBean.getFontSize() == 28 ? "selected" : "" %>>28px</option>
</select><br>
<label for="fontColor">Font Color:</label>
<select name="fontColor" id="fontColor">
<option value="<%= Color.BLACK.getRGB() %>" <%= pageStyleBean.getFontColor().equals(Color.BLACK) ? "selected" : "" %>>Black</option>
<option value="<%= Color.RED.getRGB() %>" <%= pageStyleBean.getFontColor().equals(Color.RED) ? "selected" : "" %>>Red</option>
<option value="<%= Color.BLUE.getRGB() %>" <%= pageStyleBean.getFontColor().equals(Color.BLUE) ? "selected" : "" %>>Blue</option>
<option value="<%= Color.GREEN.getRGB() %>" <%= pageStyleBean.getFontColor().equals(Color.GREEN) ? "selected" : "" %>>Green</option>
<option value="<%= Color.ORANGE.getRGB() %>" <%= pageStyleBean.getFontColor().equals(Color.ORANGE) ? "selected" : "" %>>Orange</option>
</select><br>
<input type="submit" value="Apply">
</form>
</body>
</html>
```
在这个 JSP 页面中,我们使用了 Java Bean 来处理用户的选择。我们首先通过 JSP 页面的 `pageStyleBean` 变量获取 Java Bean 实例,然后使用 `getBackgroundColor()`、 `getFontSize()` 和 `getFontColor()` 方法获取用户的选择。在页面的 `<body>` 和 `<h1>` 标签中,我们使用了这些属性来设置背景颜色、文字大小和字体颜色。
对于下拉列表,我们使用了 JSP 的 `<select>` 标签和 `<option>` 标签来创建。在每个 `<option>` 标签中,我们使用了 Java Bean 的属性值来设置选项的颜色、大小和颜色。我们还使用了三元运算符来判断哪个选项被选中,然后添加 `selected` 属性。
最后,我们需要创建一个 Servlet 来处理用户提交的表单数据,并应用用户的选择。在这个 Servlet 中,我们可以使用 `request.getParameter()` 方法来获取用户的选择,然后使用 Java Bean 的 `setBackgroundColor()`、`setFontSize()` 和 `setFontColor()` 方法来更新 Java Bean 实例。
下面是一个简单的 Servlet 示例:
```java
@WebServlet("/pageStyle")
public class PageStyleServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
PageStyleBean pageStyleBean = (PageStyleBean) request.getSession().getAttribute("pageStyleBean");
if (pageStyleBean == null) {
pageStyleBean = new PageStyleBean();
}
int bgColor = Integer.parseInt(request.getParameter("bgColor"));
int fontSize = Integer.parseInt(request.getParameter("fontSize"));
int fontColor = Integer.parseInt(request.getParameter("fontColor"));
pageStyleBean.setBackgroundColor(new Color(bgColor));
pageStyleBean.setFontSize(fontSize);
pageStyleBean.setFontColor(new Color(fontColor));
request.getSession().setAttribute("pageStyleBean", pageStyleBean);
response.sendRedirect(request.getContextPath() + "/pageStyle.jsp");
}
}
```
在这个 Servlet 中,我们首先获取 Java Bean 实例。如果这个实例不存在,我们就创建一个新的实例。然后,我们使用 `request.getParameter()` 方法来获取用户的选择,将其转换为整数,并使用 Java Bean 的 `setBackgroundColor()`、`setFontSize()` 和 `setFontColor()` 方法来更新 Java Bean 实例。最后,我们将 Java Bean 实例存储在会话中,并使用 `response.sendRedirect()` 方法将用户返回到 JSP 页面。
现在,我们已经完成了一个简单的页面样式选择器。用户可以使用下拉列表来选择页面的背景颜色、文字大小和字体颜色,并立即看到更改后的效果。
阅读全文