856 views
in GUI Development by

I need to render a effect like this, so a dynamic list of sentences each one with it's rounded background.

Maybe with AttrText I can obtain the effect but without rounded corner? 

Thank you

1 Answer

0 votes
by

To obtain such effect do following:

  • Add a new Bitmap Frame view to your component.
  • Add a new Text view to your component.
  • Configure the Bitmap Frame view to use a bitmap with your desired rounded corners rectangle.
  • Add a new slot method to your component.
  • Assign this slot method to the property OnUpdate of the Text view.
  • Make the Text view large enough for the text or set the property AutoSize of the Text view to true so the view can adjust its size automatically.
  • Implement the slot method:
var rect  area   = Text.GetContentArea();
var point margin = <10,10>;

Frame.Bounds = area * margin;
  • Press F7 to reload the component.

The Text view sends a signal to the associated slot method automatically every time the text changes. The associated slot method is thus perfectly intended to layout decorations around the Text view or to layout other views to the edges of the text.

In the particular example the slot method determines the current area occupied by the text, enlarges this area by a 10 pixel wide margin and arranges the Frame view at this calculated area.

Regarding the drawing of rounded rectangles see following article:

http://ask.embedded-wizard.de/177/drawing-rounded-rectangles

    Ask Embedded Wizard - Archive

    Welcome to the Ask Embedded Wizard archive. This community forum served us well for many years, but we've evolved our support approach!

    Your resources:

    The Embedded Wizard Online Documentation provides comprehensive documentation, tutorials, examples and ready-to-use software packages.

    For dedicated assistance, explore our Embedded Wizard Product Support.

    You can still browse the valuable discussions from our community history here.

    Embedded Wizard Website | Privacy Policy | Imprint

    ...