posts - 28, comments - 27, trackbacks - 0, articles - 0
  BlogJava :: 首页 :: 新随笔 :: 联系 :: 聚合  :: 管理
首先是一个效果图:

login.JPG

为了不违反保密协议,偶在这里把logo和相关的东西都涂掉了,希望不会让人觉得难看....

ok,下面就开始讲述偶的coding过程:

首先捏,Dialog是分为三部分的,Window Title Bar,Content Area和Button Bar

这里的Window Title Bar素很难改动滴,偶也米改....而接下来的ContentArea和ButtonBar因为素分成两截滴,所以就要把一张背景图片拆成两截,分别设置成ContentArea和ButtonBar的背景图片鸟~~~
    protected Control createDialogArea(Composite parent) {
        Composite composite = (Composite) super.createDialogArea(parent);
        composite.setBackgroundImage(backgroundImage);
        .......
    }

    protected Control createButtonBar(Composite parent) {
        Control composite 
= super.createButtonBar(parent);
        composite.setBackgroundImage(backgroundBtmImage);
        .......
       
return composite;
    }

当然,仅仅做到这些还是远远不够滴,不信,你看~~~

login2.JPG

看到效果了咩....接下来偶们要做滴就是解决掉背景的问题,因为这个对话框里面没有Table、Tree之类的控件,于是在createDialogArea()方法中加入一行:

composite.setBackgroundMode(SWT.INHERIT_DEFAULT);

我们再来看看改变后的效果:

login3.JPG

如上图所示,介个ContentArea的背景问题已经解决鸟,下面就素重中之重滴ButtonArea鸟~~~让我们打开Dialog的源代码,看一下createButtonBar()的部分,就可以发现里面有两行:

        GridData data = new GridData(GridData.HORIZONTAL_ALIGN_END
                
| GridData.VERTICAL_ALIGN_CENTER);
        composite.setLayoutData(data);

介样子怎么能行捏,偶们需要让介个Composite填满整个DialogArea,这样子才可以显示出整个背景图片,所以偶们就要在重写后的方法中加入下面一行代码:

composite.setLayoutData(new GridData(SWT.FILL, SWT.TOP, falsefalse));

现在让偶们再来看看运行后的结果:

login4.JPG

为什么会素介个样子捏?即使素把layout改成SWT.RIGHT,也不会改变介个结果...偶快要郁闷滴抓狂鸟.....

经过漫长滴测试,偶终于发现鸟,如果控件滴layoutData不grabExcessSpace的话,那么现在滴DialogArea的Composite实际大小就素两个Button加起来滴大小,所以无论如何也素不会居右对齐滴....介可怎么办捏.....如果去重写createButton方法滴话,那介个dialog滴代码可就太丑陋鸟....

在一个偶然滴机会下,偶终于发现鸟SWT.RIGHT_TO_LEFT !!!偶依稀见到鸟灿烂滴曙光!8过Composite的style素在创建时指定的,似乎米办法在后面覆盖,所以偶们只好整个滴把createButtonBar重写掉鸟~~~

    protected Control createButtonBar(Composite parent) {
        Composite composite 
= new Composite(parent, SWT.RIGHT_TO_LEFT
                
| SWT.NONE);
        
// create a layout with spacing and margins appropriate for the font
        
// size.
        GridLayout layout = new GridLayout();
        layout.makeColumnsEqualWidth 
= true;
        layout.marginWidth 
= convertHorizontalDLUsToPixels(IDialogConstants.HORIZONTAL_MARGIN);
        layout.marginHeight 
= convertVerticalDLUsToPixels(IDialogConstants.VERTICAL_MARGIN);
        layout.horizontalSpacing 
= convertHorizontalDLUsToPixels(IDialogConstants.HORIZONTAL_SPACING);
        layout.verticalSpacing 
= convertVerticalDLUsToPixels(IDialogConstants.VERTICAL_SPACING);
        layout.marginLeft 
= 10;
        composite.setLayout(layout);
        GridData data 
= new GridData(SWT.FILL, SWT.TOP, falsefalse);
        composite.setLayoutData(data);
        composite.setFont(parent.getFont());

        
// Add the buttons to the button bar.
        createButtonsForButtonBar(composite);
        composite.setBackgroundImage(backgroundBtmImage);
        
return composite;
    }

