'Compound' shapes (cont)

6 posts, 0 answers
  1. Tino
    Tino avatar
    37 posts
    Member since:
    Jul 2017

    Posted 22 Sep Link to this post

    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;
            }
        }
    }
  2. Tino
    Tino avatar
    37 posts
    Member since:
    Jul 2017

    Posted 22 Sep Link to this post

    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.

     

  3. Tino
    Tino avatar
    37 posts
    Member since:
    Jul 2017

    Posted 22 Sep in reply to Tino Link to this post

    I missed left.
  4. Tino
    Tino avatar
    37 posts
    Member since:
    Jul 2017

    Posted 24 Sep Link to this post

    I set label.MaxSize which seems to have fixed the label size issue.
  5. Tino
    Tino avatar
    37 posts
    Member since:
    Jul 2017

    Posted 25 Sep Link to this post

    Please close this thread as I have answered my own question. I have a related issue that I'll create a new thread for.
  6. Dimitar
    Admin
    Dimitar avatar
    1871 posts

    Posted 25 Sep Link to this post

    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.
Back to Top