Solved

Looking for shaped label control (Bubble)

Posted on 2003-12-07
14
657 Views
Last Modified: 2010-04-05
Hi

I am looking for a shaped label control that will give me a shape like a Hint Bubble - where I can add a Caption.

Like a tooltip but I need to place it on a form to help the user through the use of the software (it needs to be always visible).

My main interest is to use 'hover' buttons (speed buttons with the flat property set to false).

On each form I need to put a speech bubble next to  one of the buttons so that the less savvy will understand that if you hover over them they popup and you can click them!

Before you ask 'Why?' - I am displaying a lot of information to users and I am trying to reduce screen clutter by removing 3d borders and borders in general.

Voodooman



0
Comment
Question by:Voodooman
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 4
  • 2
  • +2
14 Comments
 
LVL 8

Expert Comment

by:gmayo
ID: 9892212
This page might have something like what you're after (shaped tooltips): http://www.torry.net/hints.htm . Or maybe http://www.torry.net/nonrect.htm (FormRgn) .

Geoff M.
0
 
LVL 5

Author Comment

by:Voodooman
ID: 9892275
Hi gmayo

I am not actually after tooltips enhancements.

I am actually after a bubble (always visible) that I can add to a form with a caption.

An image control is not good because it does not make the non visible part of the bubble transparent.

Any Ideas?

Voodooman
0
 
LVL 8

Expert Comment

by:gmayo
ID: 9892347
You can make tooltips permanently visible, hence the tip (gettit?). Perhaps you want something like this: http://www.torry.net/transparentlabels.htm . Or one of the many other label types. Do you have a picture of what you want?

Geoff M.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 5

Author Comment

by:Voodooman
ID: 9892489
Hi gmayo

I am looking to have tootips that are permanently visible.

I would prefer bubble tips as this would look suitably cool.

I really cant see a way to make them permanently visible.

I can easily create an Image with the tip (there are not that many) and make the background transparent (gif).

When I load it into the image control the background is visible - not what I am looking to achieve.

Thanks

Voodooman
0
 
LVL 11

Expert Comment

by:robert_marquardt
ID: 9894627
Transparent is not a good idea because it may make the text hard to read.
Have a look at the JediVCL http://sourceforge.net/projects/jvcl
There is a custom Tooltip component included with comic book speech bubble look.
0
 
LVL 5

Author Comment

by:Voodooman
ID: 9895301
Hi Robert

I have searched the JediVCL and cannot find the control you mention.

I have also searched the Website  - can you point me at it?

I have had some success by creating a transparent gif of a bubble with the text on it.  

This works ok but would be better if I could just add a caption instead of having to create an image for each tip.

There is also the issue of program size to consider.  It would increase the download speed considerably.

Best Regards

Voodooman
0
 
LVL 11

Expert Comment

by:robert_marquardt
ID: 9895889
JvBalloonHint.pas
Maybe you need the JVCL 3, but be careful because it is in mid-development and needs some Delphi knowledge to be installed.
0
 
LVL 2

Expert Comment

by:-Karamja-
ID: 9899836
Try looking at this -
http://www.swissdelphicenter.ch/torry/showcode.php?id=1555

Hope this helps..
0
 
LVL 34

Expert Comment

by:Slick812
ID: 9935084
hello Voodooman, , , A TLabel is a TGraphicControl, which means that it is NOT a windowed control, and just "Draws" on it's parent's Canvas for it's display, You say you have a Method for drawing a "Bubble" like you want. I would just get the Form's   OnPaint  event and in this draw your bubbles where you want them on the form, and then just do a Canvas.TextOut( ) and draw the Text inside this bubble, you might could have a procedure to draw bubbles and text with a Left, Top, Right and Bottom parameters. . . . . I'm not sure about your concern for transparency, as if you want these bubbles to be On top of  windowed controls, which would be a problem with a TLabel or drawing in the OnPaint event, if you really need to  Draw OVER windowed controls, you might could use the   GetWindowDC( ) function
0
 
LVL 34

Expert Comment

by:Slick812
ID: 9935116
If you have a "Picture" of this bubble and text, if you get it into a TBitmap you can use the TBitmaps Transparent to draw this bitmap in the OnPaint Event and have it transparent, which may be better than a "GIF" thing
0
 
LVL 34

Accepted Solution

by:
Slick812 earned 125 total points
ID: 9936082
It seems that if you want these text bubble things to be Over Top of other windowed controls, then you will need to make it a windowed control, here is some code for a simple Text Bubble kinda thing component, it uses a Region to shape the Text Bubble, and draws some text on it


unit TextBubble;

interface
uses
  SysUtils, Windows, Messages, Classes, Graphics, Controls;

type
TTextBubble = class(TCustomControl)
  private
  { Private declarations }
    FColor: TColor;
    FText: String;
    FRgn1: Integer;
    procedure SetColor(Value: TColor);
    procedure SetText(Value: String);
    function DoRegion: hRgn;
    procedure WMSize(var Message: TWMSize); message WM_SIZE;

  protected
  { Protected declarations }
    procedure Paint; override;
    procedure CreateParams(var Params: TCreateParams); override;
    procedure CreateWnd; override;
  public
  { Public declarations }
    constructor Create(AOwner: TComponent); override;
    destructor Destroy; override;
    property Canvas;

  published
  { Published declarations }
    property Color: TColor read FColor write SetColor default $E4FBFB;
    property Caption: String read FText write SetText;
    property Width default 120;
    property Height default 62;