在上面的代码中,偶除了对偶所提到的地方进行了修改以外,还加上鸟一行: layout.marginLeft = 10;

介个素因为如果右边距过小滴话,背景图片就会被覆盖掉一些,而因为偶们用到鸟
SWT.RIGHT_TO_LEFT,所以应当设置marginLeft滴值 :-)

还有一点素8能忘记滴,就素要重写一下setButtonLayoutData(Button button)方法,因为偶们要把Button改成居右对齐:

    protected void setButtonLayoutData(Button button) {
        GridData data 
= new GridData(SWT.RIGHT, SWT.CENTER, falsefalse);
        
int widthHint = convertHorizontalDLUsToPixels(IDialogConstants.BUTTON_WIDTH);
        Point minSize 
= button.computeSize(SWT.DEFAULT, SWT.DEFAULT, true);
        data.widthHint 
= Math.max(widthHint, minSize.x);
        button.setLayoutData(data);
    }

然后再在createButtonsForButtonBar()方法中,把创建按钮的顺序改变一下,偶们就可以看到最开始滴那张美丽滴对话框鸟~~~虽然被偶涂改滴有些不美丽鸟~~~

现在还有个小小滴问题就素按钮距离底端滴黑框太近鸟~~介个素因为,介个Composite只有一行,所以要改变按钮距离底端滴距离,那么DialogArea滴大小就要跟着改变,而现在偶们滴DialogArea所需要滴背景图片还米改好,于是只有这样鸟~~~大家应该知道在哪里设置底边的边距吧?就素createButtonBar方法中滴那个layout.marginHeight =xxx :)

最后别忘了,整个对话框的高度,应该是Window Title Bar,Content Area和Button Bar三部分滴和。

偶已经说完鸟,如果觉得偶滴介篇文章对你有些帮助的朋友,请去支持一下偶们美丽可爱滴靓颖同学滴新专辑The One吧:)多谢!

评论

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 10:05 by wolfsquare
这是在写技术文章,还是小学生作文?

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 11:43 by 小小凉粉
偶只素想写滴浅显易懂一些.....

wolfsquare对什么地方不满意?

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 11:45 by 小小凉粉
偶介个米深度咩?

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 14:53 by nickey
能不能说中文?

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 20:05 by 慈悲鱼
觉得作者说话怪,是不是我太老了

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-17 21:45 by 小小凉粉
作技术的人,也要关注一下流行好不好...

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2006-10-18 14:54 by 123bingbing
增开7群,号码 30440732
8群 30756649
9群 30178567
10群 28694497

我们的qq群:15096318 学习程序的都可以来

# re: [rcp系列]用RCP做出漂亮的对话框[未登录]  回复  更多评论   

2008-05-05 09:52 by an
不知所云~

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2008-05-16 17:44 by WHAPPLEKING
实在太感谢了,要不我死也弄不出来啊

# re: [rcp系列]用RCP做出漂亮的对话框[未登录]  回复  更多评论   

2008-08-21 16:49 by 路人乙
不错 赞

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2008-09-28 23:02 by 桃花岛主
你的文章还是不错的,但通俗易懂也不是这样写呀,请把 捏鸟 之类的去掉啊,我看着头疼,真的.我都是煞眉头看的.因为这并不是网络语言,根本就是你们地方土话啊!

# re: [rcp系列]用RCP做出漂亮的对话框  回复  更多评论   

2011-11-25 11:41 by shenfx
看完我整个人都鸟了~

只有注册用户登录后才能发表评论。


网站导航: