黑马程序员技术交流社区

标题: UI界面设计问题求解 [打印本页]

作者: 周建 时间: 2012-3-24 01:02
标题: UI界面设计问题求解
public void init(){
f = new Frame("TalkWin");
f.setBounds(300,400,500,400);
f.setLayout(new FlowLayout(FlowLayout.LEADING));
ta1 = new TextArea(14,45);
ta2 = new TextArea(5,45);
bt = new Button("发送");
f.add(ta1);
f.add(ta2);
f.add(bt);
myEvent();
f.setVisible(true);
}
我想做一个类似于QQ的聊天窗口，但组件的布局不会设置，按照上面的做法，程序运行后是对的，但是全屏显示，各组件就都在第一行按顺序排列；
查了半天文档也没搞明白，在此求教；
-----------如何将各组件全部靠左侧从上往下排列，最好能传授布局设置技巧，非常感谢

作者: 庞子华 时间: 2012-3-24 01:10
组件是要组合使用的！我这有一个平常的小的登陆界面
* 功能：登陆界面
*/
package tuxingjiemian;
import java.awt.*;

import javax.swing.*;
public class Demo9_2 extends JFrame
{

//定义需要的组件
JPanel jp1,jp2,jp3,jp4,jp5;
JLabel jlb1,jlb2;
JButton jb1,jb2;
JTextField jtf;
JPasswordField jpf;
public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo9_2 demo9_2 =new Demo9_2();
}
public Demo9_2()
{
//初始化组件
jp1=new JPanel();
jp2=new JPanel();
jp3=new JPanel();
jp4=new JPanel();
jp5=new JPanel();

jlb1=new JLabel("用户名: ");
jlb2=new JLabel("密码: ");

jb1=new JButton("登陆");
jb2=new JButton("取消");

jtf=new JTextField(10);
jpf=new JPasswordField(10);
//设置布局管理器
this.setLayout(new GridLayout(5, 1));

//添加组件

jp1.add(jlb1);
jp1.add(jtf);
jp2.add(jlb2);
jp2.add(jpf);
jp3.add(jb1);
jp3.add(jb2);

this.add(jp5);
this.add(jp1);
this.add(jp2);
this.add(jp3);
this.add(jp4);
//设置属性
this.setTitle("登陆界面");
this.setSize(300, 200);
this.setLocation(300, 100);
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setResizable(false);

//显示
this.setVisible(true);

}

作者: 庞子华 时间: 2012-3-24 01:12
至于qq界面都是好几个布局管理器组合起来的！

作者: 亚男 时间: 2012-3-24 02:17
你可以考虑下布局管理器的,,在Java中有五大布局管理器：网格布局（GrifLayout）框架布局（BorderLayout）流式布局（FlowLayout）卡片布局（CarfLayout）网袋布局（GriBagLayout）,,呵呵,供你参考下,,

作者: 亚男 时间: 2012-3-24 02:27
其中网袋布局不仅可以设置每个组件占多少空间还可以随意设置摆放位置,他下面是靠支持类（GridBagConstraints）完成的,这个支持类有十一个参数呢,具体你查下类库就知道了,这个应该能符合你的要求,

作者: 庞子华 时间: 2012-3-24 09:01
这有三个最常用的布局管理器，要解决你那个问题需要先画一下图。再用这三个组合！我没写过你说的那个，有时间了我写下看看啊
1.边界布局：
/**
* BorderLoayout演示
* 1.继承一个JFrame
* 2.定义你需要的组件
* 3.创建组件（构造函数中）
* 4.添加组件
* 5.对窗体设置
* 6.显示窗体
*/
package tuxingjiemian;
import java.awt.*;
import javax.swing.*;
public class Demo8_2 extends JFrame
{
JButton jb1,jb2,jb3,jb4,jb5;

public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_2 demo8_2=new Demo8_2();

}
public Demo8_2()
{
//创建组件
jb1=new JButton("中部");
jb2=new JButton("北部");
jb3=new JButton("东部");
jb4=new JButton("南部");
jb5=new JButton("西部");
//添加组件
this.add(jb1,BorderLayout.CENTER);
this.add(jb2,BorderLayout.NORTH);
this.add(jb3,BorderLayout.EAST);
this.add(jb4,BorderLayout.SOUTH);
this.add(jb5,BorderLayout.WEST);
//设置窗体属性
this.setTitle("边界布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);
}

}
2.流式布局
/**
* 功能：流式布局案例FlowLayout
* 1.
*/
package tuxingjiemian;
import java.awt.*;