end;

procedure Register;

implementation

procedure Register;
begin
RegisterComponents('Samples', [TTextBubble]);
end;

constructor TTextBubble.Create(AOwner: TComponent);
begin
inherited Create(AOwner);
ControlStyle := [csAcceptsControls, csOpaque, csReplicatable];
FColor := $E4FBFB;
Width := 120;
Height := 62;
end;


destructor TTextBubble.Destroy;
var
i, j: Integer;
begin
DeleteObject(FRgn1);
inherited Destroy;
end;

procedure TTextBubble.CreateWnd;
begin
inherited;
FRgn1 := DoRegion;
if FRgn1 <> 0 then
SetWindowRgn(Handle, FRgn1, TRUE);
end;

procedure TTextBubble.CreateParams(var Params: TCreateParams);
begin
inherited CreateParams(Params);
with Params do
  begin
  Style := Style and not WS_BORDER;
  WindowClass.style := WindowClass.style and not (CS_HREDRAW or CS_VREDRAW);
  end;
end;

function TTextBubble.DoRegion: hRgn;
var
RgnP: Integer;
AryPts: Array[0..3] of TPoint;

begin
AryPts[0].x := 0;
AryPts[0].y := Height;
  AryPts[1].x := (Width shr 1)-10;
  AryPts[1].y := (Height shr 1) -10;
AryPts[2].x := (Width shr 1)+10;
AryPts[2].y := (Height shr 1) +10;
  AryPts[3] := AryPts[0];
if Height > 46 then
Result := CreateEllipticRgn(0,0, Width, Height- 10)
else
CreateEllipticRgn(0,0, Width, Height- 4);
RgnP := CreatePolygonRgn(AryPts, 4, WINDING);
CombineRgn(Result, Result, RgnP, RGN_OR);
DeleteObject(RgnP);
end;

procedure TTextBubble.WMSize(var Message: TWMSize);
var
RgnO: Integer;
begin
inherited;
RgnO := FRgn1;
FRgn1 := DoRegion;
if FRgn1 > 31 then
SetWindowRgn(Handle, FRgn1, TRUE);
DeleteObject(RgnO);
Paint;
end;

procedure TTextBubble.SetColor(Value: TColor);
begin
if Value <> FColor then
  begin
  FColor := Value;
  InValidate;
  end;
end;

procedure TTextBubble.SetText(Value: String);
begin
if Value <> FText then
  begin
  FText := Value;
  InValidate;
  end;
end;

procedure TTextBubble.Paint;
var
cRect: TRect;
ColorO: TColor;
begin
inherited;
cRect := ClientRect;
if Height > 46 then
cRect.Bottom := cRect.Bottom- 10
else
cRect.Bottom := cRect.Bottom- 4;
with Canvas do
  begin
  ColorO := Brush.Color;
  Brush.Color := FColor;
  FillRect(GetClientRect);
  if Length(FText) > 0 then
  DrawText(Handle, PChar(FText), -1, cRect, DT_CENTER or DT_SINGLELINE or DT_VCENTER);
  Brush.Color := ColorO;
  end;
end;

end.

 - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  --

this is just a "DEMO" and is not complete, it does not include any variation in the bubble point thing direction, but you can code that in if you need it
0
 
LVL 5

Author Comment

by:Voodooman
ID: 9937167
Hi Slick812

I agree that making a component is the way to go.

I just want to drop a bubble on to the page and enter its caption property. It would be a simple thing to make 4 controls -left bubble, top bubble etc - each with a different bubble image.

Transparent GIFs work well in an image control and have background transparency over the 'not buuble' part of the image - only the background colour is tranparent.

Graphics packages are quite variable in their ability to make transparent GIF's - I found that the transparent GIF made with Photo Impact works fine.

Thanks for the code - its a good start

Voodooman

0
 
LVL 34

Expert Comment

by:Slick812
ID: 9938334
A Gif is a Compressed Bitmap, and has no meaning when using the Windows system graphic display, all image files (GIF, JPEG) have to be converted into a system Bitmap before they can be shown on a monitor, that why I said to try and use the TBitmaps transparent thing
0
 
LVL 5

Author Comment

by:Voodooman
ID: 9938934
Hi

I drew a yellow bubble in Photo Impact with a black border.

I saved as a GIF.  Before saving I set 'Transparency to True'.

I set the mask to white (the background of the square area of the picture around the bubble).

I loaded the GIF into an image control.  The white background of the picture had become transparent and I can see the form background through what white areas there were on my original picture.

When I change the background of the form the image appears as a bubble surrounded by the colour of the form - it works with any shape.

Try it yourself - it works - I have just repeated it with a star shape.

One thing that keeps the work we do interesting is that there are new challenges everyday.

Voodooman
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you ever had your Delphi form/application just hanging while waiting for data to load? This is the article to read if you want to learn some things about adding threads for data loading in the background. First, I'll setup a general applica…
Introduction Raise your hands if you were as upset with FireMonkey as I was when I discovered that there was no TListview.  I use TListView in almost all of my applications I've written, and I was not going to compromise by resorting to TStringGrid…
In an interesting question (https://www.experts-exchange.com/questions/29008360/) here at Experts Exchange, a member asked how to split a single image into multiple images. The primary usage for this is to place many photographs on a flatbed scanner…

734 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question