Is it possible to have text in gallery item in several lines? I don't need a description text, but do need long main text. Was trying to do it with the code below, but if the text is really-really long then it will be clipped off on the top and on the bottom. I would expect ellipsis cutting the text, not clipping on top and bottom.
var item =
new
RadGalleryItem(text, image);
item.MaxSize =
new
Size(300, 64);
item.TextImageRelation = TextImageRelation.ImageBeforeText;
item.Children[2].Children[1].Children[1].Visibility = ElementVisibility.Collapsed; // hide description
((TextPrimitive)item.Children[2].Children[1].Children[0]).TextWrap =
true
;
5 Answers, 1 is accepted
0
Hello, Mihajlo,
Enabling the TextWrap property for the respective TextPrimitive is a suitable approach. It behaves as expected on my end. Following the provided information, I was unable to reproduce the issue you are facing. Please refer to the below screenshot illustrating the behavior on my end with the specified version. I have attached my sample project. Feel free to modify it in a way to reproduce the experienced issue and get back to me with it so I can investigate the precise case. Thank you in advance.
I am converting this forum thread into a support ticket in order to allow attachments. You can find the ticket in Your Telerik Account.
I am looking forward to your reply.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Enabling the TextWrap property for the respective TextPrimitive is a suitable approach. It behaves as expected on my end. Following the provided information, I was unable to reproduce the issue you are facing. Please refer to the below screenshot illustrating the behavior on my end with the specified version. I have attached my sample project. Feel free to modify it in a way to reproduce the experienced issue and get back to me with it so I can investigate the precise case. Thank you in advance.
I am converting this forum thread into a support ticket in order to allow attachments. You can find the ticket in Your Telerik Account.
I am looking forward to your reply.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Mihajlo
Top achievements
Rank 1
Iron
answered on 01 Mar 2019, 10:51 AM
To observe the problem you need at least 5 lines of text. The text is then clipped out of view, with no ellipsis. Also, if ribbon bar's height increases due to some additional ribbon elements then the long text "spills" over the boundary rectangle. Try with this code added to the sample project:
RadRibbonBarGroup buttonGroup;
public
RadForm1()
{
InitializeComponent();
this
.buttonGroup = InitializeGroup(
"Group"
);
this
.buttonGroup.Items.Add(InitializeMediumButton(
null
,
"button1"
));
this
.buttonGroup.Items.Add(InitializeMediumButton(
null
,
"button2"
));
this
.buttonGroup.Items.Add(InitializeMediumButton(
null
,
"button3"
));
this
.ribbonTab1.Items.Insert(0,
this
.buttonGroup);
this
.radGalleryItem1.Text = String.Concat(Enumerable.Range(1, 20).Select(x => x.ToString(
"D9"
) +
" "
));
this
.radGalleryItem1.MaxSize =
new
Size(200, 64);
((TextPrimitive)
this
.radGalleryItem1.Children[2].Children[1].Children[0]).TextWrap =
true
;
}
protected
virtual
RadRibbonBarGroup InitializeGroup(
string
text)
{
RadRibbonBarGroup group =
new
RadRibbonBarGroup();
group.Padding =
new
System.Windows.Forms.Padding(3, 0, 3, 0);
group.Orientation = System.Windows.Forms.Orientation.Vertical;
group.Text = text;
return
group;
}
protected
virtual
RadButtonElement InitializeMediumButton(System.Drawing.Image img,
string
text)
{
RadButtonElement button =
new
RadButtonElement();
button.Image = img;
button.Padding =
new
System.Windows.Forms.Padding(3);
button.TextAlignment = ContentAlignment.MiddleLeft;
button.Text = text;
button.TextImageRelation = System.Windows.Forms.TextImageRelation.ImageBeforeText;
return
button;
}
0
Hello, Mihajlo,
The provided sample project is greatly appreciated. I was able to replicate the problem you are facing.
RadGalleryElement allows the user to choose among large number of visual items. In its default collapsed view, a gallery shows a single row of its items, as well as an up arrow and a down arrow that scroll to other rows of items. Note that you can enlarge the gallery popup by resizing the grip as it is illustrated in the attached gif file. The RadGalleryItem needs more space than the default ribbon's height. That is why the whole content of the multi-line gallery item is not displayed.
The possible solution that I can suggest is to increase the height of the ribbon group. The following code snippet achieves the illustrated result:
I hope this information helps. If you need any further assistance please don't hesitate to contact me.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
The provided sample project is greatly appreciated. I was able to replicate the problem you are facing.
RadGalleryElement allows the user to choose among large number of visual items. In its default collapsed view, a gallery shows a single row of its items, as well as an up arrow and a down arrow that scroll to other rows of items. Note that you can enlarge the gallery popup by resizing the grip as it is illustrated in the attached gif file. The RadGalleryItem needs more space than the default ribbon's height. That is why the whole content of the multi-line gallery item is not displayed.
The possible solution that I can suggest is to increase the height of the ribbon group. The following code snippet achieves the illustrated result:
public
RadForm1()
{
InitializeComponent();
this
.radGalleryItem1.Text = String.Concat(Enumerable.Range(1, 20).Select(x => x.ToString(
"D9"
) +
" "
)) +
" END"
;
this
.radGalleryItem1.MaxSize =
new
Size(200, 0);
((TextPrimitive)
this
.radGalleryItem1.Children[2].Children[1].Children[0]).TextWrap =
true
;
}
private
void
RadForm1_Load(
object
sender, EventArgs e)
{
this
.radRibbonBarGroup1.AutoSize =
false
;
this
.radRibbonBarGroup1.Size =
new
Size(
this
.radRibbonBarGroup1.Size.Width, 130);
this
.radRibbonBarGroup1.MinSize =
new
Size(0, 130);
}
I hope this information helps. If you need any further assistance please don't hesitate to contact me.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
0
Mihajlo
Top achievements
Rank 1
Iron
answered on 04 Mar 2019, 04:47 PM
But the text could be horribly-mindbogglingly long. I can't have a half-screen wide ribbon bar. So, if I want maximum three lines of text with ellipsis in the end if there's more, I would just have to figure out how to measure the text and manually cut the text with the ellipsis.
0
Accepted
Hello, Mihajlo,
If you specify the MaxSize of the TextPrimitive and enable its AutoEllipsis property, I hope that you will obtain the desired result:
Should you have further questions please let me know.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
If you specify the MaxSize of the TextPrimitive and enable its AutoEllipsis property, I hope that you will obtain the desired result:
this
.radGalleryItem1.Text = String.Concat(Enumerable.Range(1, 20).Select(x => x.ToString(
"D9"
) +
" "
)) +
" END"
;
this
.radGalleryItem1.MaxSize =
new
Size(200, 64);
((TextPrimitive)
this
.radGalleryItem1.Children[2].Children[1].Children[0]).TextWrap =
true
;
((TextPrimitive)
this
.radGalleryItem1.Children[2].Children[1].Children[0]).AutoEllipsis =
true
;
((TextPrimitive)
this
.radGalleryItem1.Children[2].Children[1].Children[0]).MaxSize =
new
Size(200, 64);
Should you have further questions please let me know.
Regards,
Dess | Tech Support Engineer, Sr.
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.