This is a migrated thread and some comments may be shown as answers.

'Compound' shapes (cont)

5 Answers 58 Views
Diagram, DiagramRibbonBar, DiagramToolBox
This is a migrated thread and some comments may be shown as answers.
Tino
Top achievements
Rank 1
Tino asked on 22 Sep 2017, 06:32 AM

I thought I'd start a new thread to continue this thread as it's changed a lot.

I'll re-post the code from that thread below, with some mods.

I thought, to make the shape's bounds include my Label text (so I could also drag by the text), I'd set the shape's overall Size equal to the Label width (e.g. 120) + the Shape width (e.g. 150), then set the Label position to 0,0 (instead of use PositionOffset) and set the shape's X position to the Label width (120).

This worked pretty well. I then tested if I could set the Label text's alignment. I tried left, center, right and it seems to work well. The text aligns itself to the rectangle I set for it in ArrangeOverride(). Perfect.

But then I made the Label text longer, and it didn't wrap. So I set TextWrap to true, but it still didn't wrap. Not until it got to the full shape's bounds. If the alignment uses the rect I used in Arrange() then why doesn't the wrapping? If this would work it would be pretty good.

 

RadForm1.cs

using System.Drawing;
using Point = Telerik.Windows.Diagrams.Core.Point;
 
namespace TestDiagram
{
    public partial class RadForm1 : Telerik.WinControls.UI.RadForm
    {
        public RadForm1()
        {
            InitializeComponent();
 
            radDiagram1.IsBackgroundSurfaceVisible = false;
            radDiagram1.BackColor = Color.White;
 
            var dropdownShape = new DropdownShape()
            {
                Position = new Point(100, 100)
            };
            radDiagram1.AddShape(dropdownShape);
        }
    }
}

 

DropdownShape.cs

using System.Drawing;
using System.Drawing.Drawing2D;
using Telerik.WinControls;
using Telerik.WinControls.UI;
 
namespace TestDiagram
{
    class DropdownShape : RadDiagramShape
    {
 
        LightVisualElement rectangle = new LightVisualElement();
        LightVisualElement triangle = new LightVisualElement();
        LightVisualElement label = new LightVisualElement();
 
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
 
            this.Size = new Size(270, 18);
//            this.DrawBorder = true;
 
            label.Text = "Test Label";
            label.TextAlignment = ContentAlignment.TopCenter;
            //label.TextWrap = true;
            //label.PositionOffset = new Size(0, 0);
 
            rectangle.ShouldHandleMouseInput = true;
            rectangle.NotifyParentOnMouseInput = false;
 
            rectangle.DrawFill = true;
            rectangle.BackColor = Color.LightGray;
 
            triangle.DrawFill = true;
            triangle.BackColor = Color.Black;
 
            var rectangleShape = new CustomShape();
            rectangleShape.CreateRectangleShape(0, 0, 1, 1);
 
            var triangleShape = new TriangleShape();
 
            rectangle.Shape = rectangleShape;
            triangle.Shape = triangleShape;
 
            this.Children.Add(rectangle);
            this.Children.Add(triangle);
            this.Children.Add(label);
        }
 
        protected override SizeF ArrangeOverride(SizeF finalSize)
        {
            var result = base.ArrangeOverride(finalSize);
 
            var rectLabel = new RectangleF(0, 0, 120, 30);
            var rectTriangle = new RectangleF(finalSize.Width - 18, 6, 15, 18);
            var rectRectangle = new RectangleF(120, 0, finalSize.Width - 120, 18);
            var rectMain = new RectangleF(0, 0, finalSize.Width, finalSize.Height);
 
            this.label.Arrange(rectLabel);
            this.rectangle.Arrange(rectRectangle);
            this.triangle.Arrange(rectTriangle);
            this.DiagramShapeElement.Arrange(rectMain);
 
            return result;
        }
 
    }
 
    class TriangleShape : ElementShape
    {
        public override GraphicsPath CreatePath(Rectangle bounds)
        {
            var path = new GraphicsPath();
 
            Point[] points =
            {
                new Point( bounds.X, bounds.Y ),
                new Point( bounds.X + 6, bounds.Y),
                new Point( bounds.X + 3, bounds.Y + 6)
            };
 
            path.AddPolygon(points);
 
            return path;
        }
    }
}

5 Answers, 1 is accepted

Sort by
0
Tino
Top achievements
Rank 1
answered on 22 Sep 2017, 06:58 AM

Some images showing left, center & right aligned. I've turned on the Label border, and also the main shape border.

I can now see the text isn't wrapping because the label rect is actually getting bigger with the text.

Thanks for any help.

 

0
Tino
Top achievements
Rank 1
answered on 22 Sep 2017, 06:59 AM
I missed left.
0
Tino
Top achievements
Rank 1
answered on 25 Sep 2017, 12:00 AM
I set label.MaxSize which seems to have fixed the label size issue.
0
Tino
Top achievements
Rank 1
answered on 25 Sep 2017, 05:58 AM
Please close this thread as I have answered my own question. I have a related issue that I'll create a new thread for.
0
Dimitar
Telerik team
answered on 25 Sep 2017, 10:53 AM
Hi Tino,

I will close the thread for now. If you have further questions just post here again and the thread will be reopened.

Regards,
Dimitar
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Diagram, DiagramRibbonBar, DiagramToolBox
Asked by
Tino
Top achievements
Rank 1
Answers by
Tino
Top achievements
Rank 1
Dimitar
Telerik team
Share this question
or