Java Swing渲染html在右側對齊文本
[英]Java Swing render html align text on the right side
問題描述
我目前正在使用 java 開發聊天 GUI，並且正在嘗試將 html css 選項與 JTextPane 一起使用。
我不熟悉 html / css 所以有點難，但我設法得到了我想要的結果，除了 1 件事。
問題是，我希望藍色聊天出現在屏幕右側，比如屏幕的 30% 是空的，然后是藍色部分。
這是我想要獲得的照片：
這是我的java代碼：
import java.awt.*;
import java.awt.event.*;
import javax.swing.*;
import javax.swing.border.*;
public class FenetreRenduHtml extends JFrame
{
private JPanel p_content;
private JTextArea ta_css;
private JTextArea ta_html_body;
private JTextPane tp_html;
private void renderHtml(String html)
{
tp_html.setContentType("text/plain");
tp_html.putClientProperty(JEditorPane.HONOR_DISPLAY_PROPERTIES, true);
tp_html.setContentType("text/html");
tp_html.setText("<html>"+html+"</html>");
}
private void renderHtml(String html_body, String style)
{
if (style==null) renderHtml(html_body);
else renderHtml("<head><style>\n"+style+"\n</style></head><body>"+html_body+"</body>");
}
private void doHtmlRender()
{
String
t_html_body = ta_html_body.getText(),
t_css = ta_css.getText();
renderHtml(t_html_body, t_css);
}
public FenetreRenduHtml()
{
setTitle("Test d'affichage en HTML");
Dimension d = new Dimension(800, 600);
setSize(d);
setMinimumSize(d);
setLocation(new Point(200, 100));
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
p_content = new JPanel();
p_content.setBorder(new EmptyBorder(5, 5, 5, 5));
setContentPane(p_content);
GridBagLayout gbl = new GridBagLayout();
gbl.columnWidths = new int[]{0, 0, 0};
gbl.rowHeights = new int[]{0, 0, 0, 0, 0, 0};
gbl.columnWeights = new double[]{1.0, 1.0, Double.MIN_VALUE};
gbl.rowWeights = new double[]{0.0, 1.0, 0.0, 1.0, 0.0, Double.MIN_VALUE};
p_content.setLayout(gbl);
Font f_mono = new Font("monospaced", Font.PLAIN, 14);
Border text_border = BorderFactory.createEmptyBorder(4, 4, 4, 4);
JLabel l_css = new JLabel("Contenu CSS");
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 5, 5);
gbc.gridx = 0;
gbc.gridy = 0;
p_content.add(l_css, gbc);
}
JScrollPane sp_css = new JScrollPane();
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 0, 5);
gbc.fill = GridBagConstraints.BOTH;
gbc.gridx = 0;
gbc.gridy = 1;
p_content.add(sp_css, gbc);
}
ta_css = new JTextArea();
ta_css.setFont(f_mono);
ta_css.setBorder(text_border);
ta_css.setText("/* Style CSS ici */");
sp_css.setViewportView(ta_css);
JLabel l_html = new JLabel("HTML source");
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 5, 5);
gbc.gridx = 0;
gbc.gridy = 2;
p_content.add(l_html, gbc);
}
JScrollPane sp_html_body = new JScrollPane();
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 0, 5);
gbc.fill = GridBagConstraints.BOTH;
gbc.gridx = 0;
gbc.gridy = 3;
p_content.add(sp_html_body, gbc);
}
ta_html_body = new JTextArea();
ta_html_body.setFont(f_mono);
ta_html_body.setBorder(text_border);
sp_html_body.setViewportView(ta_html_body);
JButton b_disp_html = new JButton("Afficher \u2192"); // "Afficher ->"
b_disp_html.addActionListener(new ActionListener()
{
public void actionPerformed(ActionEvent e)
{ doHtmlRender(); }
});
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 5, 5);
gbc.gridx = 0;
gbc.gridy = 4;
p_content.add(b_disp_html, gbc);
}
JLabel l_disp_html = new JLabel("HTML affiché");
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.insets = new Insets(0, 0, 5, 0);
gbc.gridx = 1;
gbc.gridy = 0;
p_content.add(l_disp_html, gbc);
}
JScrollPane sp_html = new JScrollPane();
{
GridBagConstraints gbc = new GridBagConstraints();
gbc.fill = GridBagConstraints.BOTH;
gbc.gridx = 1;
gbc.gridy = 1;
gbc.gridheight = 3;
p_content.add(sp_html, gbc);
}
tp_html = new JTextPane();
sp_html.setViewportView(tp_html);
}
public static void main(String[] args)
{
EventQueue.invokeLater(new Runnable()
{
public void run()
{
FenetreRenduHtml frame = new FenetreRenduHtml();
frame.setVisible(true);
}
});
}
}
這是我放在 GUI 中的 css 代碼：
h1 {
background : solid #3b82f7;
font-size : 15 ;
font-weight : normal;
color : #FFFFFF;
padding : 2px;
}
h2 {
background : solid #3c3c3c;
font-size : 15 ;
font-weight : normal;
color : #FFFFFF;
padding : 2px;
}
這是我放在 GUI 中的 html 代碼：
<html>
<div>
<div align = right width=70%>
<h1>
Hello, i'm trying to put this on the right side of the screen but i can't manage to do it
</h1>
</div>
</div>
<div align=left width=70%>
<h2>
And this is supposed to stay here so it's okay
</h2>
</div>
</html>
@hfontanez這是我從你的代碼中得到的：
1 個解決方案
解決方案1
0 2022-01-08 15:18:23
我完全改變了我的答案。 這將是我最后一次嘗試。
帶樣式的 HTML
<!DOCTYPE html>
<html>
<head>
<title>YOUR TITLE</title>
<style>
.parent{
font: 14px/1.23 sans-serif;
display: table;
table-layout: fixed;
width: 100%;
border-collapse: separate;
border-spacing: 0 10px;
}
/* ROWS */
.message{
display: table-row;
}
/* ALL CELLS */
.message > *{
position: relative;
box-sizing: border-box;
display: table-cell;
}
/* MESSAGE CELLS */
.message p {
color: #ffffff;
border-radius:4px;
padding: 12px 14px;
margin: 0 36px 0 0;
background: #3c3c3c;
width: 300px;
padding: 10px;
}
.message.left {
float: left;
}
.message.right p {
float: right;
margin: 0 0 0 36px;
background: #0000ff;
}
</style>
</head>
<body>
<div class="parent">
<div class="message left">
<p>Any luck?</p>
</div>
<div class="message right">
<p> Hello, I'm trying to put this on the right side of the screen but i can't manage to do it</p>
</div>
<div class="message left">
<p>Well... Seems to be working!</p>
</div>
<div class="message right">
<p>AWESOME!</p>
</div>
</div>
</html>
結果
如果這不起作用，那么這肯定是 Swing 的問題。
如何在Java屏幕右側顯示文本
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.