Hi,
I want to display text above the (bottom) border. Therefore, I am experimenting with RadLabel and tried this by setting the ZIndex of LabelElement.LabelText above the ZIndex of LabelElement.LabelBorder which unfortunately does not work. All overlapping letters are just cut. Now, I would need to expand the controls size by which the border would move further below the text which is not what I want.
How can I achieve this?
It would be even better if the border would leave some space around the text like in your web menu here on any "overlapping" letter ("j", "g", "p", "q", "y") but I assume this is not possible.
2 Answers, 1 is accepted
Rank 2
Iron
Iron
Iron
Solved it via Margin and Padding:
Code:
protected override void OnLoad(EventArgs e) {
base.OnLoad(e);
BackColor = Color.FromArgb(8, 16, 24);
if (radLabel.LabelElement is RadLabelElement label) {
label.Font = new("Segoe UI", 16.75F, FontStyle.Regular, GraphicsUnit.Point, 0);
label.ForeColor = Color.White;
label.Margin = new( 0, 0, 0, 7);
label.Padding = new(10, 0, 10, -7);
}
if (radLabel.LabelElement.LabelBorder is BorderPrimitive border) {
border.BorderDashStyle = DashStyle.Solid;
border.BoxStyle = BorderBoxStyle.FourBorders;
border.Visibility = ElementVisibility.Visible;
border.BottomColor = Color.FromArgb(120, 173, 80);
border.LeftColor =
border.RightColor =
border.TopColor = Color.Transparent;
}
}
Hi M.S.,
Thank you for the provided details.
Upon trying to follow your steps, I am not sure I was able to observe this behavior. Could it be possible to modify the attached project and demonstrate this overlapping so I can take a closer look? My test so far shows that the BorderPrimitve element does not overlap the label text letters. I think I am missing something here. You can also share which theme are you using in your application.
I am looking forward to your reply.
Regards,
Dinko | Tech Support Engineer
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.