import javax.swing.*;
public class Demo8_3 extends JFrame
{

JButton jb1,jb2,jb3,jb4,jb5,jb6;
public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_3 demo8_3=new Demo8_3();

}
public Demo8_3()
{
//创建组件
jb1=new JButton("关羽");
jb2=new JButton("张飞");
jb3=new JButton("赵云");
jb4=new JButton("黄忠");
jb5=new JButton("马超");
jb6=new JButton("刘备");
//tianjia
this.add(jb1);
this.add(jb2);
this.add(jb3);
this.add(jb4);
this.add(jb5);
this.add(jb6);
//设置布局管理器
this.setLayout(new FlowLayout(FlowLayout.LEFT));

//设置属性
this.setTitle("流式布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//禁止用户改变窗体大小
this.setResizable(false);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);

}

}
3.网格布局
/**
* 功能：网格布局演示GridLayout
*/
package tuxingjiemian;
import java.awt.*;

import javax.swing.*;
public class Demo8_4 extends JFrame
{
//用数组定义组件

int size =9;
JButton jbs[]=new JButton[size];
public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_4 demo8_4=new Demo8_4();
}
public Demo8_4()
{
for (int i = 0; i < size; i++)
{
jbs[i]=new JButton(String.valueOf(i));
}
//设置网格布局
this.setLayout(new GridLayout(3, 3,10,10));
//添加组件
for (int i = 0; i < size; i++)
{
this.add(jbs[i]);
}
//设置窗体属性
this.setTitle("网格布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//禁止用户改变窗体大小
this.setResizable(false);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);
}

}

作者: 庞子华 时间: 2012-3-24 09:02
这有三个最常用的布局管理器，要解决你那个问题需要先画一下图。再用这三个组合！我没写过你说的那个，有时间了我写下看看啊
1.边界布局：
/**
* BorderLoayout演示
* 1.继承一个JFrame
* 2.定义你需要的组件
* 3.创建组件（构造函数中）
* 4.添加组件
* 5.对窗体设置
* 6.显示窗体
*/
package tuxingjiemian;
import java.awt.*;
import javax.swing.*;
public class Demo8_2 extends JFrame
{
JButton jb1,jb2,jb3,jb4,jb5;

public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_2 demo8_2=new Demo8_2();

}
public Demo8_2()
{
//创建组件
jb1=new JButton("中部");
jb2=new JButton("北部");
jb3=new JButton("东部");
jb4=new JButton("南部");
jb5=new JButton("西部");
//添加组件
this.add(jb1,BorderLayout.CENTER);
this.add(jb2,BorderLayout.NORTH);
this.add(jb3,BorderLayout.EAST);
this.add(jb4,BorderLayout.SOUTH);
this.add(jb5,BorderLayout.WEST);
//设置窗体属性
this.setTitle("边界布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);
}

}
2.流式布局
/**
* 功能：流式布局案例FlowLayout
* 1.
*/
package tuxingjiemian;
import java.awt.*;

import javax.swing.*;
public class Demo8_3 extends JFrame
{

JButton jb1,jb2,jb3,jb4,jb5,jb6;
public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_3 demo8_3=new Demo8_3();

}
public Demo8_3()
{
//创建组件
jb1=new JButton("关羽");
jb2=new JButton("张飞");
jb3=new JButton("赵云");
jb4=new JButton("黄忠");
jb5=new JButton("马超");
jb6=new JButton("刘备");
//tianjia
this.add(jb1);
this.add(jb2);
this.add(jb3);
this.add(jb4);
this.add(jb5);
this.add(jb6);
//设置布局管理器
this.setLayout(new FlowLayout(FlowLayout.LEFT));

//设置属性
this.setTitle("流式布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//禁止用户改变窗体大小
this.setResizable(false);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);

}

}
3.网格布局
/**
* 功能：网格布局演示GridLayout
*/
package tuxingjiemian;
import java.awt.*;

import javax.swing.*;
public class Demo8_4 extends JFrame
{
//用数组定义组件

int size =9;
JButton jbs[]=new JButton[size];
public static void main(String[] args)
{
// TODO Auto-generated method stub
Demo8_4 demo8_4=new Demo8_4();
}
public Demo8_4()
{
for (int i = 0; i < size; i++)
{
jbs[i]=new JButton(String.valueOf(i));
}
//设置网格布局
this.setLayout(new GridLayout(3, 3,10,10));
//添加组件
for (int i = 0; i < size; i++)
{
this.add(jbs[i]);
}
//设置窗体属性
this.setTitle("网格布局演示");
this.setSize(300,200);
this.setLocation(200,200);
//禁止用户改变窗体大小
this.setResizable(false);
//关闭方式
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//显示窗体
this.setVisible(true);
}

}

作者: 庞子华 时间: 2012-3-24 09:04
还有给你个建议，写代码不要一口起写下来，要每个相同功能的放块

作者: 庞子华 时间: 2012-3-24 09:04
再给你个写界面程序的步骤啊
1.继承一个JFrame
* 2.定义你需要的组件
* 3.创建组件（构造函数中）
* 4.添加组件
* 5.对窗体设置
* 6.显示窗体
*/

作者: 梁锡伟 时间: 2012-3-24 10:20
在这个最宝贵的时间段研究java的gui，得不偿失

作者: 唐朋 时间: 2012-3-24 11:45
新手不建议使用写代码的方式来布局，可以使用ui的拖拽功能，

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2