[rcp系列]用RCP做出漂亮的对话框

Posted on 2006-10-16 18:11 小小凉粉阅读(4193) 评论(12) 编辑收藏

首先是一个效果图：

为了不违反保密协议，偶在这里把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;
    }

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

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

composite.setBackgroundMode(SWT.INHERIT_DEFAULT);

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

如上图所示，介个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, false, false));

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

为什么会素介个样子捏？即使素把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, false, false);
        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, false, false);
        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

看完我整个人都鸟了~

新用户注册刷新评论列表


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




网站导航: 博客园 IT新闻知识库 C++博客博问管理

花痴无极限，凉粉Forever