Centering Text using a Visual Element

4 posts, 0 answers
  1. jesse
    jesse avatar
    6 posts
    Member since:
    Jul 2014

    Posted 10 Aug 2015 Link to this post

    I am customizing a tile being put into a Panorama.  I want some text to the lower part of the tile.  I've done this by creating a "LightVisualElement" and adding it to the tile's children... I then add a RadLabelElement to that VisualElement and set it's text.  I would like that ext to be centered to the lower middle of the tile, however nothign I can do can make this happen.

     

    I am setting the VisualElement's alignment to BottomCenter, and tried the same with the RadLabelElement.  Any suggestions would be greatly appreciated.

     

    LightVisualElement lowerElement;

    lowerElement.Alignment = ContentAlignment.BottomCenter;

    lowerElement.StretchHorizontally = true;​

    tile.Children.Add(lowerElement);

    RadLabelElement deviceInfo = new RadLabelElement();

    deviceInfo.StretchHorizontally = true;

    deviceInfo.TextAlignment = ContentAlignment.BottomCenter;​

    deviceInfo.Alignment = ContentAlignment.BottomCenter;​

    lowerElement.Children.Add(deviceInfo);

    etc.... none of that helps.

  2. Dimitar
    Admin
    Dimitar avatar
    1404 posts

    Posted 11 Aug 2015 Link to this post

    Hello Jesse,

    Thank you for writing.

    The LightVisualElement can display text as well. This is why you do not need to add a label. The following snippet shows how you can position the text:
    class CustomTileElement : RadTileElement
    {
        LightVisualElement customInfo;
        protected override void CreateChildElements()
        {
            base.CreateChildElements();
     
            customInfo = new LightVisualElement();
            customInfo.Text = "MyText";
            customInfo.StretchVertically = false;
            customInfo.Alignment = ContentAlignment.BottomCenter;
            this.Children.Add(customInfo);
          
        }
        protected override Type ThemeEffectiveType
        {
            get
            {
                return typeof(RadTileElement);
            }
        }
    }

    Please let me know if there is something else I can help you with. 
     
    Regards,
    Dimitar
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. UI for WinForms is Visual Studio 2017 Ready
  4. jesse
    jesse avatar
    6 posts
    Member since:
    Jul 2014

    Posted 11 Aug 2015 in reply to Dimitar Link to this post

    Thank you, this works fine.  The next question I have is how do I place the Tile Text in a specific location?  Instead of just top center or something like that, I want to place the tile text *just* above the customInfo text location.
  5. Dimitar
    Admin
    Dimitar avatar
    1404 posts

    Posted 14 Aug 2015 Link to this post

    Hello Jesse,

    Thank you for writing back.

    The TextAlignment property can be used to set the text position. For example:
    CustomTileElement tile = new CustomTileElement();
    tile.TextAlignment = ContentAlignment.TopCenter;

    If this is not suitable for your case you can add another LightVisualElement. The following article shows how you can build an item with advanced layout: Custom Tiles

    Let me know if you have additional questions.

    Regards,
    Dimitar
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top