Customized ListViewItem : auto size in middle & resize

1 Answer 266 Views
ListView
Vincent
Top achievements
Rank 1
Iron
Iron
Vincent asked on 19 May 2021, 02:17 PM | edited on 19 May 2021, 02:17 PM

Hi !

I'm using a customized listviewitem and i've got this problem, after 2 days on a listviewitem ! :

see attach.

my vertical StackLayoutElement not take availble size.

i want only this part take availble and resize when resize my form


 private class interlocuteurVisualItem : SimpleListViewVisualItem
        {
            private LightVisualElement entite;
            private LightVisualElement localisation_Add;
            private LightVisualElement localisation_Com;
            private LightVisualElement typeInterlocuteur;            

            protected override void CreateChildElements()
            {
                this.AutoSizeMode = Telerik.WinControls.RadAutoSizeMode.FitToAvailableSize;

                StackLayoutElement layoutPanel = new StackLayoutElement();
                layoutPanel.Orientation = Orientation.Horizontal;
                layoutPanel.MinSize = new Size(layoutPanel.MinSize.Width, 100);                

                //Entite
                this.entite = new LightVisualElement();
                this.entite.TextWrap = true;
                this.entite.MinSize = new Size(200, 80);
                this.entite.Size = new Size(200, 80);
                this.entite.DrawBorder = true;                    
                this.entite.StretchHorizontally = false;
                this.entite.Alignment = ContentAlignment.MiddleLeft;
                this.entite.TextAlignment = ContentAlignment.MiddleLeft;
                layoutPanel.Children.Add(entite);

                //Localisation
                StackLayoutElement layoutPanel_Localisation = new StackLayoutElement();
                layoutPanel_Localisation.Orientation = Orientation.Vertical;
                layoutPanel_Localisation.AutoSize = true;
                layoutPanel_Localisation.AutoSizeMode = Telerik.WinControls.RadAutoSizeMode.FitToAvailableSize;
                layoutPanel_Localisation.Alignment = ContentAlignment.MiddleLeft;
                layoutPanel_Localisation.StretchHorizontally = true;
                layoutPanel_Localisation.StretchVertically = true;


                //Localisation adresse
                this.localisation_Add = new LightVisualElement();               
                this.localisation_Add.Alignment = ContentAlignment.BottomLeft;
                this.localisation_Add.TextAlignment = ContentAlignment.MiddleLeft;
                this.localisation_Add.DrawBorder = true;
                this.localisation_Add.TextWrap = true;
                this.localisation_Add.StretchHorizontally = true;
                layoutPanel_Localisation.Children.Add(localisation_Add);

                //Localisation CP & Commune
                this.localisation_Com = new LightVisualElement();
                this.localisation_Com.Alignment = ContentAlignment.BottomLeft;
                this.localisation_Com.TextAlignment = ContentAlignment.MiddleLeft;
                this.localisation_Com.TextWrap = true;
                this.localisation_Com.DrawBorder = true;
                this.localisation_Com.StretchHorizontally = true;
                layoutPanel_Localisation.Children.Add(localisation_Com);

                layoutPanel.Children.Add(layoutPanel_Localisation);

                // typeInterlocuteur
                this.typeInterlocuteur = new LightVisualElement();
                this.typeInterlocuteur.MinSize = new Size(200, 80);
                this.typeInterlocuteur.Size = new Size(200, 80);
                this.typeInterlocuteur.StretchHorizontally = false;
                this.typeInterlocuteur.TextWrap = true;
                this.typeInterlocuteur.TextAlignment = ContentAlignment.MiddleLeft;
                this.typeInterlocuteur.DrawBorder = true;

                layoutPanel.Children.Add(typeInterlocuteur);

                this.Children.Add(layoutPanel);
                base.CreateChildElements();
            }

            protected override void SynchronizeProperties()
            {
                base.SynchronizeProperties();

                Text = "";
                entite.Text = Convert.ToString(Data["NomEntite"]);
                localisation_Add.Text = $"{Data["Adresse"]}";
                localisation_Com.Text = $"{Data["CodePostal"]} {Data["Commune"]}";
                typeInterlocuteur.Text = Convert.ToString(Data["TypeInterlocuteur"]);
            }


            protected override Type ThemeEffectiveType
            {
                get
                {
                    return typeof(SimpleListViewVisualItem);
                }

            }
        }

1 Answer, 1 is accepted

Sort by
0
Accepted
Dess | Tech Support Engineer, Principal
Telerik team
answered on 20 May 2021, 10:21 AM
Hello, Vincent,

RadListView offers the AllowArbitraryItemHeight and AllowArbitraryItemWidth properties. If set to true, they allow the visual items to be sized according to the required space to fit the content. In addition, the StackLayoutElement, contained in the custom SimpleListViewVisualItem class, offers the StretchHorizontally and StretchVertically properties. This allows stretching the container according to the size RadListView offers. The contained LightVisualElement inside the StackLayoutElement also allows you to specify the vertical/horizontal stretching.
 
I have attached my sample project for your reference which result is illustrated in the gif file.

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Vincent
Top achievements
Rank 1
Iron
Iron
commented on 20 May 2021, 11:55 AM

Thanks for help ! it's work, before my post i've tested with AllowArbitraryItemWidth to my radListView but with no result, and omitted the first item stackLayoutElement. sorry for my stupid question. worked on winform since months, after many years in webforms, too many properties and possibilities
Tags
ListView
Asked by
Vincent
Top achievements
Rank 1
Iron
Iron
Answers by
Dess | Tech Support Engineer, Principal
Telerik team
Share this question
or